Your website’s homepage is the most important part of your entire site. A hero section or banner is an easy way to showcase the latest news, current promotions, or tell visitors exactly who you are in a few words. A captivating banner draws the user in and directs them further into your site, allowing you to expand on your unique selling points. It’s important to craft banners that stand out and are easily understood at a glance. If a user has to pause to understand what the website is about or whether it will address their needs, they’re likely to hit the back button on their browser and try another website.
The dos and don’ts of banner design
When crafting your banner, start with the message. Think about what exactly you want the user to do or understand from a glance, and develop that into the full banner.
Each banner should include the following:
A descriptive yet concise headline.
If your brand has developed a brand voice, use it. Are you straightforward? Humorous or snarky? Active or passive voice? These choices help your messaging stay on brand and sound consistent. Keep the headline to one or two sentences. A cryptic headline that’s explained in the subhead copy? Could be intriguing to users, but it risks losing others before you can explain. Plain language converts. You have more opportunities to explain once you’ve grabbed the user’s attention. Make it clear or users are hitting the back button.
Call to action.
The CTA, or Call to Action, is the single most important thing you want the user to do after reading. The idea is to give the user a direction to continue their journey into your site. This is typically a button or text link with very short, direct copy. Instead of “Shop the latest styles”, trim to “Shop now”. Give the user a preview of what clicking the link will do. If you want to direct users to an explainer page, “How it works” could be great microcopy. Optionally, you can include a second button. The risk is that it increases user friction as they must now decide which button is the right choice.
Clean supporting graphics.
Don’t confuse the reader with flashy graphics. Use context-appropriate photos from sites like Unsplash, iStock, or Pixabay, or opt for solid blocks of colors to really let your copy stand out from the site.
Don’t include:
More than two sentences.
Users are quick to hit the back button. The goal is to funnel customers in with a clear message and next action. Once they’re in your site, you can add additional context and messaging.
Your logo again.
It should already be on the website, likely in your top navigation. Including it again only serves to clutter the banner and distract from your message.
Too many CTAs.
Using more than two buttons, or including some sort of dropdown that requires user choice and thinking immediately.
Avoid using multiple banners.
Few users will click through your slides or wait for the banner to auto-advance. Sometimes stakeholders “absolutely need” to include a banner in order to greenlight a project or feel like their input is heard; extra slides are perfect for that, but putting important messaging on a second slide is resigning it to obscurity. Change your banners more frequently, or change those messages to be distributed via your social or email channels. If you have a short-term message and you don’t want to disrupt your main banner, consider a thin announcement bar underneath the main banner. Something like special holiday hours or stock announcement would be perfect for this spot.
Summary
Your homepage banner is the most important spot on your site. Make a good impression with:
- A clear call to action
- Short, direct supporting copy
- Clean graphics that support, not distract, the content.
Need help creating a content calendar or crafting thoughtful messaging? Maybe your website needs a clean upgrade? At Cohesive, we build thoughtful, modern websites that perform and convert. Get in touch with us today!
