In Small Ditch Studio, our guidance for selling online are based on these 3 areas:
(1) Good website
(2) Pull more traffic
(3) Increase conversion rate
Many marketers focus more in pulling the traffic by harp on the importance of SEO, social media, facebook ads, yet having an excellent website design to start with is so often overlooked. While all of these components do matter, your web design isn’t just a “pretty face”, it can actually make or break your conversion rates.
Whether or not your website is aesthetically pleasing also plays a big role in conversion rate optimization. Given 15 minutes to consume content, two-thirds of people would rather read something beautifully designed than something plain. So if you want people to read your blog posts, they need to look attractive.
But that’s not all. If your website is unattractive, people will actually leave your site altogether. So regardless of whether or not design is your forte, you can’t afford to overlook it. Learn web design, hire a freelancer, employ a designer, or do whatever it takes!
Here’s how to go about designing a home page that converts.
People expect to see your logo in the top left corner. Clicking on the logo takes you to the home page from every internal page. Don’t mess with it. You can get a designer to design your logo or simply choose the text logos.
People are used to 2 kinds of menus: horizontal and vertical. Don’t innovate here – familiar layouts work best. Some more, they are the output of real proven research.
Remember people spend most of their time on OTHER websites. People don’t need to see a menu to know where the ‘contact’ link is at – by default they look for it as the last link in a horizontal menu or the bottom link in a vertical one. Ensure they find it there.
Check Papypal navigation below. Everything is common and all is clear, right? No surprises here.
This is the most important part of your home page. Your Value Proposition is a concise chunk of text (headline, sub-headline and and maybe a few bullets points) that should address these questions:
What is this site about?
What can I do here?
How is it useful to me?
Why should I buy from you instead of the competition?
People’s attention span and patience are extremely limited. The world suffers from attention-deficit disorder. If they don’t get the answers from your home page within seconds, they will leave. Nobody will TRY to understand what you’re about nor read long pages of text. If you haven’t captivated them on your home page, you’ve lost them.
There are several ways to craft and present your Value Proposition. Kid.io has a good Value Proposition:
Bold headline – stating what it is and who is it for
A specific, benefit-oriented paragraph underneath describing the service
Big visual to support the text
This is an interesting part. Quick questions to ask you.How tall are you? How much do you weight? Where do you normally walk (to office, always ride a bike, etc)?
This is why you have to state who your product or service is for, and it has to be true. If you’re trying to sell to everybody, you will lose (unless you have a gazillion dollars to spend). Talking to everybody in your copy works for almost nobody.
Look at the below example of Shopify website. They have included the target group in their Value Proposition. There’s no doubt who this service is designed for, is there?
Remember paradox of choice: the more choice you give somebody, the easier it is to choose nothing. Choice paralyzes. If you think people will invest time to figure out where to click next, think again.
Thinking is hard, and you should not make your customers think. Instead, clearly indicate the next action you want them to take. In one experiment they changed the home page to focus on a single action, and saw the users doing exactly what they wanted them to do. It works.
Speaking of the customer choice, you might like to apply the Hick’s Law.
In other words, by increasing the number of choices, the decision time is also increased.
One famous study by the psychologists described a display table with 24 varieties of jam attracted less interest than a table displaying only six varieties of jam. In fact, people who saw the larger display were only one-tenth as likely to buy as people who saw the small display!
That is an example of Hick’s Law in action: action is lost in proportion to the number of choices being presented.
In terms of web design, you can boost conversions by limiting the number of choices users have. The first thing that comes to mind when thinking about where to cut back on the number of choices on your website is the navigation bar. Obviously, you don’t want to have too many links to choose from, otherwise the user will lose interest in them altogether.
Think about all the many different important decisions that users have to make on your website, aside from just which navigation link to press.
Here are just a few:
Deciding whether to use the navigation bar or scroll down the page more
Skimming the headlines to see which blog post to read
Deciding whether to download your lead magnet, share your post on social media, or leave a comment
Choosing between making a purchase, reading product reviews, or browsing for more products
These only just scratch the surface of the plethora of decisions that your users have to make. It’s normal to feel overwhelmed trying to figure out where to begin cutting back on these decisions.
The more you can limit your user’s choices, the easier your website will be to use, and your conversions will skyrocket.
Call to action wording matters a lot. For example, there is a case study where a wording containing the word buy converted the best. In e-commerce, add to cart always kicks buy now‘s butt.
In one split test they changed Buy SMS Credits to View SMS prices, and saw an uplift in conversions. This change along with minor added trust elements resulted in overall conversion rate improvement of 37.6%.
In another test they achieved a 83.4% improvement after changing the wording of their button from Play right now! to Instant demo!. Test your call to action.
Dollar Shave Club is one good example for a perfect Call To Action. The Get Started button, really help to increase the conversion rate.
Copywriting is super important and a huge topic on it’s own. Here’s one tip.
Most people on your website know what they are looking for in a product or service. If they find something that looks similar to what they want, they will follow it (read more, buy etc).
When one looking for slimming product, that are non-chemicals, 100% organic, save and effective, those become the keywords and should be in the copy.
Above the fold is the part of a page that’s visible without scrolling. People do scroll and are not afraid of it, but make sure the most important elements are visible without scrolling:
Call to action.
Ideally the part above the fold answers the most important questions the visitor has, and the rest is supplemental reading.
How long the part below the fold should be largely depends on your business. but research has proven that when a long homepage get shrunk, the conversion rate tripled.
Ignoring search engines is not wise. As I mentioned it the beginning, your home page has the best chance among all the pages on your site to rank high in search engines.
This, however, won’t happen unless there is substantial amount of text on the page (500+ words). Use the room below the fold also for SEO – write useful stuff about your products, services and address questions your users have, but make sure the text is optimized.
Thousand words and all that. Neuroscience tells us that people “get” images hundreds of times faster than from text (our reptile brain doesn’t even know how to read).
Using images is actually a powerful way to boost up any value proposition. Imagine this website without the large image:
While for a complex products, video is a great way to visual, because watching a 1:30 minute video is less hassle for the user than reading a whole bunch of text
The Rule of Thirds is a popular photography principle that can also be applied to web design. With the Rule of Thirds, you’re supposed to visually divide an image (or website page) into thirds (both vertically and horizontally).
This gives you nine equal squares:
According to the rule, the four middle intersections are strategic places of interest. When objects are placed at these points, it creates the most impactful image or design.
In terms of web design, you can place the page’s most important elements at these intersections to get people focused on them, boosting your conversions.
Below is one of the example:
Notice how this website place their navigation bar anywhere near the intersections. This helps to keep visitors focused on the main call to action on the page, rather than leading their eye to navigate somewhere else.
You needn’t design your entire website strictly by the rule of thirds, rather you can use it as a tool to help you place your most important elements.
Try taking a screenshot of your website (just above the fold or just your header section, not the entire length of the page because nobody looks at a website that way), and divide it up into nine equal squares. Then, you can decide if you want to make any tweaks.
Colour is an often underrated aspect of web design but it can play a very important role in usability as well as convey the overall meaning of a brand as well as the overall mood of the website. Different colour combinations can evoke different emotions and reactions.
When choosing a color scheme for your website, make sure to choose a combination that evokes the emotion that you want your brand to convey.
One practical way to do this is by using the curating a Pinterest board with images that reflect your vision for your brand. Then you can upload a few of those images to Adobe’s Color Wheel using the camera icon on the upper right-hand corner of the screen.
Once the image uploads, it will automatically create a color scheme for you based on the colors in the photo. You can also move the selections around if you want to tweak the individual colors.
Once you’ve created your color scheme, there is one important thing to keep in mind which will make or break your conversions: Contrast
Use contrast to keep text, headlines, and call to action buttons noticeable and readable. In other words, your font and button colors should be in high contrast with the background (e.g. white background with black text), and the elements that you want to highlight (e.g. subscribe buttons) should be in a color that stands out from the rest of your site.
So if we were to use the color scheme we created above, we would want to make shades of blue the predominant color, and use the bright yellow sparingly as a call to action color (since it provides the most contrast).
Let’s look at below website for example. Which elements draw your eye?
You’ve probably heard the Keep it Simple, Stupid mantra before. Well, it applies to web design as well.
Remember Hick’s Law? That comes into play here, but simplicity is more than just limiting the options. It’s about creating a clean overall design that is uncluttered and minimizes distractions.
Similar to Hick’s Law is the fact that people can only handle so much information at one time. Visually, if we see too much stuff all crammed into one page, we get overwhelmed and it bothers us. Creating a great user experience on your website means getting rid of anything that isn’t absolutely necessary to the design.
The general rule of thumb is that you have a mere 8 seconds to get a visitor’s attention, because that is the length of the human attention span. (Yes, it’s shorter than the attention span of a goldfish!)
You only have a very tiny window of opportunity to engage a user when they first land on your site, so make those seconds count!
Here are some tips for grabbing attention and boosting conversions within the first 8 seconds:
Use a large, benefit-driven headline that is brief and to the point.
Use eye-catching imagery that conveys the main point or purpose of your page and draws the eye towards your main call to action.
Make signup buttons large, simple and clear.
Use power words to make your copy more enticing and engaging.
Incorporate multimedia such as video, audio, or other interactive content.
Use hover effects on your buttons (e.g. make them change color on mouse-over) to make them more satisfying to click.
Use animated exit-popups to re-engage visitors who lost interest.
People love human faces. When people see a face, they are automatically triggered to feel something or to empathize with that person. If one user recognize content on a website — such as a problem, dilemma, habit or whatever else — he or she feel connected and understood.
Make sure to incorporate faces into your articles, case studies and testimonials, opt-in pages, and landing pages for a boost in your conversions.
If you are the face of your brand, this is simple to do. Get a photoshoot done, and make sure the photographer takes plenty of horizontal shots with negative space on one side of you. That way, you’ll be able to place a call to action, or some text there.
However, if you aren’t the face of your brand, you can still use faces on your website by hiring models, or using stock photos. Just make sure the faces you choose represent your brand accurately, so that the user will be able to relate to the face.
If there’s one thing that can really drag down the quality of a blog post or piece of content, it’s low quality images.
Specifically, you should avoid using lifeless stock photos that are irrelevant and bland. Research also prove that if your content includes compelling images, you’ll get an average of 94% more views!
So instead of using bland images, source high quality photos that develop positive associations with the content and that feel personal. Remember: people like brands that they feel are similar to themselves. If your imagery is too “stuffy” or “corporate”, you’ll turn your visitors away.
People don’t buy from you if they don’t trust you. In addition to showing off your contact information and it’s a good idea to prepare the term and policy.
It turns out that people are incredibly impatient, particularly when it comes to surfing the web.
Speed really matters. Slow sites cause frustration and make people leave, thus obviously hurting conversions. Speeding up sites increases conversions. Google knows it and has included site speed as one of the ranking factors.
Google’s own nifty Page Speed Online tool is terrific for providing you insights into your site speed and what you can do to make it faster. If you use Google Analytics, their Site Speed report will help you learn which of your pages are under performing, so you can address this potential barrier to your conversions.
Google PageSpeed Insights