Curing DIV-itis with Semantic HTML, CSS and Presenters
Location: Room 309- 310
In the world of web standards, semantic markup is one of those nebulous things that is often blogged about and oft forgotten in the throes of birthing a web application. Semantic markup is using HTML elements for what they are intended (e.g. a ul for a list instead of a div class=“list”). Not only does this make rendered documents easier to read from a hierarchy perspective, but it helps with search engines and reducing code.
In the last year since I’ve joined the staff at InfoEther, we’ve refactored a few sites that have come through, in many cases reducing some Rails partials from 80 lines of code down to 20. That partial was a list with a loop in it for a top-ten list. So, once processed, it rendered out to about 600 lines of code. After cleanup it came out to rendering out less than 100.
We’ve also utilized the Presenter pattern to take elements that occur regularly and remove them to presenters. CSS elements and stylesheets generated from Ruby, Navigation items that are added with one line of code and a few images, easy setup wizards, and more.
All these things can create better sites that run faster and are easier to work with.
John is a interface and experience designer as well as programmer, filmmaker, musician, and occasional troublemaker. Prior to his current role at Northern Virginia’s Ruby on Rails consultancy, InfoEther, he ran the DC based UI/UX shop “Hyphenated People” with Amy Hoy. He also ran a 15 person creative team at a large e-commerce shop for two years. He released a short animated film, “The Sandbox”, with his company Meticulous in 2005. When he’s not emotionally attached to a website, he can be found performing in his band, Juniper Lane, or working on 3d animation and electronic music. He holds a Masters degree in Architecture (the building variety, not the information kind) from Catholic University of America. He takes entirely too many pictures of his cat.
Comments on this page are now closed.