I have thought about serving my homepage using a couple of different themes which are made to utilize the client resolution better than what is possible using one flexible layout in CSS 1-2.
It's mostly a philosophical issue whether this is good practice or not. Until CSS is mature enough I have decided to use "any means available" to give the visitors a nice layout. (As I do not have many visitors I'm mostly doing it for fun and to follow my conclusion that this is the way to do it.)
As I'm using WordPress I plan to create several themes specific for different resolutions. I then need a mechanism to choose the correct theme for the specific visitor. It might work like this: Link
The above activity diagram is intentionally vague as I wanted to discuss some aspects of it with more experienced people than me. Currently the different themes and their intention are listed below:
* <800x600: People using PC/Mac etc with a resolution lower than 800x600. Also people visiting using XHTML 1.0 compatible mobile phones and people using Pocket PC:s. The design will be one column and use the full screen width, content is placed as close to the top as possible and archive links etc at the bottom of the page.
* 800x600: Two columns. Content at the left part and I'll try to keep the meta column small. Adjust the font size so that about the same number of characters fits horizontally in the content column as the following designs.
* 1024x768: Three columns. Content in the center part. Meta column to the left and a "sideblog" in the right column. Adjust the font size so that about the same number of characters fits horizontally in the content column as the other designs with fixed content column width.
* >=1280x1024: Three columns. Content in the center part. Meta column to the left and a "sideblog" in the right column. Adjust the font size so that about the same number of characters fits horizontally in the content column as the other designs with fixed content column width. The whole design has a static width and is made for 1280x1024. The three columns are centered horizontally if the user is using >1280x1024.
* Is it easy and reliable to check the display resolution of the visiting user? Are there more than one way to do it?
* If the user has an account at my site (using WordPress) and is logged in he/she should be able to choose the design there and always use it. Or choose to have the automatic feature enabled in case they access the page using different devices often. Does it sound good?
* If the user does not have an account at my site. The information is stored in a cookie. If the user has cookies disabled, what should I do then?
* Any other comments/suggestions?
If I get this going I'm planning to create a plugin for WordPress which solves this in the most modularized apporach possible.
All feedback will be greatly appreciated!