Raising the CSS B.R.A.T.

CSS B.R.A.T. is a great idea, but one that should be seriously thought about before implemented. For those Web folks responsible for supporting intranets, having to wrangle many editors, this is a great tool, but it should be avoided for anything that faces the public. The implementation could inflict much more harm on the presentation and usability of the site in ways far worse than the non-standard markup.

I like to implement styles that override WYSIWYG markup on sites that provide others to include HTML, and I highly recommend that others do the same. For example, Webby folks should ensure the font tag is styled to match the site’s standard font (font family, size, weight…) with !important to ensure it overrules the deprecated tag and its attributes. Other tags can be covered as well including crowd favorites like blink and layer.

As Marco rightly noted “The process of educating editors on the benefits of a standards-based design can be tough enough to do, especially when working with various levels of HTML knowledge. This method is meant to show, educate, and be passed on to other editors for an exponential improvement on the state of web documents. ” It’s also important to think about this as an opportunity to learn which tools your internal clients need. They may have valid reasons for attempting to modify the standard presentation. B.R.A.T. provides a great incentive for editors to contact you, so make sure you capitalize on it! A few well built classes will do wonders for proper implementation down the road and perhaps encourage those clients to give you cookies.

Mmmm Code Snippets

Code Snippets is an online resource, providing a central user-writable repository for chunks of reusable code. A stroll through the language-agnostic site provides a plethora of tasty bits and bytes from many programming languages and frameworks. Each snippet can be tagged and each tag can be followed via RSS. Users can comment on snippets as well, which is invaluable for anyone deciding whether or not they want to try out a piece of code.

Efficient WebDev Tip

The post Write Stylesheets Simultaneously has a great tip for easing the initial development of a new site. Instead of manually reloading your browser each time you want to view your changes to your markup or CSS, throw a simple meta refresh into the HEAD so the page will reload automatically every N seconds. A second tip is provided a bit farther down the page – so check it out.

Collapsible Menus

I have implemented pureDOMexplorer (pde) in the sidebar to clean up the navigation a bit. It sits upon a foundation of accessible, XHTML-compliant unordered lists and uses unobtrusive JavaScript to toggle the visibility of sub-categories. It was extremely easy to implement and saved me a ton of time. I really wasn’t looking forward to writing the script to perform this functionality. Onlinetools.org is a very handy JavaScript resource that I recommend you check out if you are developing a site.

IE 7 + IE Hacks = Breakage

As expected, the introduction of IE 7 will wreak havoc on those sites that utilize CSS hacks to serve up different styles to IE browsers. The IE development team is urging developers to clean up their hacks. They recommend the use of conditional comments, but I lean to using server-side code to detect and serve browser/platform-specific styles as needed. In PHP I use and heartily recommend phpSniff . Now I need to research some options in JSP…

Tables and Dogma

Dave Shea has written a great post about his misunderstanding of when to use (or not use) tables in his post Too Far. For those of you unfamiliar with Dave, he has provided a wealth of information and tools to the Web community (in addition to the CSS Zen Garden, and his book, The Zen of CSS design, there are many posts on this site that point to entries on Mezzoblue). He has taught many in the community about good design, and proper use of CSS, but he made the same mistake that many of us have – taking dogma too far by eliminating the use of tables throughout the site. The freedom and power of Cascading Style Sheets introduced a loathing for tables-based design within the community, and many, myself included, eliminated tables from our sites as quickly as we could figure out how to create multi-column designs in CSS.

Like Dave, I hit a point a while back where I realized that I was attempting to use CSS, Divs, Lists and the like to present tabular data, instead of utilizing the semantically correct table tags. For me, it was one of those “Ah ha!” moments – tables are not bad, they are actually very useful, but like any tool, they can, and have been mis-used within our community. The backlash is understandable, but a sizable portion of the community has since realized that the pendulum swung too far, and are now doing it the right way. This is due in large part to the work of Dave and many others like him.

The alt and title attributes

Roger Johansson has provides a great post discussing the purpose of the alt and title attributes as defined by the HTML spec, and the way browser makers have muddied the usage of each.
> Alt text is not meant to be used as a tool tip, or more specifically, to provide additional information about an image. The title attribute, on the other hand, is meant to provide additional information about an element.

Link via Jeff Croft

A Developer's Progression

Steve Smith adds to the many reasons that a developer should learn and apply standards-based design in his post A Natural Progression at
OrderedList.com. Pointing to recent articles about the business value of Web standards, he discusses his experiences working with businesses, who have begun to specify Web standards within their specifications, and takes it to the logical conclusion that the average Web developer needs to learn and use standards compliant code to remain a viable competitor in our crowded market.


We all have those days where we are scratching for an idea, a little creative spark to light the designer fuse within us. Well, check out Stylegala which “aims to promote, discuss and inspire the web audience in the area of design, CSS and web standards – combined.” It may well be just what you need.