Legibility ≠ Optional

Colm Roche
Jun 21, 2015 · 3 min read
Image for post
Image for post
Muji Sleep

When creating a website, there’s a mental checklist a designer might run through… is this engaging?, is it easy to understand?, is it on-brand?… but the very first, no-brainer point is, can people read it?

Yet, Microsoft, a $340 billion company with “an army of designers, researchers, developers, prototypers, typographers, program managers, ethnographers, writers and creative thinkers”, has completely illegible text on their homepage.

Image for post
Image for post
Image for post
Image for post
Microsoft.com

And, they’re not alone. There’s an increasing trend of having text that’s difficult, even impossible to read.

It’s not small companies that can’t afford designers and it’s not obscure, out-of-the-way pages. It’s often large, design-conscious companies and typically on their homepage or prominent section pages.

Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Airbnb, HTC, Nike and Squarespace

I see three key factors at play here:
1. Responsive design
2. Not designing with real content
3. Not giving a shit about the text

Responsive Design

If you’re overlaying text on top of imagery, it’s difficult to get it to work across a range of screen sizes. There’s a delicate balance between clear-space in the image and line-length in the text. Trying to figure it out with static visuals can be impossible.

Prototype it.

It doesn’t need to be production code. It doesn’t need to work on different browsers. A basic, rough-as-hell mockup will quickly show you what will or won’t work across different sizes.

Design with real content

Making a design work using optimal images is relatively easy. If you’re dealing with user-generated or dynamic content, you need to plan for worst case scenario images. If you’re overlaying white text on an image, expect that someone might use a predominantly white image.

Image for post
Image for post
Airbnb

Give a shit about the text

Visual design is about communication — combining text and imagery to deliver a message or tell a story. Choosing a beautiful photo and treating the text as an inconvenience — something stuck on top with no regard for whether people can read it — is bad communication and it’s not really design.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store