Complete Website Best Practice Guide for 2021

Website design graphic

Complete Website Best Practice Guide for 2021

Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on email
Email

You’ve decided to create or update your web page, great! A fresh new website can be an excellent method to engage with customers and fans. Now you’re trying to figure out what website best practices will get you the most clicks and views.

A lot has changed in website design over the years. Users have gone from primarily desktop and laptop access to mobile searching. Users now expect particular looks, feels, and interactions from their website experience.

Gone are the days when you could use a wall of text as long as it had amazing details. Now you have to use multiple different media and break up the text. You need to entertain the user so that they can consume your information quickly and not get bored.

Here are the website best practices that can help ensure that people come to your site, stay there, and come back again regularly.

Table of Contents

Maximize Your Design

A recent study says that you only have about eight seconds to convince people to stay on your page. That’s not much time. It’s not even enough time to read your content. You have to create a design that catches the user’s attention and makes them want to see more from you. 

The design has to be interesting, but not too loud. It has to draw in the viewer without scaring users off or annoying customers. You have to grab the user with easy-to-digest content that makes them want to see more. 

There are many different design features you can employ to get people to interact with your site. These include cleaning up your user interaction and user experience (UI/UX) and offering easy-to-read content so that the user feels comfortable on your site.

Silbar Security website mockup
Shown is client Silbar Security. silbarsecurityfranchise.com

 

Design Around Your Brand 

When you pick your template, color scheme, and style, you want to pick something that works with your company’s ideal. You have a brand that you are trying to promote and sell, and your site should show it off. 

Some company’s designs show off their modern high-tech feel. To do this, they use metallic colors, minimalism, and sleek themes. If you’re trying to make a warmer, more family-friendly feel, bright colors, fun images, and a softer tone can convey that. 

Contrast is Critical

Have you ever really needed information off of a site that had insufficient contrast? It can make the experience less than pleasant. They tried using a colored background and text that didn’t work well together, and now you can’t read it. Even after highlighting it, you still can’t make it out. 

You never want to make your users work that hard to read your information. Make sure that when you pick your design, it offers a high contrast that makes it easy to read. If a user can’t pull out your information quickly, they may move on.

Visual problems like color blindness can compound contrast. Test your design with multiple people to ensure the most people can read it. Want to test your current website for its Accessibility? Utilize Google Chrome’s Lighthouse tool in Chrome to run an Accessibility test and more.

Font

Using a stylized font can be useful for specific items. They can help add texture to a website’s narrative. However, for the most part, people want a font that they are familiar with and can easily read and take in. 

Even once you have picked readable fonts, try to limit how many different ones you use. Too many fonts can be jarring, and it can also slow down your website. We recommend no more than two to three fonts on an entire website.

UI/UX – User Interface/User Experience

When you are developing your UI/UX, you want to help your users find what they need using minimal effort. It also helps if you minimize the chances for mistakes. You want to point out useful information by drawing focus to it.

Even though you have specific paths you want the user to access, you also want to make them feel like they are in full control. You can do this by giving them options to go back, jump forward, and make their own path.

Set up a step-by-step method, but let users customize it to feel right for them. 

Try to make the interaction and experience smooth and easy. Test multiple methods with different people to see what works the best for most users. You want to make visiting your site intuitive and simple for as many people as possible. 

 

Website Speed 

Speed is a significant thing on websites. That eight seconds the user gives you drops down to only about under three seconds for slow load speed. A blank page makes users anxious, and often they will leave the site if it doesn’t load quickly enough. Fast load speeds are crucial for website best practices.

You want to maximize your speed to help keep users on your site. There are many ways you can do this, including fixing your images, using website caching, and adding compression. You can also keep tabs on your load speeds with speed tests for both desktop and mobile performance scores.

Speed Test 

Performing a speed test is the best way to gauge how quickly your site loads. Many places test your site’s speed online. One of our favorite tools is Google’s PageSpeed Insight. Knowing your site’s speed scores can help you adjust your page and get better results.  

Proper Image Use 

There are a lot of ways you can use images well on your site. Images help convey your message and tell a story to the reader well beyond what text can provide. You’ll want to make sure that they are the right size as unneeded larger images slow down your site.

You want to make sure you use the right format as well. JPEGs can be big files. They are great for photos, but graphs and simple cartoons don’t need that much detail. You can make them load faster if you use PNGs when you can. Many image compression plugins will also automatically optimize your images for web-friendly formats like WebP.

There are also programs out there that compress all your images. Compression can help you keep large image files but still have decent website speed. A free and easy-to-use tool we love is TinyPNG, which will compress both JPGs and PNGs to smaller sizes automatically.

Caching

You can allow users to load cached pages without having to send database requests each time. It will only have to load new if there is an update to the site. 

Caching can save some users time by not having to reload the page on each visit. It can help make the whole webpage load faster. Caching can get complicated very quickly so it’s always best to start with a quality website host and a clear website plan. Our favorite website host we use for clients is FlyWheel which includes Fastly caching and CDN from the start.

Use Less Plugins

