Mmm... alternate stylesheets

Monday, 2006-04-03; 02:05:00



Not convinced about the merits of CSS and why you should separate out appearance from content? Well, click "Right Navigation, Blue Color" in the new Appearance section of the navigation sidebar. CSS makes it easy to allow users to customize the appearance of your site.

Not convinced about the merits of using CSS for positioning instead of tables? Click "Left Navigation, Red Color" in the navigation sidebar. Yes, that's right, you can now choose which side on which to have the navigation sidebar. Try doing THAT with tables. Heh, have fun!

I don't particularly like the appearance section in the sidebar: I hope to eliminate it entirely by having a set of cute buttons that will be in the upper right corner of the banner rather than in the sidebar. (That has the good effect of not moving the alternate stylesheet buttons around.) But for now, this'll do.

Oh, and by the way? Your preference on appearance is now saved in one of those evil things called cookies. So if you like something other then "Right Navigation, Red Color" (which is the default), you don't have to click the link every time to get this page to your preferred appearance.

(I had a brief problem with this method, but I think it was just because of browser cache -- initially, the first time I loaded the page without having specified a preference of stylesheets, the page appeared completely unstyled. But I've done some further testing and it seems to be fine now. Let me know if you have any problems.)

If you want to implement stylesheet switching and stylesheet cookie saving, you should take a look at this excellent tutorial over at A List Apart. It has everything you need to know about what to put in your HTML files to let your pages know about all the different stylesheets, how to implement stylesheet switching, and how to save it in cookies. Best of all, the tutorial provides a downloadable JavaScript file that contains all the functions that handle everything -- there's literally no need for you to code anything besides HTML and CSS.

Yay standards! Yay CSS! Boo tables! Yay cookies! Mmmm.... cookies. *drools like Homer*


Technological Supernova   Tips   Older   Newer   Post a Comment