Category: web design

  • Web Standards’ Three Buckets of Pain

    I spent this week at the W3C’s annual technical plenary, which is a week of “discussing” the future of the foundations and future of the web. I spent the first part of the week in the CSS Working Group discussing CSS3 features and CSS2.1 issues. Tuesday evening and Wednesday were spent in the AC meeting and Technical Plenary day (everyone gets together in a big room for panel discussions and lightning talks about standards-related issues – my favorite day of the week). The latter part of the week I spent in the new HTML Working Group talking about a lot of issues I’m not up to speed on because I just joined the working group (but, of course, that didn’t stop me from jumping in).\
    Molly led a panel during Plenary Day called From the Outside, In: Real World Perspectives on the W3C with a handful of designers and developers who aren’t currently involved in the W3C (Aaron, Matthew, Patrick and Stephanie). The panel helped solidify a few things for me and I want to try to explore them in this post. The panel wasn’t bad by any stretch. I think it was brave for them to come into the “lion’s den” and give the W3C their perspectives. But, I felt that the way the panel was presented left people in the audience confused about the overall message, and exposes a huge gap between the W3C’s understanding of “web standards” and the web development world’s definition.\
    Before I get any further, I need to explain where I stand here. I have a foot planted firmly in both worlds. I’ve been building web applications for almost a decade and have been a fan of standards-based development since late 2001 when my blog validated as XHTML 1.0 Transitional. I’ve been a member of the CSS Working Group for about four years as well.\
    The complaints about web standards are varied and many, and the panel made it feel like they all fell squarely at the feet of the W3C. But, that’s just not the case. I think a lot of the problem comes from our (being the web development world) definition of “web standards” being almost completely different from the definition understood inside the W3C. To web developers the world over, “web standards” means: “What I have to do to get my page to look right in all the modern browsers.” The W3C’s definition is “the underlying specifications that implementors (in our case, web browsers) use”. See, the standards aren’t written for, or by, web developers. In the case of HTML and CSS, they’re written for and by the people who create web browsers – which is why they’re so hard for the rest of us to understand. The vocabulary is different. The requirements are different. There is a whole world of pain in store for the brave soul who wants to write a web browser – and it’s a uniquely different world of pain from someone (you and me) who wants to apply those standards to build a web page that will render in one of those web browsers.\
    For the rest of this blog post, anyone building a web browser is implementing the standards, and anyone trying to build a web application is applying the standards. People building web browsers have to implement parsers, renderers, conformance checks, error handling and all sorts of other nasty things to get a browser to function. People building web applications have to take the standards and apply them through an implementation (in our case, a browser). We’re not writing the parser, we’re writing the thing that gets parsed.\
    And there are our three buckets of pain:

    1. The Specifications
    2. The Implementations
    3. The Applications\
      h4. The Problems With The Specifications\
      The major problems I hear about the W3C and its processes are:
    4. It takes too long.
    5. I don’t know what’s going on or when we’re going to see the standards come out.
    6. Spec X is missing this, this and this!
    7. Developers and designers have no voice in the standards at all!\
      One, two and four are, or were, true. Number three is only half true most of the time. Every time I ask developers or designers I know about what’s missing from CSS, I always hear “I want multiple backgrounds and a real layout model. Oh, and border images!” Two of those are already implemented in Safari, and I’ll bet you Firefox will have them done shortly. They’re all in CSS3 somewhere.\
      Web developers and designers have more of a voice on the CSS Working Group than ever. There are currently three designers in the working group (two from AOL and one invited expert). The group is also working with the new CSS11 group, and is actively gathering feedback. The new HTML Working Group has several members who are web developers and over four hundred invited experts (who can’t all be building browsers).\
      The W3C is working very hard at opening up. It’s not there, and they’ll stumble, but the attempt is being made.\
      h4. The Problems With Implementations
    8. Microsoft took a vacation. IE6 has been out (and broken) for a very long time. We got complacent in our hacks and nonsense to work around its “quirks” and now those bad habits and hacks are getting stale.
    9. They don’t move fast enough! See number one. We’re tired of waiting, but laying the blame on the CSS Working Group instead of Microsoft. If Microsoft had been actively engaged in the Working Group this whole time, we’d be a lot farther along. It’s very hard to get to interoperability when the market leader is working on other things.
    10. They have bugs. Every piece of software ever written has bugs. Thankfully, bugs get fixed in the other browsers fairly quickly. Unfortunately, IE is now on a 15-20 month release cycle, which means we have a while to wait until we see things we need like display: table and probably 30-45 months until we can hope to see advanced layout or the grid implemented.\
      h4. The Problems With Applications\
      (this is going to be painful… just hold on – it’ll be over soon)\
      Our biggest problem as web developers and designers is the misunderstanding I pointed out at the beginning. We need to understand the three buckets of pain and what we can expect out of each one. There’s no reason to rush standards out if no one’s going to implement them. There’s no reason for us to try to use them until they’ve been implemented.\
      We have to admit that we made a fundamental mistake in how we advocated building things with “web standards”. As someone who’s done training for the last five years, this is as much my fault as anyone’s. We taught to the implementations. We never taught the distinctions between the specification and the implementation. We never taught that we were teaching an application of the standard and not the standard itself.\
      The hacks became the standard and not the exception. We taught without understanding the long term implications of teaching hack management instead of teaching the specification and the application of it separately.\
      h4. How do we move forward?\
      We need more developers and designers plugged into both worlds. To work on the specifications themselves, or even read and give feedback on them, you have to abandon any hope that this will be useful to you in your development world for three to five years. Once you do that (it took me two years to get that through my head), you’ll be much less frustrated, and might actually be helpful. To a degree, you also have to abandon your notions of how you do things today. When thinking about layout, you have to give up thinking that “float” is the best way to do it (because, please, it’s just not).\
      We need to reboot our perceptions of web development and start thinking towards the future. It’s a new world, and getting newer every day. Our best practices have to evolve – our disciplines have to evolve. We need to think about a world without IE6. It’s going to happen. We need to come up with better ways of building web applications. We need to come up with better ways of teaching the value of web standards. We need to do a better job of educating designers and developers about the consequences of building web applications. We told them all the good things that would happen when they did it our way, but did we tell them that hacks go away? Did we tell them that browsers evolve and that hack they spent all that time on to get things to line up in IE6 will go away some day?\
      I don’t think I covered everything I wanted to say. There are a lot of things swirling around in my head right now. I had my mind blown last week by this realization and it will probably take more thinking about it before it really crystalizes and I can really explain what I’m feeling. But, right now, this is it, and that’s as good as I’ve got: It feels like I’ve spent the last 7 years living a lie, but the truth is so much more interesting and complex than the lie ever was. It feels like a stronger foundation, but wider and darker in the corners, than the one I’ve been standing on.
  • circaVie

    It looks like we’re on to something here… first, we launched ficlets. Now, Dave McVicar and crew have launched circaVie. It’s a cool site for building timelines of pretty much anything. There was a bit of overlap in the ficlets and circaVie crew. Jason Garber did most of the markup before he scampered off to join his startup. Jenna Marino, who designed the gorgeous ficlets logo, did UI design for circaVie. Ari Kushimoto, who did a lot of ficlets’ UI, was circaVie’s art director.\
    I love seeing things launch, especially stuff as beautiful as circaVie. It’s an amazing piece of design and engineering. The site is gorgeous (I would say “lickable”, but that’s gotten me in trouble before – not doing it, just saying it, so I’m not saying it). The Flash stuff feels perfectly integrated and the interaction is really smooth. Jayna Wallace was the visual designer and did an amazing job. Corey Lucier did the flash work. Kelly Gifford jumped in and took over the markup when Jason left. Plus, it’s all on Rails!\
    Update: AUGH! Dan reminded me in the comments that I left him out, and I certainly shouldn’t have. Dan Bradley is the operations guy for both ficlets and circaVie, and I’ve worked with him for at least the last five years (probably closer to seven), and he’s one of the best there is. He helped a ton getting ficlets out the door, and I’m sure he’s done the same for circaVie.\
    You really should go check it out. The team worked really hard on it, and it shows.\
    See also: Kelly’s blog post, Mashable and Somewhat Frank.

  • The Ficlets Logo’s Story

    Jenna Marino has written a fantastic blog entry about how she came up with the logo for ficlets. I love the logo so much, and a bunch of people asked me how we came up with it. Mostly, I’ve just shrugged and said “magic?” Now, you can get the real story from the designer who came up with it!

  • MIX06 Reactions From Day One

    I’m here in Vegas for . It all started with Bill Gates’ keynote in the morning, and it soon became clear that I was in a different world. I was in not in my world, I was in MicrosoftLand, where everyone has unlimited resources to build web products for everyone else and then build a special IE-only one. Better yet, a Vista-only experience using the Windows Presentation Foundation (for a platform that hasn’t been released yet).\
    Windows Presentation Foundation should make Macromedia very nervous. It’s a Flash-killer baked right into Windows. It looks like it has a lot of really cool features that will suck advertisers in. If I were them, I’d start coming up with some marketing about Flash’s install base and cross-browser/cross-platform attributes.\
    They showed off Atlas, their new Javascript framework that smells a lot like Dojo. That whole presentation, and a lot of the others, felt disingenuous to me. They touted them as innovations when other products have been there first and Microsoft is just taking that work and adding a special Microsoft twist on it. That twist may be innovative, but the ideas aren’t new.\
    There wasn’t enough detail about what’s coming after IE7. IE7 is now layout complete, so if you haven’t gotten the latest beta, go get it. We can be pretty confident that the layout problems we see in the latest build will be the layout problems we see in the final version of IE7, for better or worse. I went to the future of IE panel and got very little new information. It was too generic, too little new info. I want a roadmap for IE that shows when we can expect what new standards support features. I don’t even want dates, because I know that dates are like handcuffs. I just want to know what’s coming. If the IE team doesn’t know yet, tell us.\
    It’s weird being here, at a one-company conference. I’m used to the kind of friendly competitive tension of other conferences. Here? It’s all Kool-Aid all the time, well, except for Marc Canter. Somehow, the guy is the first to ask question (or something that’s more like a rant but might contain a question in it somewhere) in any panel he’s in. Not sure how he does it, or why… but he does.\
    There were some highlights. The new Expression web site creator is very very slick. It creates standards-compliant code and has some amazing CSS refactoring features that should allow relative novices to create really interesting sites fairly easily.

  • Late Night Markup Tip

    Tired of writing markup? Make too many stupid mistakes, like unclosed tags, unescaped ampersands, unquoted attributes, etc? Stop writing markup in a plain old text editor and switch to an XML editor!\
    I’ve been using OxygenXML to write markup for several months now and I find that I make far fewer mistakes there than I did when I wrote everything in BBEdit. I love the one click validated, pretty print, and that it has good code highlighting for other languages (its PHP highlighting is especially good).\
    Using an XML editor should save you keystrokes too. Oxygen closes my tags for me, and shows attributes in bright red when they’re not closed. It even goes back and highlights the opening tag when your cursor is at the end tag. Nice.\
    Yeah, it’s midnight and I’m awake. Gotta wait twenty more minutes before my pain pill, then it’s sleepy time.

  • I’m Not A Designer

    Have you ever seen something and said, “I wish I could design like that?” Well, check out The Oddzballz. Yeah, told you.\
    I’m not a designer, but boy would I love to be one. I’m not one to say I’m one just because I can screw around with PhotoShop and make gradients. I know too many “real” designers to pretend that I could be one.\
    But, enough about that. I’m just in awe of that site, designed by the amazing Elsa Kawai. Just go look. Really.

  • Dear Internet

    You are upsetting me. Please stop using crappy old browsers. There is absolutely no excuse for using Netscape 6, Netscape 4.x, Safari 1.0, IE 5.5 or IE 5.0. They are all old, insecure, out-of-date, feature poor and tired. They are so so tired. Please retire them and get yourself a new browser. You know, one that renders pages correctly, that won’t crash on you, that’s actually supported by the company that released it, etc…\
    We should have a national holiday: Upgrade Your Browser Day. It could be a national day of nerd service where nerds go door-to-door offering to help people upgrade to the latest version of that person’s browser of choice. You want to use Netscape? Great! Let’s dump that ancient bug-filled copy of 6.0 and put you on 7.2 or 8.0! Opera lover? Please, let’s install 8.5! IE? No more 5.0’s or 5.5. Let’s get you a fresh (but still old, IE 7 can’t get here fast enough) copy of IE 6.\
    Yeah, I think this could work. We need browser missionaries. I could see the door approach now:\
    knock, knock\
    “Hello, ma’am, we’re the neighborhood browser missionaries. Do you have any web browsers in the house?”\
    “Yes, I think we do…”\
    “Do you know what version you have? Have you checked recently for updates?”\
    “Well, no, I just use it.”\
    “Can we come in? We’d love to help you upgrade that old thing, and we’ll do it for free!”\
    I think it would work.

  • The Phone Buying Blues

    My poor Sidekick Color died last week. My wife wants a cell phone. I want something out of Star Trek that just doesn’t seem to exist yet (go figure). Deciphering cell plans, and deciding on a phone that will do all the things I want it to. Right now, I need a phone for Jen that doesn’t have to do a whole lot. A camera would be nice, but not required, and it just needs a good address book and battery life.\
    My requirements are a little tougher. It has to be on this list, has to have a camera, e-mail, support internet-over-Bluetooth, and a calendar. Yeah, I know. I’m tempted by the Treo 650, but the only carriers who have it charge an insane amount of money for their unlimited internet plan (I did over eleven megs a month on my Sidekick). T-Mobile has a much more reasonable unlimited internet plan, but they don’t have the 650.\
    The cell companies’ websites don’t help either. They don’t have reviews on the site, are sparse with the details, and navigation is a pain in the butt.\
    If you’ve got any recommendations, I’d love to hear ’em.

  • Redesign In Progress

    Got tired of waiting… I’m not done, but you get the idea. More colors! Some re-arranging of stuff! A little more art, and hopefully some good stuff. I just passed 1500 posts on this blog. This will be 1505. 1500 was, appropriately enough, this one.\
    I started blogging almost five years ago (there’s still a huge mass of entries under the Blogger Entries category that I’m slowly whittling down into their appropriate category). I’ve had this orange color scheme for a couple of those years, and while I still love orange, it’s time to branch out (thanks to the super cool Color Scheme Generator).\
    Over the last five years, I’ve posted over 1700 pictures, and several dozen posts on other blogs around both internal and external blogs.\
    Look for me to finish up the redesign in the next week or so.

  • How long will be before

    How long will be before we can give up on supporting Netscape 4.7? Mac IE 4.5? I work for a very large corporation, with amazingly stubborn users who refuse to upgrade, or change their resolution. So, we’re stuck in the stone age supporting ancient browsers with bloated pages and spacer gifs. You’d think they could drive the upgrade cycle with new clients.

    I think there should be a cutoff date. The web builders (cuz I’m no designer) of the world should band together and say, “As of INSERTDATEHERE, we will no longer support obsolete browsers. If you have not upgraded by SAIDDATE, your web experience will suck.” There have already been small strides with the Web Browser Upgrade program, but it hasn’t been embraced by large corporations. Why? Money, mostly. Also, it’s partly ignorance. The suits don’t care what people use as long as they see the ads and buy stuff. Little do they realize, that by supporting these ancient browsers, they’re hindering their ability to make money. With new technology comes new opportunities. There will come a day when we can no longer retrofit the new stuff for the old hole. As resilient as Netscape 4.76 has been, it’s time to give it up.

    So, my fellow members of the web proletariat, let’s band together and then go get something to eat. I’m starving. Ranting makes me hungry.