Loose notes from SXSW 2006 session: Standard Deviation
We’ve all been repeatedly hit upside the head with a big log over the past few years: Standards, standards, standards. People become fanatical about it, and sometimes jump through absurd hoops to meet the standards goals. But there are times when you need to give yourself permission to do things the “easy” or “old” way to get the job done or to best serve your users. This panel was a breath of fresh air – realists in the real world.
Glenda Bautista Agendacide.com
Aaron Boodman Chief Monkey, Greasemonkey
Kevin Gibbs Software Engineer, Google
Johnnie Manzari Designer, Slide
Sergio Villarreal Web Developer, Slide
Case study: Trying to solve the browser/server push problem for gmail chat:
Possible methods to get streaming data to the browser:
iframe sets off clicks, screws up history. XML-HTTP connection – doesn’t work in IE until all data is returned. And hits the connection limit. Way to get around the limit is to go to a different domain (use a fake subdomain). MIME “multipart/mixed” content type – but still doesn’t work in IE. Hand-over-hand” XML-HTTP connections – harder on backend. Flash XML sockets. Works with only some Flash players. Solution: Use undocumented, interal IE ActiveX components on IE + Use XML-HTTP connection with domain workaround on FireFox.
So this was a case where sticking with standards just would not have worked.
The designer’s point of view:
Is the interface appealing and usable?
Are the interfae controsl and behaviors elegant?
How does it do that? Not just “What does it do?”
Aesthetic details (subtle fades, clean and well chosen typefaces)
Use Flash if it helps the user experience, even if it won’t validate. Some examples of Flash delivering a better UX. Even if it’s binary, even if it is tied to Macromedia.
Flash offers rich typographic control, multimedia delivery, embeddable.
Vertical centering/alignment: DIV offers no good way to do this that isn’t problematic with IE. The CSS techniques for these things become ridiculously difficult. Just put it in a table and valign center! Fer goddsake. Then you don’t have to worry, “Is this CSS hack going to work if I go liquid?” etc. If your users are going to go through your code and criticize you for not being XHTML strict? It doesn’t make any sense.
And because so many CSS hacks rely on bugs, which will be fixed eventually by definition, your CSS is not going to be forward compatible, by definition.
This does not excuse gross and totally avoidable things like using tables for overall page layout.
Boodman (Google guy) cares about:
End user experience
Graceful degradation / forward compatibility
Bookmarkability / RESTness (everything is representable, URLs can be forwarded)
Using web standards as much as possible
Preserving browser features like font-resizing and right-clicking on links.
We’re in the business of making web applications, not documents. There are no tags in HTML for navigation. [Never thought about this – what an amazing omission, especially when there are so many tags for page elements we never use, like acro and cite.] So we abuse the UL/LI for nav, which is as much a hack as anything else.
Bandwith/render speed (arguing points for CSS, mostly) – sometimes a red herring.
Making it perfect in Win/IE (religious, not practical value) “IE has hurt us enough, so we want to hurt it back.” Absurd.
Boodman worked on Google page creator. WYSIWYG interfae, generation of simple, reusable code, HTML+CSS.
What happened wat that they followed the spirit, not the letter of web standards.
FONT tags, but gracefully degrades
Some non-validating markup
Too difficult to marry abstracted CSS/HTML with WYSIWYG interface.
The sites it creates are accessible, and conform to the spirit of web standards.
What requires hacks?
– Video/audio – can’t do it right with web standards
– Partial page update
– Curved borders
– Embeddable content without scrollbars
– vector graphics
– Useful file upload
– Drag and drop into the application
– XHTML Strict
– XMLHttpRequest to another domain
– Application style as oppoesd to page style layouts
– centering vertically
Are you self-employed? If not, chances are you sometimes end up doing things you’re not proud of. Self-employed tend to be the most vocal champions of web standards. But business needs tend to put lots of obstacles in the way of that — have to compromise to meet user needs.
– Build it fast.
Is it easy to maintain afterwrds?
Can someone else maintain it if you go?
Contrast all of the standards goals with the reality that you have three seconds to grab someone’s attention on the web.
Standards community: Educating people, or alienating them? Check your tone, don’t make non-standards developers feel stupid. The arrogance is off-putting. We are all in the same boat. The Linux community has the same problem: RTFM, dude. It mostly just turns people off. “Don’t be a hater. We don’t need no hateration.”
Booodman: “Believe me, you don’t want to be the guy at Google who knows everything about CSS standards.”
Validation: The validator is a tool, not a goal. It shouldn’t be something that you display on your site. “If you had to kill babies for the user experience, how many babies would you kill?”
We don’t advocate going back to the 90s, building pages like we were then. Things are much better now. But don’t be a nazi, don’t go overboard.
if following a standard results in
– harder to read code
– increased maintenance complexity
– fragile layout (prone to break when element changes sizes)
… consider deviating from standards
This is not an apology for ignorance. Just know which rules you are breaking and why. If you’re going to deviate, document your deviations.
Tables can actually render faster than floats – the browser rendering pipeline for tables is very well optimized.
None of the screen readers (accessibility) actually follow the standards – they’re already busy trying to accomodate the real world. So maybe it makes more sense to say “I want this to work here and here and here” and just code that way.
This is the “Give yourself permission to deviate” session – the counterpunch to all the standards religion going on here.
[I’ve been dealing with a question along these lines for a new site I’m working on: Cases where I have a long list of names, but want to present them as a grid. I can use CSS to make a list appear as a grid, but then what if I want row striping? It’s not tabular data, but neither is it a pure list. If I use a table, it won’t be flexible, and I’ll be a bad boy. My page layouts aren’t table based, just this one page element. The temptation to abuse the table is great, and just go with it. This panel made me feel like it would be OK to do so.]
Will we ever get there? Browsers are the road. They are our infrastructure. We know what can run on roads — things with wheels. In 50 years we’ll still be dealing with all of this.