Recently, I’ve been seeing a lot of really cool sites taking advantage of HTML5 and CSS3. The web is growing in leaps and bounds as designers and developers continue to invent and innovate using emerging web technologies. This is, of course, really awesome. But are people going in the right direction?
Take the Nike Better World site, for example. My first reaction to this site was “wow, this is awesome!” Hell, that was even my second reaction. It is visually stunning. I’m drawn to the giant, vibrant images, the parallax animation… Just about everything but the text, which I always manage to gloss over. Oh, sometimes I’ll read the headlines, but that’s about it — the rest of the text is small, cramped, and sometimes on top of a busy image, which makes it very low contrast. At the end of the site, you’re informed:
I scrolled 14,260 pixels toward a Better World.
Unfortunately, I don’t know what I’ve done to make the world a better place, other than ogle impressive web design.
One of the key tenets of web philosophy we seem to be forgetting amidst gorgeous visuals and slick animations is “Content is King.” When it comes down to it, the message of your website is usually expressed through text. You’ve hopefully included some images to support your text, but you don’t necessarily have to. Supplementary images should not overshadow text. If your site is driven by visuals and animation, you need to make sure those visuals are getting across the message of your site in place of text.
The biggest danger we face today, as web designers and developers, is falling back into “Flash Syndrome”: the idea that shiny animations and graphics make a great website, instead of great content and readable text. I have seen many a site these days fall into that trap. My biggest fear is that the HTML5/CSS3 bubble is going to pop, leaving web professionals to wallow in conformity. The good ‘ole days of free Flash templates on every corner will make a comeback in the form of HTML5.
Remember, folks: don’t forget your text. Don’t throw content to the wayside while showing off your shiny new web trinkets. Don’t let HTML5 and CSS3 become the new Flash.
I don’t mean to sound “Doomsday.” There are tons of people that continue to push the envelope. In contrast to Nike, one site that manages to pull off vertical-scrolling animation really well is Contrast Rebellion. Content is the highlight of this site. The illustrations emphasis the text, not detract from it. How you interact with the site isn’t the star — content is. The animations are fun and cool without overshadowing the message of the site.
What do you guys think? Am I being over dramatic, or are we focusing too much on shiny?
this is great, you should adapt it for a CH blog post! also, I really like this comment form…
Thanks! It’s actually just the default twentyeleven comment form. I ended up lightly skinning the theme, so most of it is still twentyeleven styling.