◐Design in practice

Three — everything else is fine-tuning:

1. Readability. Sufficient contrast, a large enough font size, enough spacing. That decides whether anyone reads.
2. Images. They shape the impression more strongly than any colour.
3. Structure. Whether you can see at first glance what it is about.

What matters less than is claimed in meetings:

• The exact shade of blue.
• The typeface, as long as it is readable.
• Whether an element is rounded or square.

No job has ever been lost because of a shade of colour. Because of a text that does not say what the business does, yes.

The practical recommendation: choose a theme, take the colours from the logo, done. Put the time saved into texts and photos.

Enlarge

From the logo, if you have one. Otherwise one of the suggested themes, without agonising for long.

So that you know:

• One main colour is enough. It is used for buttons and highlights; the rest stays neutral.
• Two strong colours side by side rarely look good and almost always look loud.
• Contrast beats taste. Light grey text on white looks elegant in the preview and is unreadable on a phone in the sun.

What to bear in mind when you take a colour from the logo: it must work as an area, not just as a line. A strong yellow that looks good in the logo is unreadable as a button colour with white lettering.

And the hex value is in your logo — every graphics program shows it.

Four things, and all four can be checked in five minutes:

1. Contrast. Text and background must differ clearly. The test: turn the screen to half brightness and read.
2. Font size. Body text not below about 16 pixels. What is just about acceptable on a large screen is too small on a phone.
3. Line length. Beyond about 80 characters it becomes tiring; the themes limit this by themselves.
4. Spacing. Enough air between paragraphs. A wall of text does not get read, whatever it says.

The best test costs nothing: look at your site outdoors on a phone, in daylight. What is readable there is readable everywhere.

And: if you have to squint to read it yourself, it is too small — even if it “looks good”.

One that reads well — and there are many. The choice is therefore less important than it feels.

What matters:

• Two styles are enough: one for headings, one for text. Each additional one costs loading time without anyone noticing.
• No decorative fonts in body text. They are sometimes appealing in headings and always tiring in text.
• Enough difference between heading and text — through size and weight, not through a third font.

On the technical side: fonts are served from your own server, not from a third-party provider. That is faster and spares you a data protection problem for which websites have received formal warnings.

If you want to bring in a font of your own: check the licence. Websites usually need a separate one.

Yes, at any time, and without your content suffering. Design and content are kept separate.

What can change when you switch:

• Line breaks. A different font is wider or narrower; a heading that fitted on one line before may not afterwards.
• Effect of images. Some themes show images larger or cropped differently.
• Approvals in Aurora Hive Live, if sections are replaced in the process.

What you should do afterwards: look through all pages once, on a phone too. That takes five minutes and finds the two places where something is stuck.

And do not keep changing. A website that looks different every quarter seems restless, and your customers notice it less than you think.

Texts, images and the design values — directly on the page, with an immediate view.

The advantage over the form: you see what you are doing. A colour change that is abstract in the form takes effect on the whole page here immediately.

What you need to bear in mind:

• Saving does not mean publishing. In the live editor, too, the change stays a draft until you publish.
• If you leave without saving, the change is gone.
• Design values affect the whole website, not just the page you are looking at.

The last point regularly surprises people: anyone who changes the accent colour while on the contact page changes it everywhere.

Then in this order:

1. Check whether it can be built from existing blocks. In most cases, yes — a price overview from a card grid, a process from a timeline.
2. Check whether it is really needed or is a habit carried over from the old website. Very often it is the latter.
3. Solve it differently. A booking tool should be linked, not embedded.
4. HTML section as a last resort — with all the drawbacks: it breaks the design, can fall apart on a phone, and may load third-party content.

What you should not do: sneak in your own CSS to move something. After the next change of theme it breaks in three places, and nobody knows why any more.

And report the request. What several people are missing is a candidate for the next version.

No — the design adapts. But you do have to check it.

What is different on a phone:

• Headings wrap. One line on a computer can be four on a phone.
• Images are cropped more, usually towards the centre.
• The menu collapses. A list of twelve items fills the screen there.
• Side by side becomes one below the other. Three cards stand in a single column there.

Check after every major rebuild:

• Is the heading still readable?
• Can the buttons be hit with a thumb?
• Is the phone number tappable?
• Can you see what it is about without scrolling?

On a real device, not in a narrow browser window. More than half of your visitors come from there.

Usually: less. The reflex is to increase spacing; the cause is almost always too much content.

Check:

• How many sections does the page have? Beyond eight, every page becomes restless.
• Does each section say something of its own? Two sections that say the same thing become one.
• Are the texts too long? Cutting a third makes almost every text better.
• Too many images?

What the theme itself handles: spacing between sections, line spacing, margins. You do not need to adjust those — and should not, because it takes effect everywhere.

The most effective move against an overloaded page: move a section to a subpage of its own. Then both are better.

It brings structure with it, and that is more valuable than the look.

What you get:

• A page layout that is usual for this kind of business.
• Sections in a sensible order.
• Sample texts that show what belongs where.
• Colour suggestions that suit the industry.

What you do not get: your content. The sample texts all have to be replaced — every single one.

Changing the industry later is possible, but it is worth choosing it correctly at the start: the structure is the part you would otherwise spend longest on.

And if no industry fits: take the most similar one. The structure matters more than the label.

As far as is sensible, and that is usually less than one to one.

What you should adopt:

• The main colour, as a hex value.
• The logo.
• The tone of the texts.

What you should not force:

• The exact font, if it reads poorly on the web or needs an expensive licence. A similar, well-readable one is better.
• Print specifications. What works on letterhead often does not work on a phone screen.
• Layouts from the manual. A website is not a brochure.

And if your manual contains specifications for the web: check when they were written. Specifications from 2015 are often no longer suitable for today’s screens.

More important than any specification: that the page is readable.

Then the wrong question is deciding. “Which one do we like better?” has no answer — everyone has different taste.

Ask instead:

• Which is more readable? On a phone, in daylight.
• Which shows more quickly what we do?
• Which suits our images? If you do not have good photos, an image-heavy theme is the wrong one.
• Which can we maintain?

And if you still cannot agree: one person decides. A theme debated for three weeks costs more than any wrong decision — especially since it can be changed in five minutes.

The honest sentence for the meeting: no customer has ever failed to call because of the colour.