W3C Web Standards - Code Explanation
(Page 6 of 7 )
We've accomplished a number of things here. We've altered the positioning of the logo with 'float', we've modified the font of a few of the items, and gave the content a nice bordered box to sit in. We've also pushed things over and down and around without using any spacer GIFs! Isn't this the greatest thing? Maybe even better than sliced bread! I would even say this approaches the greatness of the $6.99 party-sized pizza!
You'll notice I made the header an actual XHTML heading instead of just another <div>. This kills two birds. The first is SEO, a search engine will give a little more priority to a true heading instead of text just made to look bigger. Also, if the site is deconstructed, or perhaps the style sheet is unavailable for one of the many reasons that style sheets often choose to become unavailable, the browser still will render a heading in the default fashion. This will help form the page hierarchy.
I also gave the navigation a background image, configured to not repeat. This is a great feature in CSS2.
You'll want to take my example here and tweak it and use it for your whole page. You can combine the redefinition of XHTML elements such as the body tag, creating your own custom classes, and defining sections within the page.
You will be simply amazed at how easy it is to just change one line of the CSS file, and all of the pages in your site reflect the change, whether it be a small change or something drastic.
Next: Third Component: ECMAScript >>
More HTML Articles
More By Justin Cook