Let’s Talk About Landing Pages

By January 28, 2014 August 4th, 2016 User-Experience
Landing page designs superman and batman comic as drawn by Indu Reddy

With hundreds of content and design rules, creating an optimized landing page can be overwhelming. But it doesn’t have to be.

Let’s talk landing pages. A landing page is the first a user experiences about your website and brand. It is easy to get carried away focusing on how much content you can cram, how to be more creative than your competition, and what colors people like the most.

It’s really not so complicated. I’m going to break down the cardinal assets involving creating a landing page.

  1. Speed
  2. Copy
  3. Structure
  4. Design

Your landing page speed index needs to be under 4000 per speed testing website.

Instant gratification is the expectation of today’s consumer. If your page takes a long time to load, you are going to lose a large percentage of unique visitors. If your page takes a long time to load, chances are the rest of your site is slow, like zombie slow, and people will not deal with that. You want them to scroll, you want to them to navigate, and they will do that when your page has loaded in under a few seconds.

You have to know the limitations and possibilities offered by your web host, your bandwidth, and your client. Every time you add a new structure or design element to your page, test your web speed. Our goal with League’s landing page was to create a lightweight, fast loading page that was still beautiful. It took lots of trial and error, the resizing of images, and sometimes a different design strategy. But we never sacrificed speed for content.

Test your website’s speed here: http://www.webpagetest.org. If you’re in trouble, don’t panic, we can fix it.

 

Landing page copy tells users who you are, why you are there, and what you can do for them.

People skim over landing page copy, scanning briefly whatever words you have. So break down the sentences with bullet points and one liners. Have only one message, and make sure all your copy only reflects that message: who you are, why you are there, what you can do for them.

Do not cram copy into a banner expecting your user to absorb everything you want to say at once. A common fear that often leads to this is that users will not scroll. In this mobile generation, people are used to scrolling, and a high speed page with a two line banner will peak their interest enough to keep going. Your singular message should always be under two lines per banner and elicit a call to action from your user. This can be a ‘Contact Us’, ‘Our Work’, or any button drawing the user to literally make an action. If your two line copy and banner does not have your user scrolling, chances are the copy isn’t that great, and didn’t reflect the who, why, and what.

Make sure wherever they stop on the landing page, your copy is consistent. A good example of this is League’s landing page. The writing is easy to read, clear to the audience, short and consistent. There is only ever as much copy as we need, and never more.

Single column landing pages with clear structure and concise organizational flow keep your audience interested.

Have you heard of wireframing? It’s what writers like to call ‘write to page’. This is where you create a clean structured blueprint of your landing page; your logo and menu placement, how many menu bars you need, content placement, things like that.

It has to make sense organizationally. Now, typically landing pages are designed to attract and interact with users. To maintain that design element people use sites like WordPress, which offer hundreds of pre designed web pages. It is important to eliminate clutter in the structure of your landing page by removing existential material like sidebars and columns that are pre integrated with pages of WordPress.

After wireframing our own website to get an idea of how we wanted our page to look, we went right to our WordPress theme and modified a pre-existing page to create a clean, single column landing page with an easy to follow content flow.

Your landing page design does not need to be unique: it has to be clean.

This is not the time to showcase your creative whimsy. You rarely gain anything by not following a standard of website communication; a navigation bar in the top right, a logo in the top left, contact information at the very bottom, introductory banner top center.

Your content, colors, photos, and work speak for themselves here, so you do not need to blow a visitor’s mind with a slow interactive and overdone landing page; award-winning websites are rarely innovational. Design elements you do need to think about include a compatible color palette, whitespace around your copy, and an easy to read simple layout of visual content.

The user should never feel spammed with information or overwhelmed by visual clutter. The design of a landing page should include only content relevant to your singular message and brand. It is best to avoid stock images, clipart, memes, and viral content because they cause a disconnect between your message and the user. Immediately you create an air of falsehood and unoriginality [even though that cat meme is just so incredibly awesome]. A simple aesthetically pleasing page enables a user to get through the whole thing and understand your claim. And remember, check your speed after every new design element you implement.

Some things to NEVER do on your landing page:

Irrelevant material.
False imagery.
False endorsements.
Spamming information.
Having more than one message.
Including content that slows your page.
Boring copy.

Your landing page must have one goal: telling your user who you are and what you can offer. Simplicity is more valuable here than creativity. Create a single page that communicates to your audience a clear, genuine, and compelling [there’s that word again] message.

If you need help creating a landing page or have more questions, contact us.


Judson Abts

About Judson Abts