Is your online service ‘tabloid’ or ‘quality paper’?
A brief glance to tell whether a newspaper on a cafe table is tabloid or quality paper. A second to decide whether to explore an online service or look for another one. Before people have actually read your web page, its information architecture will shape their attitude.
This September I was lucky to attend an excellent talk on newspaper design and information architecture by Jasso Lamberg. And though Jasso hasn’t said a word on my own field, I ran out of napkins sketching and making notes on web apps design. As they say, whatever you tell a chicken, it’ll hear either ‘grain’ or nothing.
Apparently the principles are universal: before we’ve read the text, we judge the ‘quality’ of an edition not by contents (it happens before we’ve actually read anything), but by its overall information architecture:
- The less expressive, laconic design is perceived as high-class and quality.
- Contrast colours, banners with bright background, huge bold headings, many small chunks of text put side by side and competing with each other, all this makes you production look cheap and tabloid.
- Type choice and article/text length are not that important (but ‘quality’ papers usually post longer texts).
Frankly speaking, Jasso’s talk and arguments are haunting me ever since, every time I’m to choose a web service or to design one. It’s fascinating to better understand unconscious prejudice and the process of making one’s own decisions, especially as their roots go much deeper than the current digital era.
And while we’re waiting till Jasso publishes his profound findings with tons of figures and comparison tables (it’s his PhD), I want to show briefly how this shaped my own habits on using two similar online services.
This autumn our family has made a couple of trips in the ‘full team’ mode, with both kids. Finding a place to stay was a constant search of a compromise between the city centre and museums, zoo, good wi-fi and a working table, separate room for the kids, and a kitchenette. Oh, and of course, price.
Let’s find a place, I thought opening a browser tab with Airbnb.
And let’s look for alternatives, just in case we won’t be able to book what we want, I thought, opening Booking.com an hour later.
Being a happy customer of both services, I always had a strong (but sub-conscious) feeling that I’m looking at two completely different kinds of offer. One, more expensive and high-class, and another, cheaper and doubtful. Why so?
Apparently, this is what Jasso Lamberg was speaking about — the feeling I get opening the very first page of the service.
Laconic Design == Focus
On the web, laconic means focused. Whatever the graphic style is, if you don’t concentrate on the customer’s top task, it’s already redundant.
So what is my primary goal, my task #1? To find a place to stay.
Airbnb’s solution is impressive, isn’t it? About 40% of the first screen is given to the customer’s primary goal. Note the minimalist design of the search form. Note a classy photo that delights explorers and invites to explore more.
Now the Booking.com’s solution. About 15% for the primary goal. It means 85% of stuff I am not interested in right now. Also, note the search form design: basically you want to ask just one question — where to? With two optional ones: when? and how many people? which can be pre-filled with smart defaults (no dates could simply mean I don’t have specific dates yet, 20-something characters saved, no sweat on the server side producing error messages).
I won’t be comparing font choice or colours or texts on both services, because the difference is more subtle there. Focus on the primary goal is the main factor that dictates the visual style and information hierarchy here, and makes a ‘quality paper’ of one service, and ‘tabloid classifieds’ of another.
When Less is Much More
Focus means fewer user interface elements, but it also means more results achieved: customer interest, gratitude to the service for the goals achieved with minimal pain. In the best of scenarios it’s also a long-time relationship and the word of mouth marketing.
So what is focused design for a web page?
- Noticeable heading (is only good when concise, in large friendly letters).
- Alluring photos (you can emphasis only one big picture at a time).
- Readable text (you can’t put a lot of small chunks of text beside each other and hope the customer will read them).
- Easier form submission (fewer controls and smart defaults, more intelligence on the backend).
Only at First Glance?
The first impression is the most important, of course. But look, I’ve been a happy Booking.com customer for years, and nevertheless Airbnb seduced me immediately.
Usually I open Airbnb website first — it’s great to see impressive photos and imagine oneself in the place, find a better location in the neighbourhood, etc. But when there are problems with booking confirmation (and unfortunately this happens), we turn to our good old booking.com workhorse. Not pretty, resembling a free travel agency brochure they give you at the mall, but working — booking — without hiccups.
Information architecture speaks of a web application before the reader (the customer) has absorbed the words, figures, images, or whatever we fill our web pages with. Just like it does with newspapers. ‘Tabloidness’ can definitely be an intentional design strategy, or it can be a consequence of typical ‘design by committee’. And in the latter case you might be unpleasantly surprised with results, when your competition bets on the ‘quality paper’ pattern.
Many thanks to my friends Kate and Andrey, who were helping with their questions and comments, and arguments all the way long.
