diy css frameworks
Darren Wood’s presentation was posed as a conversation on CSS design patterns. Frameworks have been around for awhile but one hit the scene & everyone went “mental”. Blueprint was the one which started the fire - CSS files which are useful for a basis.CSS frameworks are supposed to make things easier - however, Darren feels it’s not that useful for people building commercial web apps because you’re being forced to use other people’s methodologies. The suggestion is that you build your own from scratch and develop something that you and your team understand.
Darren’s design pattern exists as below:
- reset all elements to a common value
- cut them all back to their default state = you can use resetting tools like Yahoo’s YUI and Eric Meyer’s
- accessibility
- toolbox of default classes which are used all the time - colours, sizes etc
- layout styles - generic styles
- page related styles - home page, another page
Doug Bowman’s three column layout is a favourite - it has source ordering which for SEO is better since you have the navigation after content. This is good for accessibility also (though this is contentious in terms of skip links and who likes what).
Reference from Dan to recommendations against using frameworks (such as from Jeremy Keith) due to issues with non-semantic code, unused parts of the code and non-relevance to some projects.
At the end of the project, the file isn’t going to be 132 lines. It’s going to be much larger than that, so Darren suggests having really sweet navigation in your comments so you can get to know the numbers/references so that you can quickly jump around. If not just for yourself - think of those who come later, or even do yourself a favour for when you come back to the file later.
Do things need to move faster so we can do cooler stuff or do we need to encourage standardisation in browser support for CSS? The coders here in the audience seem to want more stuff - and think that Browser Wars II may help in a lot of ways.
Darren’s holy trinity of Internet Explorer Hacks:
- display:inline for the 10 pixel jog bug
- position:relative
- overflow:hidden
Quote of the presentation from the audience: “Firebug should be the tip of the day…no…every day.”