Join 10,000+ marketers getting monthly digital tips and trends.
Why Good UX Matters and Bad UX Can’t Be Ignored
Your website is an essential channel to reach customers and prospects 24 hours a day, seven days a week.
It’s more than just a digital calling card – it also drives sales, captures new leads, and provides customers with valuable information about your products and services.
An effective website embodies your brand and is informative, compelling, and easy to use. It delivers a simple and satisfying user experience (UX) – a concept and design practice that analyzes and aims to improve all aspects of a user’s interaction with a website or digital product.
Conceptually, think of a poor user experience like visiting a restaurant and discovering there are no readily visible hosts, waiters, or menus. You’re hungry and ready to spend lots of money, but you have no idea how to find a table, what foods are available, or who to ask for help! Eventually, you’re going to leave dissatisfied and never return.
Without even knowing it, many businesses have websites, portals, or digital products configured just like this restaurant.
The websites are hard to navigate and find the right products or information; the content is confusing or inadequate; the sites are glitchy or take forever to load; and users can’t easily take action – like buying, subscribing, or donating.
The result of a poor UX is the customer leaving that business website, never to return.
In fact, 32% of customers said they’d stop doing business with a brand they loved after just one bad experience, and 73% said experience influences their purchasing decisions.
Luckily, user experiences can be remedied through a well-coordinated and thoughtful UX design process and audit - focused on analyzing user behavior, improving content hierarchy, and removing pain points, which in turn, will decrease user bleed and high bounce rates.
To help you start your UX journey and improve your customers’ experience, we have created UX 101 – A Comprehensive User Experience Guide.
PT. 1 – What is UX Design and Why is UX Optimization Important?
According to the digital design pros at Adobe, "User Experience Design is the practice of enhancing user satisfaction with a product by refining the usability, convenience, and pleasure provided in contact with the product.”
Just as a company hires an architect or engineer to draft blueprints for a brick-and-mortar business, a UX team audits, designs, architects, and optimizes a website or digital product to improve its usability and drive better business outcomes.
Strategic businesses get UX right - 77% of companies identified the customer experience as an important differentiator for their business. Yet, 80% of people believe customer experience needs to be improved.
That’s not all - bad experiences cost businesses some $4.7 trillion in consumer spending every year globally.
On the flipside, a UX-focused approach to building your website will not only reduce 50% of costs associated with development and rework time, it will also nurture customer loyalty, motivate intent to purchase, and increase revenue. It’s critical to get UX right.
Good UX means more than aesthetics - it’s all about making the experience more intuitive, so the user can engage and interact with ease.
UX design requires analyzing performance data and stepping into users’ shoes to understand opportunities to remove friction and create a better experience.
Here are some of the questions a UX agency or designer will ask to better understand their users’ needs:
Who am I designing for?
What motivations and values are important to the user?
Where are they getting stuck or confused?
How can strategic design add value to the customers’ buying journey?
With these questions answered as a starting point, designers itemize and prioritize areas of the web experience to analyze and improve, following our proven UX best practices below.
Recap: UX vs. CX vs. UI – What Is The Difference?
Before we dive into UX best practices, let’s settle a common misconception that UX is the same thing as Customer Experience (CX) and/or a User Interface (UI).
There’s overlap between each of these terms, but it’s important to know what makes them different.
CX vs UX
CX refers to how customers view their holistic interactions with a company or brand. Did they have a positive experience; would they engage that brand again?
CX is all-encompassing, spanning digital and traditional, in-person experiences. It’s also a moving target – every customer experience leaves a positive or negative impression and can sway customer sentiment.
The term UX was coined in the 90s by Don Norman, the co-founder of the Nielsen Norman Group and previous Vice President of the Advanced Technology Group at Apple. Norman defined UX as all aspects of the end-user’s interaction with the company, its services, and its products.
When using your website or product, could the user find the right content and interact with the website without growing frustrated? That interaction on your website is a user experience.
UI vs UX
A User Interface (UI) is the point of human-computer interaction on a device, webpage, or app. It encompasses interface elements, like buttons, text fields, navigation, search, icons, notifications, containers, etc. – the elements making up a reliable web experience.
“UI is the saddle, the stirrups, and the reins. UX is the feeling you get being able to ride the horse.”
PT. 2 – Common UX Mistakes
Here's four common UX mistakes Whereoware encounters often:
1. Not Starting UX Early Enough
Imagine constructing a house by laying a foundation and building the walls, roof, and floors before consulting an architect to draw up a blueprint. Sounds absurd, but that’s exactly how some companies approach the creation of their website.
There are businesses who will build wireframes, a site, or digital product, only to then contract a UX team to “polish the experience.” This results in both wasted time and money to replace existing work or worse, an experience that fails to address the issues critical to a user’s satisfaction.
2. Not Thinking Like Your User
It’s easy to get distracted by flashy design or hot trends, but ultimately, your website needs to be focused on your user’s point-of-view.
Every design decision must be made with customers at the center, to help them interact and fulfil their goals. That is why it is crucial to collaborate with a UX agency, who can test and give an outsider’s frame of reference to your work.
3. Not Using Data to Guide Decisions
Every design decision must be customer-focused and informed by data.
The beauty of UX research is there is plentiful data to guide the changes that will make the most difference to your customers.
For example: look in Google Analytics to see which pages have the highest bounce rate. If any of these pages are critical to the user journey and buying decision (your services page, for example), then you can dig deeper to understand why your customers are not staying on the page.
Perhaps, you need to increase copy to better convey your value or reorganize the content hierarchy to move important information up.
Or, if you’re seeing high abandoned cart rates, use heat map tools, like Mouseflow, to understand at what point in the cart completion process customers are leaving.
You can then reduce the steps or pages in the cart experience, add more FAQ information or proof points (like testimonials or security seals to put buyers at-ease), or add visual cues to indicate progress through the process.
Then, it’s a matter of executing your changes, measuring the results, and using that data to inform the next UX optimization.
4. Thinking Accessibility Design Doesn’t Matter
It’s estimated that around about 26% of Americans have some kind of disability or difficulty with their mobility, hearing, vision, cognition, or any number of other challenges.
Has your website been optimized to ensure ALL individuals can interact with ease?
A UX team will evaluate your website for accessibility best practices, ensuring text is clear, the design and imagery are intuitive and representative of diverse backgrounds, and using interactive features feels like second nature – just as a starting point.
PT. 3 – Examples of UX Design Best Practices
To counter common UX mistakes, we’ve outlined basic, but important UX guidelines to design and optimize your website.
1. Start with The User
A failure to know your ideal user and how they will experience your product makes it impossible to design their most optimal experience.
Above all else, it should be your goal to create the most intuitive path to guide users to the content or products they’re seeking, answer questions, and help them make decisions and take action.
Think of your UX like a theme park ride. If there are needless stops, missing pieces of the track, or routine breakdowns in the path from beginning to end, fewer people are going to continue getting back in line.
Take time to understand your audience makeup and typical buying or browsing patterns.
Data points like visitor demographics, device preferences, website activity, and purchasing patterns present clues for the best ways to hone online user journeys.
Pay attention (I.E. track and measure) to how they're interacting with your site and where they're bouncing (giving up and leaving the site). Focus particular attention to conversion points and optimize those key pages and interactions first.
2. Embrace White Space
In the Wild West days of the early internet, it was not uncommon to find websites with busy layouts, cluttered backgrounds, and flashy design templates that worked overtime to rid the webpage of its whitespace.
Flash is not the focus; think clarity, usability, and substance.
To guide visitors through your site in a way that feels intuitive and organic, utilize negative space, or white space. White space helps focus user attention on what matters – important information, visual cues, and buttons – to guide their exploration of your website. This includes margins, padding, and gutters, as well as line spacing, and letter spacing within text and around graphics and images.
White space is particularly important for mobile experiences, where clutter and competing elements make it impossible for users to interact.
3. Visual Hierarchy is a Must
Humans are visual creatures, constantly seeking comfort in patterns and context clues.
A focused visual hierarchy acts as a compilation of cues by combining size, color, contrast, shape, positioning, and arrangement to suggest to users how to navigate, interact, and consume your website.
Purposeful site organization and consistent design elements guides users to take action or explore the website as you intended.
Here are several fundamental techniques in establishing an intuitive visual hierarchy:
Scale and Size - the larger an element or font, the more attention it receives.
Color and Contrast - our eyes are naturally drawn to bright and bold colors, however, stark contrast achieves the same goal. Color contrast helps users quickly identify actionable elements and important information.
White Space - place emphasis on target areas and elements, and improves comprehension.
Scanning Patterns - placement of important elements should align with user's natural eye path.
4. Create Effective Webforms
Webforms are key to lead generation and a critical point in the customer journey.
Whether you’re trying to increase account registration signups, demo requests, or newsletter list size, lead gen webforms must be discoverable, efficient, and low effort.
We’ve highlighted webform best practices below:
Streamlined Webform Length - Only request need-to-have information to shorten the length of your form.
Visual Indicators - Use visual indicators, like asterisks, to specify what fields are required.
Error Messaging - Add error messaging, so users can correct data they put in incorrectly. For example, if you only accept business email addresses and a user inputs a Gmail address, a visual message should appear telling the user how to correct the input.
Webform Containers - Make sure the size of your webform container is proportional to the expected length of user input.
Webform Icons - Help users quickly understand the meaning of a field or a required action. In the example below, the “eye” icon allows users to see or hide what they typed.
Webform Label, Placeholder, and Helper Text - A short and descriptive label text is key to informing viewers what information is requested for a text field at-a-glance. In our example, below, "Phone number” is the webform label text.
Similarly, Placeholder text is what users see in the field before inputting their own information. This is typically lighter in color than the field labels and helps users with formatting requirements or to clarify any confusion. Below, the phone number placeholder text displays the format to input the phone number.
Helper text is another assistive element that provides additional information about an input field. Here, “Enter your local phone number” is helper text, guiding the user to fulfil requirements.
5. Be Consistent with Brand Guidelines
A business’ website is their brand story and it should be told in a coherent voice, dependable tone, and consistent aesthetic.
That is why we urge businesses to establish a brand guide or design system.
Whether it's fonts, colors, button styles, graphics, spacing, or heading sizes, it’s best practice to establish uniformity with a consistent approach to design.
These pre-written rules serve as building blocks for smooth, visually pleasing experiences, and enable internal team members and external vendors to easily jump into a project and maintain your brand expectations, without effort.
Harmonize interactions across your site with clear navigation and consistent design, so the user journey is understandable, predictable, and persistent. By doing this, you reduce opportunities for frustration, enhance ease-of-use, and increase the likelihood of visitors engaging longer and more frequently.
Remember - being consistent does not mean boring.
Visitors decide within seconds to stay, or abandon your site for an alternative, based on design, functionality, and overall experience.
In fact, Adobe found that customers who have an unpleasant experience on your site are 88% less likely to return to your website.
Brand guidelines create consistency and scalability to save time, smoothen the designer / developer handoff, and ensure you’re always delivering an excellent, on-brand user experience.
Whereoware Can Improve your UX.
The irony of good UX is that it might seem invisible to many of your online visitors, while bad UX is impossible to ignore.
Good UX is good business and the investment pays off in spades – across customer loyalty, customer acquisition, brand awareness, and sales.
“We’re not specific to just one industry and there’s no canned answer for everyone,” says Tim Frost, Creative Director at Whereoware.
Frost adds: “Sometimes business goals don’t always align with the way the user searches the website, piece of content, or whatever interaction we’re trying to help make more streamlined. That's why we cement our decisions in data and help our clients understand the user's perspective.”
Through user and stakeholder research, data analysis, UX design, and digital optimization strategies, Whereoware helps businesses achieve their goals through compelling and impactful user experiences.
Are you ready to start the UX Journey for your business?
Do you want to reduce pain points and align the goals of your company with the goals of your users?
Contact us to enhance the way you connect with your users.
2-in-1 Download: Website Must Have's and Google Page Experience Checklist
2-in-1 Download: Website Must Have's and Google Page Experience Checklist