Where do you want me to click?

The case for a clear Call to Action on your homepage

Do you have a clear Call to Action on your homepage? Or are you confusing people?It’s a vastly overrated notion that a homepage should include all sections of your website and serve all kind of visitors. It needs one clear call to action.

Clutter:
To make disorderly or hard to use by filling or covering with objects

The need to put everything on one homepage

Employment websites do it. “Employers subscribe here”, “Companies list here”, “Latest jobs”, “Build your resume”. Real estate agents do it. “Buy these new homes”, “Sell your home with us”, “Latest sales”, “Upcoming events”. That’s really just the tip of the iceberg.

It seems that most homepages are designed with one thing in mind: “How do I make everything on my website accessible from this one single page.” Well, you can’t. Not in a way that your visitor will understand your company, product or really anything at all.

One clear Call to Action

To guide your visitor into or through your website, you should give him directions. Pretty similar to how a road needs road signs actually. Yes, you can put up multiple signs, but you should make the most important ones the biggest. Make it as big as possible. Make it stand out.

Everybody has visited that one great looking website in all shades of grey that had an orange RSS button that drew all attention. That’s really bad design in my opinion. The thing that stands out is your call to action: that’s what you want visitors to click on.

A different approach to a Call to Action

There are many ways to use and implement this call to action. One is using the big bold button, preferably in a color that is not used in the design of the website (the orange RSS button mentioned above). You might also use whitespace to emphasize a specific part of the homepage, making it stand out that way.

We recently had a client for a website review who has this (quite common) idea of starting his website with a choice: three options for three variations of a product. That would imply three call to actions…

No problem, if you combine the two ways mentioned above. So make a block that really stands out (use sufficient whitespace around it) and add three similar call to actions, with (very important) a descriptive title for that block, like “Make your choice”. That way, the entire block becomes your call to action.

Now let’s illustrate the simplicity of call to actions by looking at some example websites (none of them are clients):

Jobsite.co.uk

Jobsite is a leading UK online recruitment site, dedicated to helping you find your next job.”

I actually got lost on your homepage already. Yes, I understand you want me to search for my next job on your page, or do you really want me to register first? One very distracting issue this homepage has, is that the Vision2learn banner has the largest call to action of the page…

jobsite.co.uk screenshot

Scuolaleonardo.com

Since we do website reviews for websites from all over the world, I decided to look up an Italian School in Italy and found Scuola Leonardo da Vinci. After looking at their website, I decided to stick to Google Translate… as I couldn’t find where to apply for a course.. The question “Where do you want me to click???” is impossible to answer for this website. The total lack of a call to action, combined with the overall clutter, makes a visitor head back to Google in the blink of an eye.

scuolaleonardo.com screenshot

Walmart.com

Help me out here, Walmart. Why do you want me to click my empty cart? Don’t get me wrong, for shopping sites, emphasizing the cart is always a good thing. But I think what Walmart wants me to click is something else, like the free shipping offer or perhaps a product I could buy. Now that should be the orange button on that homepage! Also, the banner “Shop Top Brands” is just a list of products and prices. The call to action on that banner should also be clear (“Shop NOW” or something like that).

Get to work!

What is your homepage’s main call to action? Is it clear enough? Go and make it clear. You’ll have a better website for it!

Image for 3D person sitting on a question mark used in license from Shutterstock.

Yoast.com runs on the Genesis Framework

Genesis theme frameworkThe Genesis Framework empowers you to quickly and easily build incredible websites with WordPress. Whether you're a novice or advanced developer, Genesis provides you with the secure and search-engine-optimized foundation that takes WordPress to places you never thought it could go.

Read our Genesis review or get Genesis now!