One of the reasons Content Management Systems like WordPress, Shopify, and others are so popular is because of their flexibility of available tools but this can also create issues for new users building on those platforms. Multiple plugins or apps can slow down your load time, and often new users will try to solve many solutions with multiple plugins but this is not a good strategy. You want to make sure that every plugin you use has a purpose, which adds to the user experience. And remembering that premium builder-specific plugins can often perform the same job that several free plugins would have to perform. Remember when it comes to plugins, less is more.

Minimizing plugins can help speed up your website, and it can get rid of useless extras on your site that may distract from your goal. And when it comes time for maintenance on your website you’ll have less risk for compatibility issues and errors from updating plugins.

Even then you can still run into issues, which is why Bluehour manages hundreds of our client’s websites each month to ensure you don’t ever have to worry about this and can focus on your business instead. Take a look at our WordPress Care Plans to learn more.

Engage Your Audience 

When you are making your site, many decisions will come down to what audience you are trying to appeal to the most. You want your target audience to enjoy the site and their experience. There are some things you can do to help them engage with your site.

Consumable content, micro-interactions, and calls to action (CTAs) are great ways to ensure that your website users feel like they are taking an active part in your site. 

Break Up Walls of Text 

There was a time when you could write text walls, and no one would mind, especially if you had a lot of good content. 

However, now, most people won’t even read your content if they feel there is too much of it or if it appears too dense. 

To fix this problem, break up your text by having smaller paragraphs, images, and other media. It also helps to highlight important points so users can scan them. 

If you must have large walls of text, it helps to offer an abstract or too long didn’t read section (TLDR) that condenses the topic so the user can quickly decide if they want to read on.  

Micro-Interactions

Miro-Interactions are quick and easy ways to interact with your users. They can keep the user engaged, and they can help them make decisions, answer questions, and gather information. 

To make a useful micro-interaction, you have to have a trigger. It can be from the site or based on user actions. You have to explain the interaction. Whether it’s swiping, long pressing, data inputs, or buttons, it lets the user know how to do it and what happens when they do. 

Interactions also need to offer feedback. They have to gain useful info or access due to the exchange. When your micro-interaction does these things, it can help keep your users engaged with the site and enjoy their experience. 

CTAs

A call to action is an essential part of many sites. You want to attempt to make it fun and easy for your users. One of the best ways is to add a button to your CTA. With a simple click, you can move the user into a funnel that allows them to complete whatever task you want them to. 

Using information you already have about the user in your CTA can be helpful, but don’t go over the top with it. If they have already provided their name or location or you have this information available, it can be useful to add that to your call of action. For example, if someone accesses your website from a certain area you can display their location name in your CTA by knowing their IP address, such as “Locations available in Denver!” could display if they access your website from Denver, or “Locations available in Phoenix!” if they access from Phoenix.

Bubba Hutchison mockup

You want to test out your CTA and make sure that it works on the highest percentage of users. Try a few different styles and get user feedback. The best way to get feedback is through regular A/B testing.

Getting your CTA to stand out can also help. You want users to identify your CTA and jump right to it when they are ready to continue. Making it a focal point of the page can gain the desired effect. 

A helpful CTA will convert clicks and browsing into useful and quantifiable results. Finding the best way to display your CTA will help you get the most out of your site.

Analytics 

Learning from your users is very important. Seeing how they interact with your site will help teach you what is working and failing. Using all available data is a helpful and free way to learn about your users. 

You also want to make it easy for users to leave feedback and contact you about problems and glitches. Feedback is an excellent way for you to learn what users feel about your page. 

You can use your analytics to help maximize conversions. Knowing how people tend to use your website can allow you to help them get to that point.  

SEO Optimized Pages 

You could have the most outstanding content ever made, and if no one sees it, your site could still fail. Optimizing your page for search engines is essential to ensure that your content is visited. If you fall below the top page on a web search in your category, you will lose out on users. 

You can do things with your webpage to secure higher spots in searches. Many of these things help make your page better overall, including increasing page speed and formatting properly. 

You will also want to consider meta tags, helpful links, and proper image use. Using all these will help you have SEO-optimized pages that get as many clicks as possible. There is no quick win though when it comes to SEO and every business should approach this differently. If you’re new to all of this our team of experts can help get you on the right path whether you’re a small local business or a large national business. Check out our SEO materials to learn more.

Title Tags 

Title tags are the information that shows up on the first line of a search engine result. Having a title that explains your page can help get your page listed higher on the search page. You can edit these title tags and make sure they give pertinent information that can help users. 

You get 40-60 characters to make the title tag, so you have to keep it simple but explain the page’s point. 

Meta Descriptions 

Meta descriptions are the snippets underneath the title tag. They can give users extra information about your page. People use these to decide if they want to view your site. You want to provide the user with helpful information that tells them what to expect on the page. 

You get about 155 characters on these descriptions, so use them wisely. Don’t fill them up with keywords. Use readable sentences that can help convince people to investigate further to learn more.  

Use Links

There are two types of links that can help SEO. There are internal links that lead back to other content on your site that can help the user. There are also external links to authoritative sites that help explain your topic or support your information. 

