Sweet, sweet validation

Ah, recently I have been using a lot of css and heavy use of background images on sites. For some obscure reason I have this overwhelming feeling that I was cheating somehow and that I should be using borders, bg colors etc to create the layout.

I have had this feeling for quite sometime about a range of issues about CSS, although (mostly) standards compliant I felt that I was getting lazy with my css’ing. Hacking, just get it working in IE without understanding exactly how I achieved it, some interesting floats, that sort of thing. Part of me felt that my code should be pure and untainted, but what a shot in the arm this is.
Thankyou ‘A List Apart‘:

Lesson No. 12: Background images will make the difference between the plain and the tastefully embellished

Thanks to the vagaries of the CSS box model, mixing proportional and fixed dimensions within a layout—in other words, attempting an elastic layout with lots of borders—is a sure way to disaster (or at least considerable grief). However, you can create the illusion of that mixture by creating well-composed background images and referencing them properly in your stylesheets. Self-directed experimentation is recommended, particularly with regard to the behavior of borders.

Another common task for which I believe background images are appropriate is the replacement of headings with bitmapped type. Though arguably contoversial, the practice of combining the background-position and text-indent CSS properties makes it possible to give search engines and screen readers what they need, while also providing the high-quality visual experience for which most graphic designers strive.

For the record, naysayers should know that I’ve yet to encounter any personal computer users who routinely browse the web with stylesheets enabled and images disabled. While that scenario leads to an intriguing intellectual exercise, I’m presently confident that it bears little relationship to the way people habitually browse the web in the real world.

Leave a Reply


Webmentions

No webmentions found.