So I worked hard today and then they let us out early and I came home and decided to spend my bonus hours working on a standards-compliant version of the Bastad. I am happy to say that I succeeded and I now have the basics of a XHTML 1.0 Strict . The only real major thing I’ve adjusted—and I wanted to make this adjustment—was to strip out the image-based navigation and replace it with text-based navigation. Too many images means too much bandwidth. And part of the reason I want to make all my pages standards-compliant is because it will result in lower page sizes and less bandwidth usage on my part.
Okay, I’m getting ahead of myself. Here is the new page for your viewing pleasure (ED: Link no longer available). Make sure to view the source to check out what I’m doing. I made no attempts to make the code look pretty at this time, but it should still be readable.
Now, hopefully that page looks remarkably similar to the current frontpage of The Bastad. I haven’t added the member links or the search box yet, because I wanted to get the basics down first. The reason it looks the same, without all the gobbely-gook code that powers the present page is because of this stylesheet (ED: Link no longer available).
Basically, as I was trying to tell Stephanie tonight, it’s all about the separation of form from content. The actual HTML file should have no information about how the page looks. The HTML file should consist only of the text and markup to differentiate what’s a header and what’s regular text. The code that tells the browser what a header is (what color it is, what size, etc.) should be in the stylesheet. The code that tells the browser what color the background is and what font the text is and all that, should all be in the stylesheet.
I am reading back over this and realizing I should never attempt to write articles on coding. I’m not sure Jimmy should really want me to be the one to teach him this. His head might explode because of my poor teaching ability.
Now, hopefully this looks good in your browser. If you’re using anything modern, it should. If you’re using something older, like Netscape 4.x, it should fail gracefully. That’s the whole idea of this design. There are a couple of tags included to make it work on all standards-compliant browsers and fail and just display the text for non-standards compliant browsers.
It should also display in a logical, readable order in text browsers, on cellphones, and things like that. It should be accessible in general.
Anyway, now that I’ve made absolutely no sense, I’m going to go back to bed. It’s a huge accomplishment, I think, but I’m not sure I’ve gotten that across.