Design is the practice of creating a non-random effect on human behavior. In order to solve a problem, designers seek to influence the thoughts, emotions, and actions of users.
Once one designer solves a problem successfully, their peers tend to follow suit. This imitation game is not purely motivated by laziness. Good designers understand that capitalizing on well-known aspects of user design can lower the cognitive load on their users. Thus a trend is born. The problem is, not all popular design is a good design.
The hamburger menu is a classic example of a widely adopted practice that boils down to poor design. The three horizontal lines were born as a way for mobile sites to save room on small screens, allowing users to access and hide the site’s menu. The problem is that many designers implemented the hamburger on websites on desktop sites too — it became an acceptable cop-out for menu bar design. However, not every user is familiar with this symbol, and it can lead to confusion and frustration.
We compiled a list of our favorite website user experience best practices. The aim to help UX/UI designers capitalize on the successes and failures of other digital platforms.
Use this list as a jumping off point — but don’t take our word for it, conduct your own user testing and discover what works for your users.
Dive Deeper: Think Your Product is Great? Your User Journey Map Says Otherwise
How to Recognize and Create Good Design
All this talk about user experience best practices might leave you asking — what constitutes good design anyways?
Excellent question.
Good design should communicate three core messages. While this principle is true of any product, it is especially applicable to designing website user experience.
Question #1: What is it?
Aesthetically pleasing visuals are only one part of the user experience. No matter how artful a website is, if the user does not understand its purpose, the design fails.
Question #2: How does it benefit me?
Humans are wired to be selfish. In a world bombarded with messages, we learn to attune ourselves to the ones that matter to us and ignore the rest. Research your target audience. Find out what is important to them and communicate how your service or product will help them reach their goals.
Question #3: What should I do next?
Without continued action, your design remains stagnant. Communicate to your user what the next step is and how to get there (i.e. scroll down to read more, check our testimonials or sign up for a free trial now).
The Anatomy of a Header
A header is the first thing a person sees when they land on your website. Naturally, it should be inviting. In addition, a good header must answer the above questions of good design as well as: communicate the brand feel as well as core information about the product… within seconds.
Different experiments collecting data on user eye-tracking have shown that there are several common models that account for user eye movement. In this article, the three name models are mentioned and discussed: Gutenberg Diagram, Z-Pattern, And F-Pattern. These models allow website user experience designers to create a visual map for their users’ action. This best practice capitalizes on the user’s initial attention and leads him or her to the next relevant section of the website.
Let’s Talk About Scrolling
Your user will continue to scroll as long as: 1. It is clearly indicated the direction they are expected to scroll. 2. The content continues to add value to their search.
Top-to-bottom scrolling is generally considered a website user experience best practice. A running website can be beneficial as it allows users to navigate without clicking, just don’t let it get too long. Try to establish a visual pattern or rhythm that will help the user know when to continue further down.
Discover how to boost your user’s experience with WalkMe. Request a demo.
The Case for Contrast
Whether you are designing a header or a call to action (CTA), don’t be afraid of employing high contrast elements to draw users’ attention. This can and should be done by juxtaposing color, light, shapes or patterns. One of the worst mistakes of website user experience is to lose a potential lead simply because they didn’t notice the sign-up or subscribe button.
While color is a critical tool for conversion, always design in a pallet that works in both color and gray-scale. You never know who might be browsing colorblind.
The Single Column Layout
Negative space is a helpful tool for directing attention. When designing a website, it is critical to channel users’ attention to drive desired action. A multiple column layout raises the chances a user may get distracted, or worse, overwhelmed. Sticking to one central column with empty “margins,” keep the ball in your court, so to speak. It also directs your users along a linear narrative from top to bottom.
The Power of a Personalized Narrative
Remember that website you visited that had nothing particularly special or enticing about it? No, you probably do not. The website user experience best practice we can’t recommend enough: Give your site some personality. Your website is the face of your business. Dress it down, dress it up — add some animations, videos, pictures — just make sure your design is making a lasting impression.
Try to avoid stock images. They are cheesy, redundant and over-used. Of course, sometimes it cannot be avoided due to lack of time, resources, and material. If your budget allows, use custom-made images and illustrations. Images of people are especially salient in attracting the user’s eye. Showing people using your product gives browsers a point of identification.
Form Fields: Less is More
The sight of long-form fields implies effort, and this might cause your users to call quits early. Avoid this scenario by minimizing necessary fields. Ask yourself if each field is really necessary and remove any that are not. If you have numerous fields, consider moving them after form submission on a separate page or state.
Loading Time (Reality vs. Perception)
There is no website user experience faux pas that will exasperate your users quite as quickly as waiting for a content to load. However, an important side note to this statement: The perception of loading time is within the designer’s control.
Perception of website speed is based on several cues: actual load time, load behavior, waiting times and animations. What matters is that the website feels fast, even if it is not. One user experience best practices is to load text before images so that users can start reading while the rest of the site is on its way. Additionally, ensure loading animations are well placed and running smoothly to give your user a sense of control.
What is better than telling your prospective customers how incredible your product is? Allowing actual, real-life customer to rave on your behalf. Good website user experience immerses browsers in your brand — what people are saying about you in an important facet of the total experience. Plus, hearing another endorse your product makes you seem more trustworthy.
Everybody Loves Gifts
Instead of just a plain old CTA urging browsers to “sign up,” or “buy now,” offer a small freebie to sweeten the deal. Besides generosity points, this tactic draws on an important principle of human psychology known as the principle of reciprocity. This basic law of social psychology states that humans tend to feel an obliged to repay back favors received from others. Offering some small gift (i.e. first month on us or free consultation) raises the likelihood of conversion to paid.
