Think about all the websites you’ve visited over the years. What was the worst one you’ve ever seen? Was it worse than this Norwegian website? I’m still not entirely sure what it’s for. We’ve all seen terrible websites in our time on the internet. Fortunately, none of those bad websites are our own — or are they? To prevent your website from looking like a pre-school fingerpainting project, check out some examples of what to do and what not to do in website design.
Website design is an ever-evolving art form that puts an emphasis on both function and form. Massive advancements in design have been made over the years. Websites have become more user-friendly and nicer to look at compared to a decade ago, or even a couple of years ago. The landscape is constantly changing, with new trends popping up every year, for better or for worse. Here’s a roundup of some of the worst mistakes and trends we’ve seen in web design recently and the best ways to avoid them.
If one thing reigns supreme in website design, it’s creating a positive user experience. In today’s online world, attention spans are shorter than ever, and people click away from things in an instant. Numerous studies show that a website has about seven to 10 seconds to grab a user’s attention before they move on. Any minor inconvenience will drive visitors away. Once that happens, the likelihood that they’ll ever come back is practically zero. Every company’s number one design goal should be to provide the smoothest, clearest and most user-friendly website experience possible. Here are some of the most important aspects of the user experience.
According to many studies, people consume more than half of their digital media on mobile devices, including most web traffic. Simply put, if your website is not mobile-friendly, it’s not user-friendly. This extends beyond phones to include tablets, electronic book readers, smart TVs, gaming consoles, smartwatches and everything in between. These devices have varying screen sizes, and a user-friendly website should resize properly on each one. Navigation, content and design should be coherent, consistent and clear regardless of size. A website should be instantly recognizable from device to device and size to size. If it’s not, users will be confused and leave.
Navigation can make or break any website. If a user doesn’t know where to go, they’re going to click away. These tips will help make your website easier to read and navigate:
- Text is easy to read, clear, concise and consistent on every page
- Navigation is easy to find
- User knows which page they are on at all times and how they got there
- Navigation is easy to use on mobile devices
- Buttons are large enough to see and press easily
- Footer has a second navigation menu
One of the worst trends to come out of the last few years is scroll-hijacking. Scrolling is the one thing every user should have control of on a website. When a website changes that, whether through horizontal scrolling, different scroll rates or something else, it surprises the user and takes control away from them. Even some high-profile websites like the Apple Airpods Pro page are guilty of this. The entire page is a continuous animation controlled by scrolling. Instead of feeling in control of how you’re receiving the information, the page forces you to scroll through an arduous animation to get all the information on the product. The best websites avoid this and ensure the user has complete control over their navigation.
Web design often neglects accessibility. No website is worth its salt if it’s not fully accessible to anyone who might visit. Your website should be accessible to anyone regardless of their disability, whether it is a visual, auditory, neurological or physical one. Consider adding design that enables screen readers to convey information to their users and navigation anyone can use easily. Avoiding excessive pop-ups and crazy colors helps, too.
Accessible web design has no disadvantages. It doesn’t hurt users without disabilities and only helps those with them, expanding a website’s audience. This makes the experience better for everyone. Web design that isn’t accessible, however, is going to drive away those that can’t use it, cutting off a large portion of the global web audience.
Overloading a website is an easy rabbit hole to fall into. All those fun bells and whistles may sound amazing on their own. Once they’re all added together, however, it can seem tacky at best. At worst, it turns a website user-hostile.
Pop-ups can be useful when done properly. The problem with pop-ups is websites tend to go overboard with them. Too many messages can cover up the content of a site. The last thing any website designer wants to do is make it more difficult for users to get to and absorb their content. It can only take a few pop-ups to push someone away.
The best use of pop-ups is to enable sign-ups, provide contact information or show upcoming events or promotions. It’s best to place pop-ups out of the way of any content and to make it easy for users to close those windows and continue browsing.
Avoid pop-ups that:
- Take over the entire screen
- Don’t provide clear and concise information
- Can’t be easily closed or require an action other than an X button to close
- Pop back up after being closed
The color palette of a website is core to its identity. The colors are the first and most obvious thing any user will see. These can either intrigue a user with complementary colors that are easy to look at or drive them away by assaulting their eyes. Your website should match your branding because consistency is important and leads to brand recognition.
With colors, it’s important to not go overboard. Too many colors will make a website hard to look at which will lead to people clicking away to save their retinas. An example of this is Ling’s Cars. This may be the worst website ever. It breaks just about every rule laid out in this article, save for minimalism, and surprisingly, pop-ups. Along with the many issues of the site, there are so many colors and patterns that it feels more like you’re experiencing a psychedelic hallucination than visiting a car leasing website. Avoid this at all costs.
One of the most popular recent trends, minimalism, has all but taken over web design. Minimalism is a sleek design language that aims to provide information with little to no clutter in a smooth, smart design. Usually, minimalism accomplishes this and provides a simple design. However, it has its fair share of problems, too. The biggest pitfall with minimalism is a lack of information. By trying to be minimalist, some websites leave out so much information that it becomes difficult for the user to understand what the website is about or how to navigate it. In that case, they’ll click away after a few seconds of frustration. Depending on the content of a site, a minimalist approach might not be possible.
As minimalism has become trendier and more websites use the aesthetic, it’s become harder to distinguish some sites from others. Minimalism limits the choices you can make within the framework of the design language. They end up all looking the same. Plenty of websites have a generic minimalist formula of a hero image, a sleek menu design, some bold headlines and colors that stand out but work well together. It wouldn’t take long to find a dozen minimalist websites that look the same.
When designing a website, it’s best to avoid the minimalist design right now. The last thing you want is for your website to look derivative and unoriginal. Still, there’s room to incorporate some minimalist design features here and there. If done tastefully, it could create a beautiful combination of design languages that is both visually pleasing and intriguing, and functional for the user.
Now that you’ve read these tips, look at a few websites, including your own, and make sure you’re not committing any of these website mistakes.