45 Responses

  1. Web Design by SiteDesignZBy Web Design by SiteDesignZ on 17 February, 2012

    I like the logic, actually thought the Jobsite was pretty good till you pointed out the error of the bottom two buttons.

    Ok, so do you have any sites that you admire the way they approached the interface using your view. Any ones in particular that really nailed it?

    Im designing a real estate interface right now and would love to see what you think is a good example or how a realtor could use this.

    Best, Tom

    • Michiel HeijmansBy Michiel Heijmans on 17 February, 2012

      Hi Tom,

      Real estate websites are indeed not that easy, as pointed out in the post. The thing is that you should focus on what is most important on that homepage. You will most probably have two types of visitors: selling ones and buying ones. That could also imply two great, optimized landingpages, addressed from the homepage.

      I already refered to creating a call-to-action block. I think that would be best for a real estate agent. Compare your own project Levermore. The one thing those call-to-actions need is a way better text on the buttons. For the real estate website these buttons could read “Sell your house” or something like that.

      Agree?

      • Web Design by SiteDesignZBy Web Design by SiteDesignZ on 17 February, 2012

        LOL..With a realtors that’s tough one. They like to push the clutter…kind of like a used car ad in the paper. But like the idea of trying to split the call to action to buy or sell.

        When I studied interface design in school (years ago) the idea was not so much clutter…but more emphasis. Using different size buttons and text to draw attention to the more important areas and layout to direct the eye on the page so it would flow naturally across it. I dont always get to follow that, as the client (which Dragan explained below) does gets what they want. I really is not worth the time to explain proper interface layout strategies. But we try.

    • Michiel HeijmansBy Michiel Heijmans on 17 February, 2012

      Ow, and just remove the clutter ;)

  2. Bill ParlamanBy Bill Parlaman on 17 February, 2012

    Great post. So many people focus on more traffic and do not concern themselves with conversion. It’s a mistake to treat your home page like a landing page.

    On a side note, another conversion killer is light grey text on white background. Why webmasters do this I will never know.

    P.S. 15px is the new 12px. Out to save your eyes one blog at a time!

    • Michiel HeijmansBy Michiel Heijmans on 17 February, 2012

      I totally agree, Bill.

      On your side note: and then list a banner ad on that website. You get my point…

  3. Jono AldersonBy Jono Alderson on 17 February, 2012

    Fantastic! Same thing applies for ‘mega menus’ – how many different choices do you really want to offer the user? 50? 100? Over 200? I don’t think so…

    Obviously this makes sense from an SEO perspective, too – talking about / linking to a few things (well) is better than flooding high volume / now quality…

  4. Steve ScottBy Steve Scott on 17 February, 2012

    Nice post Michiel,

    I’m a big believer in a solid call to action. I love that you showed some examples of sites with too many calls to actions and how it’s easy to get lost or be overwhelmed with the “what do I do”.

    However, I would love to see some samples of sites you DO like with GREAT designs and calls to actions.

    Got any you care to share?

    Steve

  5. Dragan NikolicBy Dragan Nikolic on 17 February, 2012

    I see your point in everything you wrote Michiel.

    I just wanted to put an emphasis on the core of this “not-so-clear call to action” issue -

    1. Client who does not know what she/he wants to achieve with a website.

    Solution: Before you take on new endeavors always be sure to submit an SEO form with key questions about the company so you can learn about their key features and goals.

    2. Lack of editing. CMSs give feeling of being in control and the ease of bloating websites with ever more content.

    Solution: Not everyone can afford an editorial person. Have companies double check with you if they want to put some new stuff on homepage.

    3. Bad communication between a client and an SEO team. This is a major problem for me, although I try to do my best, clients often respond with a phrase ~ We’ve given you access to every account. What else do you want from us?

    Solution: Always ask for one dedicated person within the company you work for to be your liaison.

    4. Unclosed circle of calls to action. This means that there’s a page where visitors just don’t know what to do next and they usually leave at that point.

    Solution: Have call to action on every page, whether in sidebars or within the main content.

    Have I thanked you for the article?

    Thanks :)

    • Michiel HeijmansBy Michiel Heijmans on 17 February, 2012

      Thanks in return for your comment ;)

      I think the bottom line of your point is that customers assume you are this internet guy that will arrange or solve all for them.

      Seems to be a pretty common issue, especially with smaller businesses (IMO). You become this kind of ‘internet lecturer’ for them and they actually rely on you to finish the job for them. And you should, in my opinion. Service is an important extension of the website / SEO. Just make sure you get paid ;)

      Involve the client as much as possible. How many times have you asked a client what his goal for the website is? Hm. So did I. That client probably does not even realize there should be a goal for every page.

  6. Mark MehlBy Mark Mehl on 17 February, 2012

    I agree, the homepage should be uncluttered and offer some direction (clear clicking options). But for SEO purposes, your homepage (which has highest pagerank) also needs to summarize the four most salient reasons why a visitor should visit your website in the first place. I think the jobsite homepage (above) has done that with isolated contrasting boxes, terse headlines, and clear clicking options. The only thing missing is a simple, descriptive (iconic) graphic for each clicking option.

  7. Dragan NikolicBy Dragan Nikolic on 17 February, 2012

    You’re right. Smaller businesses almost always have no clue as to what they want out of their websites, so I guess it’s up to us to tell them based on what their company’s goals are.

    And yes, it takes more time to explain than to implement. Sometimes (often times) I think we’re not paid enough.

    —-
    I guess Yoast never thought there’ll be another author on his website (disabling author archives), so clicking on your “by Michiel Heijmans” get’s me to yoast.com.

    How big is that man’s ego? :)

    • Michiel HeijmansBy Michiel Heijmans on 17 February, 2012

      Nothing like that ;) Check the link below the title of the article for my author page.

  8. Mtn Jim FisherBy Mtn Jim Fisher on 17 February, 2012

    where are your examples of “really good” homepages and call to actions?

    Mtn Jim

    • Michiel HeijmansBy Michiel Heijmans on 17 February, 2012

      Luckily there have been many articles on that, like this one :)

      My point is that it is really easy to create a homepage that is not helping the visitor. I think ‘bad’ examples are telling that tale better than ‘really good’ examples. It is impossible for most websites to come up with a call-to-action as on pages like f.i. the one for Google Chrome, don’t you agree?

  9. Michael BorgerBy Michael Borger on 17 February, 2012

    I struggle with this on my own company website. I’m a real estate investor, not agent, but deal with similar matters. I SEO very well, but am not capturing enough and need to rethink my visitor funnel strategies.

    The Chrome page is genius in its simplicity. However, they have an advantage in that anyone visiting that page likely has one of only two objectives: 1) learn about Chrome, 2) download Chrome. They are not being pushed other Google products that make the visitor think about other options. There is one tunnel for them to walk through. Many business don’t have that luxury because they offer multiple services or product lines (ex. real estate — selling, buying, investing, etc.).

    • Michiel HeijmansBy Michiel Heijmans on 18 February, 2012

      Hi Michael,

      The link to your website is already next to your avatar (your name) anyway ;)

      In general, I think you should focus on one main action per page. That should be the most visible, most appealing call-to-action. Of course you can add others, just make sure they don’t stand out as much as the main one does.

      Jobsite is not doing a terrible job in my opinion, but when you create buttons in different shapes and colors, there is no focus. The will all stand out that way.

      Do you get what I mean?

      • Michael BorgerBy Michael Borger on 18 February, 2012

        Thanks, Michiel. I understand. Simplicity and clear focus. Don’t confuse the visitor. That’s what I love about the Chrome page.

        I suppose on my site, I have 4 choices: 1) make the ‘sell’ CTA the most important, 2) make the ‘buy’ CTA the most important, 3) make the ‘invest’ CTA the most important, or 4) give equal weight to all three CTAs but make them separate from the other possible clicks on the page. Ultimately, this is a business decision and not a web decision.

        • LukasBy Lukas on 18 February, 2012

          … or

          you could have one main banner (including logos, phone numbers, slogans, videos) 25-40% height of view port (like 200-250px).

          Next create 3 equal width columns for each section. Each of them having different background color with soft texture + the same looking CTA’s.

          p.s. the layout could be bit a wider/liquid :) …

  10. 4399By 4399 on 19 February, 2012

    好好看了一遍,有点受益

    • Michiel HeijmansBy Michiel Heijmans on 20 February, 2012

      感谢您的回应

      • Garry DufresneBy Garry Dufresne on 23 February, 2012

        我不明白你在说什么。我不看中国。

  11. James BryantBy James Bryant on 20 February, 2012

    Hi Michiel,

    I think you make some good points. However It’s probably worth considering in each of these cases that while UX ‘mistakes’ might have been made it’s worth remembering that the designers and uxers on these sites are probably under a lot of pressure to promote more than one area of the site from their business. Speaking from experience you can scream until you are blue but sometimes you have to accept you can’t win everything :)

    I think you may have been a little harsh with the Jobsite example, as they are doing many things on that homepage quite well as pointed out by Mark Mehl. It does seem to me they have made the search button the most prominent and it appear on that large blue area to draw your eye – surely users looking for a job would instantly see that over the secondary actions? Although I agree there is still a high amount of contrast on the dark blue buttons meaning they will draw the eye. I’m also surprised you’ve chosen to use a screenshot when they have a display advertising spot on there. This would most likely be a temporary addition and on a rotation from an ad network therefore quite a tough one to predict and not present on all occasions.

    I agree with your observations on Scuolaleonardo there doesn’t seem to be any focus at all and it’s very difficult to nail down any real direction.

    I think Walmart use the accent colour of orange well to highlight the important areas. As you say it is very strange that Walmart have chosen to have the My Cart in bold orange it would probably be best to have it this colour once the user has something in the basket. Given ecommerce sites tend to catalogue a lot of their products on the homepage it seems strange that this is the element that lets the page down.

    I’de welcome your thoughts,

    James.

    • Michiel HeijmansBy Michiel Heijmans on 20 February, 2012

      I totally get your point on UX designers and pressure, James. I just think not all of these items have to be on the front pages of the websites this way…

      On Jobsite: The banner is not alone in the way it is set up. It is unfortunately getting quite common for banners to have the largest call-to-action on a website and in my opinion making money on banners should not be the main goal of a website (in most cases), especially not on the Jobsite website. It may be a ‘lucky’ screenshot for Jobsite, but it is not unique at all. Website owners should very much be aware of that.

      Wallmart: How easy is it to make that cart orange ONCE there is something in it? The article is on homepage call-to-action and in my opinion there’s nothing in the cart at first visit ;)

      Thanks for your response by the way, it’s much appreciated!

      • James BryantBy James Bryant on 20 February, 2012

        That’s a good point, banners are adopting this strategy more and more realising trends seen in web design. I think the banner and ‘Advertise Now’ on Jobsite would be below ‘the fold’ on 1024 x 768 though. So wouldn’t conflict for a large portion of users. Absolutely agree with you sites shouldn’t use prime screen estate for banners – you are never going to win fans that way! :)
        When analysing your own work do you find it best to look at the page as a whole or consider how it looks when rendered at certain resolutions? I always find it a little dangerous looking at page comps from top to bottom.
        Yes if you double check my post you see I make the same point with Wallmart, I can’t understand why they don’t just have it orange once it has something in the basket.
        No problem, hope I’m not too argumentative I find it good to discuss these things – it’s good to get a different point of view! :)

  12. James BryantBy James Bryant on 20 February, 2012

    That’s a good point, banners are adopting this strategy more and more realising trends seen in web design. I think the banner and ‘Advertise Now’ on Jobsite would be below ‘the fold’ on 1024 x 768 though. So wouldn’t conflict for a large portion of users. Absolutely agree with you sites shouldn’t use prime screen estate for banners – you are never going to win fans that way! :)

    When analysing your own work do you find it best to look at the page as a whole or consider how it looks when rendered at certain resolutions? I always find it a little dangerous looking at page comps from top to bottom.

    Yes if you double check my post you see I make the same point with Wallmart, I can’t understand why they don’t just have it orange once it has something in the basket.

    No problem, hope I’m not too argumentative I find it good to discuss these things – it’s good to get a different point of view! :)

  13. Kevin ThomsonBy Kevin Thomson on 20 February, 2012

    Interesting – I recently had a debate with a client, whose site I was developing, concerning the amount of content on the Home Page. My argument is less is better but the client wanted it to be as busy as possible because he though this was the sign of an important website! Personally when I visit a site if I can’t figure out what it’s about or what i’m supposed to do within about three seconds, I click off.

  14. InterHost webhostingBy InterHost webhosting on 20 February, 2012

    Sometimes people just want to promote to many content, i’m not under the impression that more as 1 cta buttons is disturbing, it divides the focus thats true. But if a person is looking to post a job on for example the job site, he will notice the different cta buttons first. as our eyes scroll trough the website one of the buttons will attracts his attention

  15. GayleBy Gayle on 21 February, 2012

    What an awesome article! Its like a web page MAP ;) I love it, thanks!

  16. Austin RuhoffBy Austin Ruhoff on 21 February, 2012

    This is one of my pet peeves – cluttered home pages where it takes me forever to figure out what to do or where to go! I think you make some great points and provide some great advice! Thank you!

  17. malcolm mcewenBy malcolm mcewen on 22 February, 2012

    yes good post but… whilst some of your examples are quite specific in the aim of the web site I’m curious how you would create a decent home page for a site that isn’t specific (my working for free world site w43w.com is a fair example) and similarly what about the search engines? Whilst I am personally oppose to designing pages to suit robots rather than the readers I want to attract I am to a degree forced to first serve the search engine (not that I am particularly good at that)… regards malcolm

    • Michiel HeijmansBy Michiel Heijmans on 22 February, 2012

      No. Serving search engines before visitors is just not right in so many ways. That would mean you care more about Google than your visitors. Search engines are not the only way to get traffic and besides, I think Google acts more and more ‘human’.

      Serve quality content in a logical, appealing way to your visitors AND optimize your pages. Not first this, than that. Do both.

  18. malcolm mcewenBy malcolm mcewen on 22 February, 2012

    I agree with you totally Michiel: CONTENT IS KING! but the advise I often get is to change text, reduce sentence length and include the key word more oft than is required for the content.. WHY? because it is what SEO advisors and YOAST tell me to do… In truth I subscribe to the belief that my content despite being badly SEO will ultimately get more visitors than a far better optimised site with poorer content… we will or at least I will as my site is only one month old and so only getting 20 visitors a day

    • Michiel HeijmansBy Michiel Heijmans on 22 February, 2012

      :) Have you read this article? That is one you should read. Another thing you might want to use to optimize pages is the WordPress SEO plugin from Yoast and check the block on the Edit Pages in WordPress. The optimizing for focus keyword bit, plus the Page Analysis. But we’re getting a bit off topic here.

      If you want in-dept info, you should order a site review ;) Or follow me on Twitter for more links about similar subjects.

  19. Andrew ThomsonBy Andrew Thomson on 22 February, 2012

    This is a similar idea to one that Seth Godin expresses in his book Big Red Fez. Basically he points out as you do that what ever action you want the user to take next should be the most obvious thing on the page. There should really be only one action choice for the user – the one you want them to take. Don’t distract people with unnecessary alternatives.

    • malcolm mcewenBy malcolm mcewen on 22 February, 2012

      perhaps a little off topic but as Andrew points out the ideal thing is one button on a home page; however… one of the the things that bugs me is bounce rate. A good site should be like a good library shelf and take you directly to the thing you want. However search engines don’t like that( at least that’s what I am given to believe). Thus if a site is laid out in such a way that a visitor is taken directly to what they are looking for you get 100% bounce rate whereas if you bury the information and force them one or two pages in your bounce rate goes down and so does your ranking goes up…am I correct here? by the way I linked to my ‘other’ and main site here which effectively falls in this category..

  20. NiallBy Niall on 23 February, 2012

    Great advice! Thanks!

  21. LouiseBy Louise on 23 February, 2012

    It’s normal for a business to have more than one service or product so it can be difficult to decide on a call to action about what should exactly go on the home page. That is why I try to create the internal pages of the site as the main conversion pages.

  22. sahidBy sahid on 23 February, 2012

    Great article. Lots of good stuff in there about web design and strategy. Totally agree about being focused on one CTA.

  23. Theresa WagarBy Theresa Wagar on 23 February, 2012

    As a long time web designer for local businesses, it frustrates me that my clients have such difficulty grasping the need for ONE key Call to action on ANY page, but especially the homepage. Thanks for the encouragement that I’m not crazy . . .LOL

  24. Debajyoti BanerjeeBy Debajyoti Banerjee on 23 February, 2012

    Joost, the logic is excellent and I fully agree with you. And even I faced similar thing for one of my client’s website. The homepage was beautifully crafted, busy looking but loads of links and buttons that might easily confuse users where to click first. After a thorough analysis, we made the homepage damn simple – a semi squeeze page (with only the required benefits and bit brief about the site & difference from others) with just one big call of action button that leads to another page and from there after it’s done, we tactically branch out users to other important pages. The result was amazing. Visitors stay more on site, bounce rate decreased and page views increased. Thank you for your great post.

  25. Paul MatricBy Paul Matric on 25 February, 2012

    Simplicity is the ultimate sophistication….yet so many popular sites still bombard the user with confusion…Nice post

  26. SandiBy Sandi on 26 February, 2012

    Thanks for this Joost. I enjoy your posts. I’ve often wondered why someone developed a plugin to remove your posts from the WP Dashboard! Just dumb. Why would you choose to miss out on such good quality SEO information?

    Anyway that was a bit off topic.

    I too would love to see some examples of sites that you think ARE doing this right. I don’t feel like I’ve got the right methodology and I’d love to find some sites to emulate. Thanks again.

  27. The Business CookbookBy The Business Cookbook on 27 February, 2012

    I often find that what originally is a quite usable design becomes more cluttered as businesses demand the marketing of further ideas and products and try to add these to the existing site layout. The original site design was conceived with particular goals in mind and messages to display. Once additional requirements are added to the mix the original idea becomes cluttered and message diluted. The challenge is to make sure businesses understand the role of the website design and don’t try to put a square peg into a round hole.

  28. Nelson KamdonBy Nelson Kamdon on 29 February, 2012

    Hi Michiel,

    Great Post!

    I remember when I did my very first homepage couple years back… with tons of ads…. hahaha… I only realized that it’s all just clutter when I saw one dotted with ads. It was even on blogspot. LOL!!!

    Anyway… I will always remember this “Uncluttered Homepage with Call to Action”

    Thanks!