Sites like csszengarden.com prove the power of CSS, but to mere mortals like myself it can still be pretty daunting to get CSS layout right. I consider myself a competent programmer. I have programmed in PC assembly, C, C++, Java and the languages of the Web but CSS still daunts me. And I have to believe that I am not alone.
Working on Dojo recently I needed to create a layout that consisted or an outer element that contained an input element followed by a sometimes displayed error icon implemented as a background-image. Being a good accessibility person, my goal was not to use a table for layout but to use the power of CSS. Suddenly I was transformed into a complete newbie! It took me many hours to get the proper combination of divs, spans and proper CSS to get the block layout to work. Then add in the fact that none of the browsers implement CSS in the same manner and it became a lesson in frustration! Luckily some of the other Dojo folks were able to offer suggestions and I actually got it to work. I am still amazed at the tricks and suggestions that folks had to offer. I have to believe (for my own self respect) that this level of knowledge comes from working with CSS on a regular basis and that I am not missing some important “CSS gene”.
But, I have to believe that I am not alone in my level of frustration with CSS and that is why so many people continue to use tables for layout. Tables just work and they don’t require odd permutations of display:block and spans inside of divs that have width and height specified. And, in the end I ended up using a table so that I could guarantee that the icon would never wrap to a new line.
So what does this rant have to do with accessibility? Well, most accessibility tomes encourage the use of CSS. Certainly that is easily accomplished to specify font faces, sizes, and colors – hey, even I am competent at that! I have to give the WCAG folks (of which I was once an active participant) credit for not outlawing the use of tables for layout. Tables are easy, they work across browsers, and assistive technologies deal with them fairly well. Someone needs to make CSS accessible (pun intended) to the masses. The Web took off because nearly anyone could master the basics of HTML to create a Web page. WYSIWYG development environments such as Front Page and Dreamweaver and others made it even easier to create pages quickly (no comment on the robustness of the HTML generated – it gets the job done). But, until CSS is implemented consistently across the browser and there are development environments that can generate the appropriate CSS it will remain a voodoo science for experienced Web developers. I guess that guarantees job security for Web designers and gurus – and the continued use of tables for layouts by the rest of us. Sad but true. I wish I had a solution – I’m hoping that someday someone will uncover the secrets and create a tool to help the folks like me use CSS to its full potential. Or maybe the CSS specification will be comprehensible by mortals – hey, I can dream!
There, I’ve ranted a bit. I feel better, but the problem remains. CSS is just too hard, complicated, and poorly implemented across browsers to be used by the masses. sigh