We use CSS Style Sheets. We'd used CSS Style Sheets for years (starting in 2001). We were Amateurs. We missed the point of CSS.
Phew! The Mea Culpa's are over. Here's the point we missed. We thought CSS was a cool way to bury all that format and color and font stuff in one place, that is, we took the word style too seriously. It is really about separation of content and layout.
So in mid 2003 we decided to throw out all our historic liquid table layouts and moved to a new CSS three column liquid layout. We document the experience below.
| Accessibility |
Web sites were supposed to be built with accessibility in mind - primarily for the visually impaired. As the baby boomers age they are increasing falling into this category. That's a big, and rapidly growing, bunch of people not being well served by the current kluges on offer from the browser families due to an industry-wide failure. This page reviews the situation and suggest possible solutions. Truth be told it's a bit of a rant, but a gentle, mild-mannered, one. |
| HTML5 Conversion |
So the new holy grail for web folks is HTML5. Truth be told we got very ticked off in 2010'ish when the about-face from XHTML (never big fans) to HTML5 happened. Before the end of this millenium we'll probably have a stable HTML5 standard. Nevertheless, hope triumphs over experience. We started HTML5 page validation on some pages and are progressively converting. Why is this page in the CSS section - because for us almost all the changes relate to CSS - raw HTML in converted pages is less than it was. Would we use any true HTML5 features at this stage (end 2013)? Are we crazy? But, sometime before the end of the millenium - absolutely. |
| CSS 3 column layout |
When we converted the site to a CSS three column liquid layout in mid 2003 we did a lot of experimentation and made a number of compromises. This page describes what we did, what we had to do and how we got there. The kluges and trade-offs. Includes links to our original table based liquid design for contrast. |
| CSS menus |
With the right browser, perfect pop-up, pop-down and multi-level menus without 20K of javascript - replaced with about 10 lines of CSS. This section explains with worked examples of good and bad experiments how we moved from javascript to pure CSS menus for Opera and Gecko in mid 2003 (2013 covers MSIE, Chrome, Safari and all the other guys who came late to the W3C compliant party). If the bottom of the right hand menu on this page shows a CSS Popup button you have a decent browser. |
| CSS Guide |
Part of our One Page initiative. Contains a guide to all those CSS selectors, pseudo classes, '#' and stuff. CSS short forms for two fingered typists (like us) instead of border-width-left. Examples of selector usage and links to individual W3C CSS sections. |
| Page Stuff |
HTML vs XHTML: Seems we reached a dead-end and HTML is rising from the ashes. So now what do we do? DOCTYPE: We finally got so offended that the W3C Validator kept giving us warnings about character set conflicts that we thought it was about time to get some more information. It was not as simple as we thought. ACCESSIBILITY: We'd had a guilty conscience for years over accessibility and had looked for decent advice many times. Lots of motherhood but very little practical advice. We recently made some changes that we hope will help. |
| CSS Techniques |
During our journey to a better CSS place we created a number of test pages to experiment with specific problems and techniques. This page describes and links to the various experiments, for example, centering a page, width="100%" problems in divs, conditionally generating text. We have also added a section on CSS only pop-ups/out drop-downs etc which, if you are using the right browser, you will see used on this site. |
| Web Fonts |
A demo page that displays a bunch of popular fonts in various styles and sizes to show your browser's font support and rendering characteristics - don't even ask why we did this. |
| Our CSS Use |
What we are doing with CSS. Maybe should be renamed 'How not to use CSS"! Dates from 2003. Mostly still relevant if you are not really using stylesheets. |
