Homepage design: what should your homepage say, and in what order?

The management meeting about the new homepage goes like most. Sales want the campaign at the top, HR wants the job listings up front, the managing director wants the company history and values included, and the product manager wants the three newest products in a carousel. The result is a homepage with six rotating images, nine buttons and a headline that reads “Welcome”. Everyone is represented, and after five seconds no visitor knows what the company actually does.

A good homepage starts with the visitor. It answers three questions straight away: What do you do? Is it for me? What do I do next? The rest of the page routes different visitors onward and gathers proof that you can deliver. Once that structure is agreed, it becomes much easier to say yes or no to all the wishes from the management meeting.

What does a homepage need to do?

The homepage is the page most people land on when they search for your name, click a link in an email or type the address directly. It has three jobs, listed in order of priority.

1. Orient: say within seconds what you do, for whom and where.
2. Route: give each important audience a clear path to the page that is relevant to them.
3. Convince: show enough proof that the visitor dares take the next step, even without clicking further.

This is where a homepage differs from a landing page, which has one audience and one action. A homepage serves several audiences, but it should still have one primary action that everything else supports. We cover the difference in our guide to landing pages.

What belongs above the fold on a homepage?

“Above the fold” is what you see without scrolling. On a phone it is often just a headline, a couple of lines of text and a button, so every word counts. People are happy to scroll, but only if the top has convinced them they are in the right place.

• Headline: what you do and for whom, in plain language. Include your area if you work locally.
• Subheading: your strongest argument or what sets you apart, in one or two sentences.
• Primary button: the one action you most want, such as “Get a quote” or “Book a time”.
• Secondary option: a less prominent path for those not yet ready, such as “See our work”.
• Proof: review stars, client logos or a concrete number.
• Image: your real product, people or result. An image that explains beats one that decorates.

From generic to specific: headline examples

Which sections should a homepage have?

After the top, the sections follow the same logic as the visitor’s thinking: What can you help me with? Can I trust you? How does it work? What do I do now? The table shows a structure that fits most service businesses and that you can adapt.

Example homepage structures for three types of business

The basic structure stays the same, but the emphasis shifts with the business. Here are three examples we often start from when sketching a new homepage.

Local tradesperson or service business

A headline with trade and area, phone number and “Book a site visit” above the fold, Google stars right under the button. Then the services as cards, photos from real jobs, a map of the area you cover and the process in three steps. Booking is what creates value, so it should be reachable from every section. See how it can be put together under website for tradespeople with booking.

B2B company with a longer sales cycle

A headline describing the problem you solve and for which kind of company. Primary button for a meeting or demo, secondary for cases. Then paths split by role or industry, client logos, two or three cases with measurable results and a section of guides or knowledge that helps decision-makers internally. More on this in our guide to B2B websites.

Webshop

Search and categories take up more space, because most visitors already know what they are looking for. The top shows the main category or campaign with a clear button. Then popular categories, bestsellers, delivery promise and returns, reviews and a newsletter. Delivery time, shipping cost and payment options should be visible without searching.

Carousel, video or static image at the top?

Video at the top can work when it shows something words cannot, such as a product in use. Keep it short, muted, with a still image as fallback, and make sure the headline and button stand out clearly on top of it. A heavy background video that only sets a mood usually costs more in speed than it gives in impression.

How do you test whether a homepage works?

The simplest test needs no tools. Show the homepage to someone who does not know your company for five seconds, close it, and ask: What does the company do? Who is it for? What would you click? If they cannot answer, the top is not clear enough. After that you can move on to data.

The usability test usually gives the most surprising findings, because you see where people hesitate. We describe the method and a ready-made test script in our guide to usability testing.

What does the homepage mean for SEO?

The homepage is usually the page that ranks for your company name, and the page with the most links from other sites. It should therefore have a title and an H1 that describe what you do, and links to the most important service pages, so some of that strength flows on to them. The homepage should leave most of your keywords to the inner pages, each targeting one service or topic. We cover the technical foundation in our guide to an SEO-friendly website.

How should the homepage look on mobile?

Design the homepage for the phone first. The headline must be readable without zooming, the primary button visible on the first screen, and click-to-call right at hand if the phone is your main channel. Service cards stack, and proof such as stars and logos should never push the button below the fold. More on the principles in our guide to responsive web design.

Which homepage mistakes do we see most often?

• A headline like “Welcome” or a slogan that could sit on any website.
• Nine buttons with equal weight, so none of them stands out.
• A carousel with six messages, where the most important one is on slide four.
• Stock photos that show neither your people, product nor results.
• No price, no area and no contact details above the fold.
• Testimonials without a name or source, which look invented.
• A news section where the latest post is from last year.

How do we work on homepages at Ceptiv?

We start with the goals and audiences and sketch the homepage as a wireframe with real headlines before colours and images are added. That makes it easy to discuss content and order without getting stuck on taste. We explain the three levels in wireframe, mockup and prototype. Then we design mobile and desktop side by side as part of our UX/UI design and build in Next.js, so the homepage is fast from the start.

See examples of our work in the portfolio. If you need a new homepage as part of a new website, our web packages start at DKK 18,000 plus DKK 600 a month, and you can get a fixed price within 24 hours.