For internal links, you want to focus on things that deal with the topic you are discussing. Link to other pages on your site that help people finish tasks, get more info on a topic, or show them other helpful ideas for the user. 

For external links, it helps to use high-quality sources that you know can be trusted. Authoritative sites include well-known newspapers and magazines, education sites, and official company pages for products. The more trusted your external link, the more it will help you in SEO. 

Images 

After you have fixed your image size and format, you will want to name all of them descriptively. Having names like picture1 can hurt your SEO. It is too generic and won’t help search engines understand why the images are there.  

On top of proper file names, ALT tags can help your search engine information as these tags are easier to understand. They can also help if an image is having a hard time loading at any point. It will still get the significance of the picture across. Plus having ALT tags on images helps make your website ADA compliant as it allows anyone using a reader to know what type of image they are looking at.

Making sure you put the right information about pictures on your page will help search engines rank your site correctly and eventually get you more views.  

Internal Navigation 

Users want to feel in control of their experience, and useful website navigation can affect this. Users aren’t always going to want to follow the exact path you set up for them. There are going to be some that want to jump around. 

You want to make sure that if they decide to take different paths, they will find a way to get where you want them to go. You can help by including spots where users can quickly go back. Making sure that users want to exit is also helpful.

Our biggest recommendation is to be testing this often on different browsers, on both your desktop, laptop, or tablet, and your mobile device in both portrait and landscape mode to make sure users can easily navigate around.

Bread Crumbs 

Even after users leave specific pages, you may want them to be able to see them again with minimal effort. You can set up bread crumbs so that users can search around your page but always get back to important things. 

Breadcrumb example
In this example, the page is ‘Foodservice’ and the breadcrumbs on the right let visitors know that they are viewing a subpage of ‘Industries’ as well.

 

These navigation cues can be essential, especially when trying to let people shop or research your product and services. It makes it easier for users to get back to where they can make the purchase. It will help you gain more conversions and keep your users happy. 

Exit Intent Pop-ups 

When a user leaves the page, it can sometimes help to post a pop-up that informs them that they are going. You can use this pop-up as a last-ditch effort to get your customer to use something on your site. 

The pop-up can encourage users to sign up for your email list, offer special deals, remind users about critical facts, or just make sure that they don’t accidentally exit without finishing their activity. 

There are many types of different exit intent pop-ups, and they each have their uses. 

When you do it right, it can help you pull back someone who was on their way out. However, you have to use them wisely. They can annoy people, which will have the opposite effect that you want. Try to keep these pop-ups helpful, which will ultimately yield the best possible experience.

Custom 404 Pages 

When you create a website, there will be times when your links don’t load. These problems can be due to old pages, internal issues with the page, or a hoard of other reasons. When this happens, the user redirects to a 404 page.

404 Page Example

These pages are unavoidable sometimes, but you don’t want them to discourage your users. You can make these pages useful so that they redirect the user to something that can help them. 

Make these pages look and feel like the rest of your site. If users think it is a message from their browser, they may leave the page entirely. 

You want the page to explain that there has been a problem. Using a little humor can help get the point across without sounding harsh. Then you want the page to offer alternatives that can help. Putting links to popular content can allow the user to find what they want. 

It would be best if you also had an interaction on the page. Let the user click on a search bar or a CTA that can get them back on track. Letting the user feel like they can fix the problem quickly will help them gain confidence in your site. 

Optimize for Mobile 

Mobile traffic now makes up more than 50% of the views on websites. If your site focuses on desktop browsing, you could be causing problems for over half the people who want to see your page. 

Having an option that makes your site mobile-friendly is vital to keeping the greatest amount of users happy with your site. Many users will leave a page if there are too many mobile-unfriendly features. 

Some developers even start their website from the mobile site and work backward to the desktop experience. Making sure that the site can work on a smaller screen is a good step. Also, thinking about touch screen inputs can help you make sure the site can work on both. Since Google started moving to mobile-first indexing in 2019 as well it is crucial you are following all of their recommendations, you can learn more about it here.

Test Your Mobile Design

Google offers a mobile-friendly test that can let you know if your site works well for mobile users. You can try many different styles with this test and get a better idea about what will work best for the mobile experience.

Be aware your scores won’t be perfect and that’s okay, but it’s better to know where your website is currently at and focus on what is most important. For example, on most websites the homepage drives the most amount of traffic, so always start by optimizing your highest-traffic pages first.

Final Thoughts on Website Best Practices

Knowing and implementing website best practices will drive traffic to your site, get people to consume your content, and make sure they return often. When used correctly, they can help you get the most out of your website. 

Many things can maximize your website’s effectiveness. Making these changes can be helpful. Trying out some new designs and styles can produce the best website experience for everyone.

___

If you’ve read through all of this and it seems too overwhelming or too much to manage we can help, our experts have built and optimized hundreds of websites and can help you as well, contact us today to take the first step with a complimentary consultation!

Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on email
Email

Never miss a post, join our mailing list today, and be informed about new blog posts!

Bluehour icon white

Take the first step

Contact us today to get started