· The AI Web Factory team
What your website decides in the first three seconds
Trust is won or lost before anyone reads a word. What the eye looks at first, what scares it off and why web design is above all a matter of order.
There is an old and fairly well-known experiment in the trade: you show people a website for half a second and ask whether it inspires trust. The answers given in half a second almost always match the ones the same people give after browsing for a while.
In other words: the decision is made before reading. And then it gets justified with reasons.
That does not mean you just have to make pretty websites. It means you have to understand what the eye is looking at in that half second, because it is not what most people think.
The first thing you see is not the logo
It is the overall shape. The eye takes in a pattern of light and dark before it recognises any form. If that pattern is orderly, the brain lowers its guard. If it is messy, it goes on alert.
That is why a website with plenty of white space and three elements comes across as more serious than one with fifteen things begging for attention. It is not minimalism as a fashion: visual clutter takes effort and nobody likes effort.
The home test is to squint until the screen goes blurry. If what is left is a big block at the top, a readable heading and a button that stands out, you are on the right track. If what is left is a grey soup, there is work to do.
Text size, which is almost always too small
A 14-pixel body text was normal ten years ago. Today it is hard to read, especially from around forty-five onwards, which is the age of a good share of the people who hire services.
We never go below 16 pixels for body text and go up to 18 on text-heavy pages. And the column width stays under about 70 characters: when a line is longer, the eye gets lost going back to the start of the next one and you have to reread.
This is not opinion. It has been measured in reading tests since the seventies, when they were done on paper.
Contrast is not an accessibility detail
It is usually presented as something done for people with sight problems. It is that, which would be reason enough. But it is also what decides whether your website can be read on a phone in the sun.
The standard asks for a contrast ratio of 4.5 to 1 between text and its background. The light grey on white you see so often, the one that looks so elegant on the designer’s screen, often stays at 2.8 to 1. Out on the street at midday it is invisible.
There are free tools to check it in thirty seconds. The odd thing is that hardly anyone does.
A button has to look like a button
For a few years it was fashionable to strip buttons of depth, colour and even borders. It looked modern. And people stopped clicking them.
A button needs three things: a colour that appears nowhere else on the page, enough size for a thumb (at least 44 pixels high) and a label that says what happens when you press it. “Request a quote” works. “Send” is lukewarm. “More information” says nothing.
And one per screen. If there are three equally eye-catching buttons, there are none.
Typography says more than it seems
Not because of the shape of the letters, which hardly anyone notices, but because of consistency. Two families at most. Three weights at most. If a single page has five different heading sizes, the reader no longer knows what matters.
We use a single family in almost every project and never go above weight 600 for headings. 700 and 800 look clumsy on screen and weigh more.
Where expensive design fails
We have audited websites that cost a fair amount of money and failed on cheap things. A menu that covered the content on mobile. A contact form with nine required fields. A beautiful home page that took six seconds to appear because it carried an uncompressed 40 MB video.
The pattern repeats itself: care went into what is seen in the presentation to the client, not into what happens when someone arrives with a four-year-old phone and patchy coverage. Which is the normal situation.
The order we follow
First, make it readable: size, contrast, column width. Then make it understandable: what you offer, to whom, how people get in touch. Then make it load fast. And finally, make it pretty.
It looks like the reverse of the usual way and that is on purpose. An ugly website that works can be made beautiful. A beautiful website that cannot be read has to be rebuilt.
If you have doubts about yours, try the squint test. And if you want a second opinion, write to us.
Comments
To comment you need to sign in with an account. We never publish your email.
When you sign in, your name and profile picture are saved with your comment. You can delete it whenever you like. We explain it in theprivacy policy.