2010: The Year in Web Standards
WHAT A YEAR 2010 has been. It was the year HTML5 and CSS3 broke wide; the year the iPad, iPhone, and Android led designers down the contradictory paths of proprietary application design and standards-based mobile web application design—in both cases focused on user needs, simplicity, and new ways of interacting thanks to small screens and touch-sensitive surfaces.
It was the third year in a row that everyone was talking about content strategy and designers refused to “just comp something up” without first conducting research and developing a user experience strategy.
Even outside the newest, best browsers, things were better than ever. Modernizr and eCSStender brought advanced selectors and @font-face to archaic browsers (not to mention HTML5 and SVG, in the case of Modernizr). Tim Murtaugh and Mike Pick’s HTML5 Reset and Paul Irish’s HTML5 Boilerplate gave us clean starting points for HTML5- and CSS3-powered sites.
Web fonts were everywhere—from the W3C to small personal and large commercial websites—thanks to pioneering syntax constructions by Paul Irish and Richard Fink, fine open-source products like the Font Squirrel @Font-Face Generator,
open-source liberal font licensing like FontSpring’s, and terrific service platforms led by Typekit and including Fontdeck, Webtype, Typotheque, and Kernest.
Print continued its move to networked screens. iPhone found a worthy adversary in Android. Webkit was ubiquitous.
Insights into the new spirit of web design, from a wide variety of extremely smart people, can be seen and heard on The Big Web Show, which Dan Benjamin and I started this year (and which won Video Podcast of the Year in the 2010 .net Awards), on Dan’s other shows on the 5by5 network, on the Workers of the Web podcast by Alan Houser and Eric Anderson, and of course in A List Apart for people who make websites.
Zeldman.com: The Year in Review
A few things I wrote here at zeldman.com this year (some related to web standards and design, some not) may be worth reviewing:
- iPad as the New Flash 17 October 2010
- Masturbatory novelty is not a business strategy.
- Flash, iPad, and Standards 1 February 2010
- Lack of Flash in the iPad (and before that, in the iPhone) is a win for accessible, standards-based design. Not because Flash is bad, but because the increasing popularity of devices that don’t support Flash is going to force recalcitrant web developers to build the semantic HTML layer first.
- An InDesign for HTML and CSS? 5 July 2010
- Stop Chasing Followers 21 April 2010
- The web is not a game of “eyeballs.” Never has been, never will be. Influence matters, numbers don’t.
- Crowdsourcing Dickens 23 March 2010
- Like it says.
- My Love/Hate Affair with Typekit 22 March 2010
- Like it says.
- You Cannot Copyright A Tweet 25 February 2010
- Like it says.
- Free Advice: Show Up Early 5 February 2010
- Love means never having to say you’re sorry, but client services means apologizing every five minutes. Give yourself one less thing to be sorry for. Take some free advice. Show up often, and show up early.
A few things I wrote elsewhere might repay your interest as well:
- The Future of Web Standards 26 September, for .net Magazine
- Cheap, complex devices such as the iPhone and the Droid have come along at precisely the moment when HTML5, CSS3 and web fonts are ready for action; when standards-based web development is no longer relegated to the fringe; and when web designers, no longer content to merely decorate screens, are crafting provocative, multi-platform experiences. Is this the dawn of a new web?
- Style vs. Design written in 1999 and slightly revised in 2005, for Adobe
- When Style is a fetish, sites confuse visitors, hurting users and the companies that paid for the sites. When designers don’t start by asking who will use the site, and what they will use it for, we get meaningless eye candy that gives beauty a bad name.
Happy New Year, all!
Finally, cross-browser visual control over forms.
Now we have something else to be thankful for. Nathan Smith of Sonspring has created a library that gives designers and developers “some measure of control over form elements, without changing them so drastically as to appear foreign in a user’s operating system.” Smith calls his new library Formalize CSS:
I’ve attempted to bridge the gap between various browsers and OS’s, taking the best ideas from each, and implementing what is possible across the board. For the most part, this means most textual form elements have a slight inset, and all buttons look consistent, including the
For more, including demos, options, screenshots, thanks, and the library itself, read Smith’s write-up at SonSpring | Formalize CSS. Hat tip and happy Thanksgiving to my good friend Aaron Gustafson for sharing this gem.
Awesome web apps in 10k or less
The 10K Apart Challenge had a simple premise: Could you build a complete web application using less than 10 kilobytes? … A joint effort between An Event Apart and MIX Online, the 10K Apart reaped 367 web applications in 28 days—everything from casual games to RIAs—that demonstrate, even with their tiny footprints, what is truly possible with modern [web] standards.
Read about the winning entries: 10K Apart – IEBlog.
The future of web standards
“Cheap, complex devices such as the iPhone and the Droid have come along at precisely the moment when HTML5, CSS3 and web fonts are ready for action; when standards-based web development is no longer relegated to the fringe; and when web designers, no longer content to merely decorate screens, are crafting provocative, multi-platform experiences. Is this the dawn of a newer, more mature, more ubiquitous web?”
—The Future of Web Standards by Jeffrey Zeldman
Originally written for .net magazine, Issue No. 206, published 17 August in UK and this month in the US in “Practical Web Design” Magazine. Now you can read the article even if you can’t get your hands on these print magazines.
See also: I Guest-Edit .net magazine.
ALA 313: CS, CMS, H&J, OK!
In Issue No. 313 of A List Apart for people who make websites: Better content management systems start with content strategy; typographically beauteous web pages may benefit from hyphenation and justification.
by JONATHAN KAHN
Any web project more complex than a blog requires custom CMS design work. It’s tempting to use familiar tools and try to shoehorn content in—but we can’t select the appropriate tool until we’ve figured out the project’s specific needs. So what should a CMS give us, apart from a bunch of features? How can we choose and customize a CMS to fit a project’s needs? How can content strategy help us understand what those needs really are? And what happens a day, a week, or a year after we’ve installed and customized the CMS?
Published in: Content Strategy
by RICHARD FINK
Illustration by Kevin Cornell for A List Apart
SlideShowPro adds HTML5
Most of us web folk are hybrids of one sort or another, but Todd Dominey was one of the first web designers to combine exceptional graphic design talent with serious mastery of code.
Being so good at both design and development that you could easily earn a fine living doing just one of them is still rare, although it looks like the future of our profession. One of the first serious designers to embrace web standards, Todd was also one of the few who did so while continuing to achieve recognition for his work in Flash. (Daniel Mall, who came later, is another.)
Finally, Todd was one of the first—along with 37signals and Coudal Partners—to abandon an enviably successful client services career in favor of full-time product development, inspiring a generation to do likewise, and helping bring us to our current world of web apps and startups.
A personal project that became an empire
In Todd’s case, the product was SlideShowPro, a project he designed for himself, which has grown to become the web’s most popular photo and video slideshow and gallery viewer. When you visit a photographer’s portfolio website, there’s an excellent chance that SlideShowPro powers its dynamic photo viewing experience. The same is true for the photo and video gallery features of many major newspaper and magazine sites, quite possibly including your favorites.
But deliberate lack of Flash support in the iPad and iPhone, while lauded here on February 1, 2010 as a win for accessible, standards-based design (“Not because Flash is bad, but because the increasing popularity of devices that don’t support Flash is going to force recalcitrant web developers to build the semantic HTML layer first”), presented a serious problem for developers who use SlideShowPro and readers who enjoy browsing dynamic photo and video galleries.
Mr Dominey has now solved that problem:
SlideShowPro Mobile is an entirely new media player built using HTML5 that doesn’t require the Flash Player plugin and can serve as a fallback for users accessing your web sites using these devices. But it’s not just any fallback — it’s specially designed for touch interfaces and smaller screen sizes. So it looks nothing like the SlideShowPro player and more like a native application that’s intuitive, easy to use, and just feels right.
The best part though is that because SlideShowPro Director (which will be required) publishes the mobile content, you’ll be able to provide the mobile alternative by simply updating the Flash Player embed code in your HTML documents. And just like when using the SlideShowPro player, because Director is behind the scenes, all your photos will be published for the target dimensions of these devices — which gives your users top quality, first generation images. The mobile player will automatically load whatever content is assigned to the Flash version, so the same content will be accessible to any browser accessing your web site.
A public beta will be released in the next weeks. Meanwhile, there is a video demo. There’s also an excellent Question and Answer page that answers questions you may have, whether you’re a SlideShow Pro customer or not. For instance:
Why mobile? Why not desktop?
We believe that (on the desktop) Flash is still the best delivery method for photo/video galleries and slideshows for it provides the most consistent user experience across all browsers and the broadest range of playback and customization options. As HTML5 support matures across all desktop browsers, we’ll continue to look into alternate presentation options.
Into the future!
A List Apart No. 304
by NICHOLAS C. ZAKAS
by PETER MORVILLE, JEFFERY CALLENDER
Faceted navigation may be the most significant search innovation of the past decade. It features an integrated, incremental search and browse experience that lets users begin with a classic keyword search and then scan a list of results. It also serves up a custom map that provides insights into the content and its organization and offers a variety of useful next steps. In keeping with the principles of progressive disclosure and incremental construction, it lets users formulate the equivalent of a sophisticated Boolean query by taking a series of small, simple steps. Learn how it works, why it has become ubiquitous in e-commerce, and why it’s not for every site.
Illustration: Kevin Cornell for A List Apart
Gowalla My Dreams
What if Gowalla and Foursquare could communicate seamlessly with Address Book? What if Google Maps contained the postal address, company names, and primary phone numbers of every pin on the map? All this information could be marked up in Microformats and standard HTML on optional detail pages you could visit with a click from your web browser or phone. Heck, while we’re at it, let’s add Bump, an iPhone app that lets two people share contact data the same way they share DNA—except that in this case they bump iPhones.
What if every time you used Gowalla to check into or found a spot, you had the option to add that spot’s street address, company name(s), and so on to your Address Book? Imagine meeting a potential client for the first time in an unfamiliar city or neighborhood. No longer simply a passive repository of spots you create, Gowalla or Foursquare could function as a guide, helping you locate the unfamiliar address to make your meeting on time.
As you check into your meeting in reality, you could notify not only Facebook and Twitter (as you can today) but also Basecamp, which would optionally check off a radio box, marking you as having arrived at your meeting.
Something like this (and much more than this) will surely happen soon, thanks to APIs and ubiquitous standard platforms. You just feel, when you’re around people developing the best new web software, that something new is happening, and that many strands are coming together.
We used to imagine a dystopian future in which Big Brother knew everything you did. Later it was the machines that knew. We’ve been talking about ubiquitous computing for years, and we’ve pictured it happening somehow without necessarily addressing the how—that is, some of the brightest and most inspiring futurists have concerned themselves more with the ethical and cultural transformative dimensions of ubiquitous computing than with the technical nuts and bolts of how it’s supposed to get done.
A List Apart 300
- The Problem with Passwords
by LYLE MULLICAN
- Words that Zing
by COLLEEN JONES
When someone consults a website, there is a precious opportunity not only to provide useful information but also to influence their decision. To make the most of this opportune moment, we must ensure that the site says or does precisely the right thing at precisely the right time. Understanding the rhetorical concept of kairos can help us craft a context for the opportune moment and hit the mark with appropriately zingy text.
Our 300th issue also marks the debut of contributing editor Mandy Brown. Mandy is a Creative Director at Etsy. She worked for nearly a decade at the venerable publishing house W. W. Norton & Company, where her work involved everything from book design to web design to writing about design. She writes about the reading experience at A Working Library. We are thrilled to add Mandy to our creative team.
Am I Blue
Our classic orange avatar has turned blue to celebrate the release of Designing With Web Standards 3rd Edition by Jeffrey Zeldman with Ethan Marcotte. This substantial revision to the foundational web standards text will be in bookstores across the U.S. on October 19, 2009, with international stores to follow. Save 37% off the list price when you buy it from Amazon.com.
Short URL: zeldman.com/?p=2730