In terms of SEO, Ahrefs and Semrush seem to be the most popular tools.
Does the hero section of their home page reflect that image? Does it have something to do with it?
Here’s an analysis of five SEO tools and what you can learn from it for your home page design.
Watch the live breakdowns
Semrush
Why it works: The design isn’t overwhelming, the call to action stands out, and there’s a clear benefit for the user.
What could be better: There are too many menu options, and they all look rather confusing. The call to action doesn’t lead to result but to a signup form. It’s misleading and it breaks my trust.
Lessons: Make sure your audience always knows what’s going to happen when they click something.
Ahrefs
Why it works: The design has no fluff and the title is very convincing. It’s features, benefits and outcome all in on.
What could be better: The symbols catch my attention but they aren’t relevant. The only thing this page is missing is a product demo. Could be solved with a search box like Semrush provides or a demo as seen on the SE Ranking website.
Lessons: Avoid confusion. I’m not sure if I need to pay to sign up or if there’s a free version.
Brandoverflow
Why it works: The design is clean with great contrast.
What could be better: Everything is very basic. There’s no social proof and the copy isn’t specific.
Lessons: Do a bit more to differentiate yourself from your competitors, especially when you’re competing with bigger brands.
SE Ranking
Why it works: The audience can get a taste of the product. Choosing the right SEO tool is a big decision and being able to check how it works before signing up saves people a lot of time.
What could be better: The visual isn’t relevant for the product. A clean background or relevant image would be better. There’s no social proof.
Lessons: In a competitive market many will ask “why you?” SE Ranking addresses this question with the first menu option. That’s a great idea.
Moz
Why it works: The call to action catches people’s attention and it’s easy to click. The color stands out, it’s free and even the background image guides you towards it.
What could be better: A bit more whitespace would make it easier on the eye. The title should be a bit clearer. Smarter, how?
Lessons: Designers often forget to make a connection between the hero section and the rest of the page. Not here.
Lessons from these SEO tool hero sections
All in all, these home page hero sections are pretty convincing. They must be because these are some of the leading brands in the industry. We did learn a few important lessons.
- Don’t mislead people with your call to action. Trust is key.
- Add a “Why us” menu option. In a competitive market, people want the answer to this question.
- Have a chat option but make it subtle. Chat boxes are great to have for people who have a question but annoying for people who don’t. A subtle button is better than an invasive pop-up window.
- Straight access to a demo account is a great feature. People want to check things out before spending time on a sign-up form.
- Be thorough with social proof: new subscriber count is a fun and convincing way to show your product is in demand.
Enjoyed this breakdown? Share your thoughts on Twitter 👇
