By Janet Lewison
HTML is essential in building web pages and is very simple to understand and use. It is free and is supported by any browser. HTML and CSS both favored by search engines and hence are used during web development extensively.
CSS helps in decreasing the size of the whole code by encapsulating within groups while helps websites to load quicker than they usually do. CSS gives better flexibility and features than HTML too also in terms of design and the overall impact. The World Wide Web Consortium (W3C) recommends both languages for web development.
Round corners for boxes or images are another way to make your content a little more interesting, and add a little bit of flair. In times past you had to create the box and corners yourself using Photoshop or some other photo editing application and then save the images as a PNG so they maintained their transparency level. Finally, you had to place them in a dozen or so strategically positioned DIV tags, so they all fit together and looked like a single image, and of course hope that every browser out there read the markup the same. With CSS you don't need to do all of that. Now you simply create a rule for a DIV tag with a contrasting background color, like say a white area on a black background, and then add the additional rule to round off the corners ( moz-border-radius: 10px;). If you want a shadow for the box, then simply add (box-shadow: 10px 10px 5px #888;) for that class or id in your CSS file.
Use External CSS Syle Sheets CSS files are cached by all web browsers and therefore do not need to be downloaded every time a new HTML document is requested from the server. Therefore it is important that you move away from inline CSS styling on your pages and instead put all of your CSS on an external style sheet to take advantage of browser caching and reduce your page-loading times.
There are literally hundreds, if not thousands of CSS tricks you can use to fancy up your site. Some of the more popular ones are transparency or opacity settings, image rotating, hover boxes for image previewing, alert boxes, round corners, text shadowing, CSS based navigation menus and much, much more. I say use them as you see fit. Maybe Microsoft will eventually realize they're product is missing the boat and they'll actually incorporate allowances for these great code techniques into a future version of Internet Explorer. Until then, I guess those visitors are just missing out.
Use a CSS Compression Program There are a number of sites that offer free CSS compression and they are extremely easy to use. Simply copy and paste the contents of your single CSS style sheet and let their compression tool shrink the size of your code. This step will can often reduce the size of your CSS file by up to 50% without comprising the integrity of your code.
Final Thoughts: If you follow the above steps you should hopefully be able to significantly reduce the size of your sites CSS which will in turn give you minor SEO benefits whilst also improving the performance of your site for the most important people of all, your visitors.
0 comments:
Post a Comment