How to write copy and UX for a homepage

There’s a write way and a wrong way to structure the layout and messaging for your business’s homepage

Course creator Danny Margulies asks: What are some good copywriting guidelines for homepages?

I have some strong opinions on this. I wrote about them last year but my take has evolved a little bit since then.

You would think this would be a simple answer, but it’s not… even if the homepage feels simple, the approach that creates it can have a lot of parts to it.

Caveat: these guidelines apply to niche B2B tech/creative firms (which are sort of the same thing nowadays) selling complex services or products to professionals and other businesses.

That said, maybe they are of value for other positioning use cases.

Some basic premises about the purpose of a homepage:

  • The homepage is a lead capture landing page first and an informational page (lead nurturing/client retention) second
  • For the purposes of your copywriting approach, mentally divide your homepage into two visual parts: (1) above-the-fold, what you see when you land on the homepage, and (2) below-the-fold, what you have to scroll to see. Above-the-fold should be about the same for mobile/desktop.
  • The above-the-fold part is for lead capture (book a product demo, schedule a strategy call, subscribe to a newsletter, etc)
  • The below-the-fold area actually has three purposes: (1) nurture returning leads/visitors (2) retain existing clients (3) lead capture

Above-the-fold checklist

Based on the premises laid out above, here are guidelines for above-the-fold homepage copywriting. You can think of these as a checklist by which to evaluate your own site.

  • A homepage above-the-fold is a de facto landing page – does yours feel like one, even if it retains some degree of navigational UX?
  • As you would on a landing page, remove distractions from the homepage above-the-fold with a strictly minimalist header
  • To be specific, there should be no more than 5 total things to click on above-the-fold. 3 is ideal.
  • Don’t ever use a home link in your main menu; that’s what the logo is for so it’s a waste of space
  • The logo should be accompanied by a straightforward tagline that supports lead capture. Assume people don’t know who you are; write a straightforward tagline that informs them what you do and for whom you do it (ie. them)
  • The most prominent thing to click on by far should be the lead capture call-to-action (CTA)
  • Always include this CTA twice – in the (sitewide) header on the far right and in the main above-the-fold area 
  • Do not ever have more than one CTA above-the-fold; the header’s CTA and the main CTA should be identical – use the exact same words for both
  • If you use a hero image, it should visually evoke a future state – the state of the prospect after a call with you, after buying your product, after benefitting from your newsletter.
  • For a consulting firm, even one selling productized services, the hero image can be a photo of the firm’s principal(s), since that can evoke the future state of working with that person
  • You can also use an abstract graphic but again, it should evoke a future state somehow
  • If your hero image or abstract graphic doesn’t contain people, be sure to include people another way – a thumbnail photo of either the company principal(s) or of customer(s) is ideal. There should be a human face.
  • Next to your CTA, write a headline that does three things – evoke a painful problem, offer a solution, and make it clear who specifically the solution is for. Sean D’Souza calls this “the trigger”, as I have written about before
  • As mentioned above, the tagline can help your headline do the work of describing who the solution is for; they work together
  • Offer bullets or a mini-FAQ that resolves objections to purchasing that solution
  • Let at least one testimonial be at least partially visible above the fold
  • Testimonials are better than logo bars but include both if you can
  • Transcribe testimonials word-for-word from live-recorded interviews and let them include pre-purchase doubts or objections

That’s a long list – can you do it all above the fold? Yes, it just takes work.

Below the fold

So what does that strict focus on lead acquisition above-the-fold leave you with?

This is less a checklist than the above-the-fold part above, probably because I haven’t thought or written about it as much. Still, I have some very definite views on this part of your homepage:

  • The footer is the new header. Let it take up as much space as it needs to, even the entire viewport
  • The things that used to go in the header – like the full navigation menu, social/share links, privacy, support, etc, – should go in the footer.
  • The footer serves the purpose of client retention (gives them the information/support they need) and lead nurturing.
  • That said, the footer should also repeat the primary CTA
  • If you have a secondary call-to-action, repeat it in the footer, but do the work of supporting it with a headline, testimonial, human face, etc., as described for the above-the-fold CTA. 
  • What goes below the above-the-fold area and the footer? This could probably be its own section. Here’s where you put the rest of your entire website in a microcosm: content, product information, company bio, etc., with an emphasis on positioning your business as being relevant to a specific audience – or at least to a narrow group of audiences.

Counterpoint – do not put your whole site into one, long scrolling homepage.

For one thing, that approach cuts the page load time – you want a lightning-fast homepage. For another thing, it cannibalizes other shareable URLs that should have their own independent identities, particularly your product and pricing pages. Lastly, it’s passé in 2020. It makes it look like you don’t believe enough in your business to give it the complete, professional website it deserves.

If may have bullet-pointed you to death here, my apologies! 

My best,

Rowan