Design your website to survive the landing page blink test


Published on

Here you can find tools and the steps to take to make sure that your landing page converts and retains as many people as possible. Online shopping and SaaS businesses need to optimize their landing pages or they stand to lose users forever.

  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Design your website to survive the landing page blink test

  1. 1. Survive the Landing Page Blink Test Don’t lose users in the first 0.5 seconds!
  2. 2. an epic slideshare brought to you by
  3. 3. “There can be as much value in the blink of an eye as in months of rational analysis.” ― Malcolm Gladwell, Blink: The Power of Thinking without Thinking
  4. 4. Top 20 internet users by country: 1. China 2. USA 3. India 4. Japan 5. Brazil 6. Russia 7. Germany 8. Indonesia 9. UK 10. France 11. Nigeria 12. Mexico 13. Iran 14. Korea 15. Turkey 16. Italy 17. Phillippines 18. Spain 19. Vietnam 20. Egypt The world total… 2,405,518,376 users
  5. 5. Image credit
  6. 6. For entrepreneurs, this means a huge market of technologically capable people in a geographically borderless market. And plenty of solutions, tools and gimmicks to offer them.
  7. 7. This also means that what makes the biggest impact on your potential users will be the first thing they see on your website. So, how fast do people make up their minds about what they see online?
  8. 8. 0.5 seconds (study conducted at Carleton University Canada, 2006)
  9. 9. Sucks to be you, Web Designer!
  10. 10. Add to that, the number of new websites created every year… In 2012 alone, that was 51 million.
  11. 11. I’m too old for this sh!% Image credit
  12. 12. But never fear, there is hope! A follow-up study by University of Basel in Switzerland in 2012 proved this about website design:
  13. 13. Step 1: Use a Template
  14. 14. Why use a template instead of building my own site? Resources for themes: Themeforest Template Monster Themetrust • Faster • Cheaper • Code is clean (pay for your template from a reputable site!!!) • Customizable (usually – or just ask the creator to pop in a feature) • Already been tested for user optimization • You can choose one that is cross-browser and crossdevice capable from the getgo
  15. 15. Alternatively… if you know a website you want to “borrow”… Right click > “View source” and check the links for the CSS or JS to see if it’s WordPress, Joomla etc. and what the theme name is. Then search for it on Google.
  16. 16. Pro tip: see what others in your industry are doing and take the best features from them. You’ll need to research them in any case to get the “prototypical” aspects correct.
  17. 17. It may be tempting to go for an eyecatching and unique design at the start…
  18. 18. Image credit …but if your brand is very new, it will drive people away
  19. 19. Rule of thumb: keep it simple, clean and clear until you have gained a loyal user base
  20. 20. Check out the hard facts on this infographic by Calvin Sellers: Human Visual Processing – Why understanding it is Crucial for Web Design
  21. 21. Step 2: User Testing
  22. 22. a) The Coffeeshop Test Get out on the street with your laptop and smartphone, and ask people to tell you what they think. Image credit Make sure to charge your devices fully before starting!
  23. 23. b) Heatmapping and metrics Choose from a range of tools: -CrazyEgg -Clicktale -Mouseflow -Google InPage Analytics -Mixpanel
  24. 24. Conversion and retention combined are the Holy Grail With all of the information interpreted from mapping and analytics, from coffeeshops to templates, you will be able to refine your website to optimal user retention and higher conversion rates. Good luck!
  25. 25. Hopefully you will end up with a pretty website like Squarespace…
  26. 26. …and not this eyesore!
  27. 27. Find the original article that inspired this Slideshare on The Next Web: “Don’t lose users for eternity in the first five seconds: how to survive the blink test”
  28. 28. Got questions? Click on an icon!