I’m not crazy: 10 great, content-friendly web designs
Ian Lurie Dec 27 2010
A marketer walks into a meeting, ready to see the newest designs for their client’s site. The new design is beautiful. It makes everyone weep with joy. It’s also totally devoid of text.
The marketer (or SEO, or copywriter, or strategist) walks back out of the meeting, punches a wall until their hand flattens, and then goes back to work.
Stop me if you’ve heard this one.
A few months later, they’re called into an "all-hands" meeting. Turns out the CEO just read about SEO, or conversion rate optimization, or the need for great copywriting. Now she wants to know why the shiny new site doesn’t rank, converts like crap and seems to spur more questions than it answers.
Am I insane?
I’d swear that this whole internet thing started as a way to pass around information. And text content remains the most foolproof way to communicate online. Text content = information.
Far too many designers seem to think text is the enemy of great design. To me, they’re inseparable: Web sites that best fulfill their business goals design for text content, instead of burying it. When I say that, though, everyone in the room looks at me like I just started gibbering madly about purple elephants and acid trips.
In the interest of either proving my sanity or showing there are other crazy people out there, here are 10 spectacular text-friendly web sites that also happen to brilliantly do their assigned jobs:
Great, text-rich home pages
No page of the site resists text more than the home page. The home page is like text Gore-Tex. If I suggest as little as five words of real, readable copy on some home pages, the design team looks at me like I turned into a large, talking turd.
And no, a small paragraph of 5-point type that’s 2 shades away from the background color and 200 pixels below the footer is not a "compromise". I want home pages that are informative and easy to read. Can we do that? Turns out, yes:
37Signals remains the state of the art when it comes to simplicity. Check out their company home page:
Lots of text, and very few images. The page loads and renders in 5 seconds. It looks great. And it’s unique in layout and concept, or at least was, before people started copying it.
A lot of brand managers tell me that 37Signals isn’t a "real company", though. That’s ridiculous, but I’ll play along and show companies that sell or promote stuff we all know about, like web hosting.
Media Temple sells (oddly enough) web hosting. Their home page has a purty image with a slide show, but it also has a decent proportion of text, and full text navigation, all above the fold:
It’s not exactly a content bonanza, but it’s clear, and it’s obvious the content wasn’t slapped up there as an afterthought.
Doesn’t get much more traditional than wine. Jax Vineyards created a slick layout that presents the product, front-and-center:
Look at how they use type to create a beautiful, easy-to-read page. Their font choices and line spacing make me sweaty. Yes, I’m a typography geek.
The point, though, is that this page practically reads itself to you. The reader can take it all in in a matter of seconds.
Adobe makes Flash and Photoshop, among other things. But their home page is a study in creative, readable text placement in a bright, deep design:
Aside from the logo, every letter on this page is cut-and-paste-able text.
A great, content-friendly design doesn’t have to have tons of text on it. The Emptees site focuses on images, but also includes the "just arrived" and other listings at the bottom of the page, and the "What’s going on here?" section at the top right.
That adds up to a page where I can quickly figure out my next steps, and learn about the company at the same time.
Text-centric internal pages
Once the content team wins the Battle of the Home Page, they often lose the War of Internal Pages. Every page on a site is a potential landing page. So providing text-friendly internal pages can be every bit as important:
37Signals’ HighRise leaves nothing to the imagination, explaining their entire product on a single, easy-to-read page that makes you want the product:
Not everyone can pull this off. You need fantastic copywriters, and a designer who can use whitespace, columns and type the way most of use air.
O2 Alternative, a web site design and development shop, works in bright colors while still emphasizing information:
This is a design firm that made a conscious choice to build text into their layout. Note the line spacing, use of large fonts to make their site easy to read, and my favorite part, the red peppers.
Fantastic, text-friendly e-commerce designs
Did you know that you can sell more products by actually telling people about them? It’s true:
Apple MacBook Pro
A great, content-driven design doesn’t have to put text above the fold. Note how Apple leads your eye down the page, then shows key features of their top-end laptop:
Click any sub-navigation, such as "design", and you find even more text-intensive layouts:
Apple has mastered the art of progressive content: As you dig deeper, they assume you want more information, so they provide increasingly dense content on deeper layers of the site. It makes sense: If you take the time to click further into the site, you’re looking for details. So Apple delivers them.
Postbox puts their call to action front-and-center. They also take advantage of text-shadow and other emerging CSS properties to get some great text effects, while ensuring the site will degrade gracefully for people with older browsers:
You learn all of the high-level benefits of their product on the home page, then click to internal pages when you are ready for details.
Even fashion companies get into the text-friendly act. Rapha features lots of products on their home page, as well as blog post summaries:
And their internal pages are ultra-informative. They have a short description and "buy now" block at the top right. Readers who want more information – including cycling nerds like me – can scroll down to dig deeper:
This site looks great because of text, not in spite of it.
In all things, moderation
Some brands do just fine with image-focused, text-repellent designs. Some demand it. I’m not suggesting that every web site has to be text-friendly. But if:
- You’re already struggling for organic search traffic;
- You’re have PPC quality score problems;
- Your customer service line is ringing off the hook with the same questions, again and again;
- You need to explain your product and let visitors get more details when they want them;
- You want ultra fast-loading, attractive pages; or
- You have a great copywriting team, and think your writing is an asset.
…then looking at the sites listed here should show you the way.
Ian Lurie is CEO and founder of Portent Inc. He's recorded training for Lynda.com, writes regularly for the Portent Blog and has been published on AllThingsD, Forbes.com and TechCrunch. Ian speaks at conferences around the world, including SearchLove, MozCon, SIC and ad:Tech. Follow him on Twitter at portentint.He also just published a book about strategy for services businesses: One Trick Ponies Get Shot, available on Kindle. Read More
- Parallax Scrolling? HTML5 Animations? Why We’re Falling for New Design Techniques
- Server response survey results: Now, with more pepper spray!
- 10 tips for minimal-mayhem agency site redesign
- New SEO tool: Server response code tester
- Why all web developers should learn SEO
- 5 response codes you gotta know: Learn to speak server