The Restriction of Type

Responsive website design is incredibly difficult to get right. It’s often said that designing for content is the key to success.

In the screenshots below you can see the websites of Elliot Jay Stocks, Jeffrey Zeldman, and Information Architects, all of which have had a redesign/realign this year with content as their priority and thus typography as their paintbrush.

There are problems here:

• Elliot Jay Stocks’ website is unreadable on my Galaxy Nexus. I wear glasses — I’m very slightly shortsighted — and it’s illegible to me. The main copy is effectively 13px, a size at which most fonts can’t even be rendered properly. That’s a real shame, I gave up and almost forgot to go back and read his outstanding rebuttal to “Has adaptive design failed” (thank you Elliot, that was magnificent!)
• While text size on Jeffrey Zeldman’s website is good on my mobile, the build is broken. The content is a thin column taking up 1/3rd of the width and therefore just too difficult to read.
• Information Architects is on the small side but bearable. The custom typeface has incredible detail (even if overly iPad-centric in formation). My issue again is with the build; type set flush against the left edge and content being cropped off by the right.

I don’t post these screenshots to unfairly call people out, only to note how difficult it is to make a responsive website despite having such a narrow — and very well reasoned — focus on content & typography. I know it is unreasonable to nitpick and criticise details of a website design without knowing the brief and circumstance, but when your focus is so clearly defined there is little room for such apparent errors.

I do realise that I am opening myself up for criticism here, so I’ll start.

A Loss of Identity

My website design is also very much content focused. To aid my goal of content parity I continued a minimal design style that my personal websites have always had, but the over focus has led to a rather plain small-screen experience:

Only after the mysteriously arrowed “DBUSHELL” is tapped does the header appear; the most visual and ‘branded’ element.

Sure, my website aims to be readable and accessible. I don’t think visitors will have any complaints (comment section below!) Despite that I can’t help feeling part of the identity has been lost. Frankly it’s a bit dull, and so are the three websites above if I’m brutally honest. Even without their problems, is highly accessible content the end game?

While it is true that — at least for blogs like this — the real value is within the content, it’s still our job as designers to use visual presentation as an enhancer, a persuader, a seller. We can’t just rely on words no matter how eloquently they’re written or how beautifully they’re presented. It cannot be emphasised enough just how important solid typography is but it’s still one of many foundation of good design. To design a compelling website — particularly on mobile — requires more.

With so much focus on pure content we’re in danger of losing our license to design. The supposedly superficial ‘decoration’ is what makes a website compelling in a bustling commercial environment. A back-to-basics deconstruction of your personal website is a great way to understand the significance of content and content-first strategies, but from all I read today I worry that many in the industry are letting it hinder their ability to actually design, experiment, and — dare I say — incorporate real issues of anti-content responsibilities like advertisement and sponsorship into website design.