Designing honestly for the web

Ignoring the medium in which you're designing for is dishonest design. I've frequently witnessed dishonest design on the web. I call it bending the web.

I hold my hands up—I've bent the web many times in the past. That's okay thought because I've learnt from them. Here's some of the mistakes I've made:

In A Dao of Web Design, John Allsopp shares timeless insights that tell us why we design dishonestly.

“If you've never watched early television programs, it's instructive viewing. Television was at that time often referred to as “radio with pictures,” and that's a pretty accurate description. Much of television followed the format of popular radio at that time.”

Like the relationship between television and radio, there's a relationship between print and web.

“In print the designer is god. An enormous industry has emerged from WYSIWYG, and many of the web's designers are grounded in the beliefs and practices, the ritual of that medium. As designers we need to rethink this role, to abandon control, and seek a new relationship with the page.”

We don't like change and we can't relinquish control. We take our long, deep-rooted belief and experience in a previous medium, and mindlesssly apply to the new one, despite the problems it causes.

When the web came along, we believed we should have the same visual control as we did in print design. Today, that belief is still prevalent. We don't just think it should behave like print, but also more app-like, whatever that means.

But what does this have to do with dishonest design? When we bend the web, we are designing dishonestly. When we design dishonestly we tend to design unfriendly, unintuitive experiences, which can actually break the inherent features of the web. The very same features which make the web so simple, so powerful, so amazing.

Since the web has been around for a good while, this comes to down to ignorance.

The web and the web browser gives us an amazing set of tools, not to be messed up. Elements such as links, buttons, pages, forms, back buttons, bookmarking, images, videos, headings, paragraphs, focus outlines and more.

It's worth understanding what these elements mean, how they work, and how we can present them to users to signify their behaviour and utility.

These elements have meaning beyond just how they look.

Do you look at other websites on your Macbook Pro and iPhone 134 and think “if it's good enough for them, it's good enough for me”? That's lazy.

Sometimes a solution works well for a mobile app, but works badly on the web. Infinite scroll is an example of this.

Have you designed a drop down menu to work without a submit button? This is also bending the web. A select box is for input, not for navigiation.

You should note that browsers and devices get better all the time. When we design honestly, the experience gets better all by itself, with no effort on our part—just use a form on your phone and notice how it helps you fill it out.

Designing dishonestly costs the user, costs the developer time and the business money, often because the results inadvertently exclude users unnecessary. You might get away with the odd bit of dishonest design, but why would you want to?

I write articles like this and share them with my private mailing list. No spam and definitely no popups. Just one article a month, straight to your inbox. Sign up below: