Chris Pirillo has floated another Lockergnome redesign that embraces web standards and looks good to boot. I couldn’t be happier. Here’s Chris’ post on the matter:
Boo-yah! I’m going to keep nagging Jason until he applies this weekend’s test code site-wide. No legacy tags, beyotch! Oh, and… “This Page Is Valid XHTML 1.0 Transitional!” I’m not sure if I wanna play with a fixed-width or stick with the variable. Doesn’t look great on anything less than 1024×768, but those folks are in the minority. Hey, I got it to look fantastic in all the major browsers on all the major platforms – that’s gotta count for something. Props to glish for the guidance. So, what did I use for my editor? Notepad, baby. Metapad, actually (the best clone around). Thanks to everyone else for the virtual ass-kicking; you accelerated the inevitable.
Most of you will be happy that it looks like a page from this century, but I know some of you are wondering about the markup. It’s decent. Eric Meyer actually covered the Lockergnome debacle and their redesign in his part of the panel on CSS and said it suffers from “classitis” — using too many class declarations. Example:
<ul class="menulist">
<li class="menuitem">
<a href="http://www.emtec.com/mailbell/index.html?lgnm" title="POP3/Hotmail and IMAP Email notification and mail preview">Mailbell - be notified about new email</a>
</li>
<li class="menuitem">
<a href="http://www.vypress.com/" title="Instant messaging and conferencing for LAN">Vypress Chat</a>
</li>
<li class="menuitem">
<a href="http://www.emtec.com/pyrobatchftp/index.html?lgnm" title="Perform automated and unattended ftp file transfers via scripts.">PyroBatchFTP - Scripted FTP v2.08</a>
</li>
Instead of explicitly addressing the menuitem class you could just use the CSS selector .menulist li which would apply to all list items under an element with the class of menulist. I forget the name for this type of selector, but it’s the most useful technique I use daily in CSS.
What’s great is now we are discussing what Lockergnome is doing well and how they could tweak it to make it better rather than wondering how the hell they went wrong. I commend the group at Lockergnome for doing the right thing.
Previous articles on the same subject:
- Invalid Gnome — the post that started it all.
- Transitional Layouts — Dave Shea comments.
- Why Go Backwards? — Paul Scrivens comments.
- More on the Gnome Regression
- Almost April — April fools joke?
- Lockergnome Reverts — Simon Willison comments.
- It’s Worse Than You Can Imagine
- Code is Food — 70 comments and counting.
- Lockergnome Critique — From Paul.
Can anyone say, “New Coke”?
that site would look 10 times better without those ads.
I take it Jacques is less than thrilled. 🙂
Andrew: it might, but you can’t fault someone for paying their bills.
(Descendent selector 😉 )
Thanks Anne!
What’s MetaPad? I googled them and the site is down.
Notepad is a poor text editor. I know everyone likes to brag that they could design amazon.com or ebay with Notepad because they got m@d sk1llz, but really, there are more effective tools.
We’ve actually cleaned it up further on our Dev site. Should be going live soon! 🙂
I’m with Trent. The old “I did it in Notepad!” just tells me that it took you twice as long as it should have. Those of us who get paid for coding and don’t do it out of necessity know that time is more important that brute skill. So, yeah, if an IDE can save me an hour a day, that’s money in my pocket.
It’s good and all that they are going back to CSS, but what was the point of changing in the first place. The other previous CSS design was so much better.
Oh well. Not my baby.
i don’t see any tools which generate the html for you creating any html that is worth using. i don’t know what you lot use but if it creates proper css designs which don’t use tables, i would love to know.
Flump, Dreamweaver MX 2004 is pretty good.
If you aren’t using any legacy “tags” (you are talking about element types actually), then why are you using a Transitional Doctype?
this is definately a clean sheet and looks good too ! congratulations for the hard work.
It looks like they’ve gone live with the new look.