The longer you design websites, the more some things become second nature. You know you have to test different things to make sure they function appropriately, and you understand instinctively when something looks good versus when it doesn’t. However, with familiarity also comes the likelihood you might forget a few website elements that make it more enjoyable to the user.
There are more than 1.7 million websites on the World Wide Web. While not all will be direct competition for you, that is still a lot of noise to sort through. Capturing the attention of those who land your page isn’t an easy task, so ensuring you have a few basic features in place helps engage them.
There are some website elements that you shouldn’t overlook no matter what type of site you create. You may already be familiar with some of these basic features, but others may surprise you. Use the following as a sort of checklist when considering what to put on your pages.
Jump to: Predictable Navigation | Custom 404 Page | Web Animation | Content Location | Responsive Images and Text | Shorter Forms | Site Speed | Type Hierarchy | Button Styles | High-Functioning Footers | Negative Space | Calls to Action
1. Predictable Navigation
You need some form of navigation on your website, but it’s tempting to try something cutting-edge and new. Perhaps you’ve hidden the menu and the user has to hover over a certain spot to find it. The problem with new techniques is that people expect navigation to be located near the top of the page and even to have a specific order.
For example, the Contact button is usually to the right and the Home button to the left of the navigation bar. When you get too out of the norm, users may grow frustrated and leave your site. Strive for a more predictable and easy to find navigation hierarchy.
2. Custom 404 Page
Have you ever visited a website and when you tried to go to a specific page — perhaps one you saved previously — you bounce back to the home page? There are few things as aggravating to users as not being given the 404 error. However, you should definitely customize your 404 pages. Some options include a funny message and a redirect back to the home page or a list of search results similar to the page the person went to. It could just be that your internal navigation changed a bit and what the user wants has a new address.
3. Web Animation
While web animation may not be something you think about as a necessity for your website, it is a fun way to draw user interest and engage them once they land on your site. Animation takes a static page and turns it into something exciting that stands out. You can use basic website elements such as hover motion to create interest in clicking on a specific call to action (CTA).
4. Content Location
While planning the layout of your website, you should think about what types of content you’ll have and where it should be located. For example, if you plan to have some written tutorials, a blog would keep your landing pages uncluttered while still offering users valuable resources. On the other hand, if your site is mainly content-driven, then you may wish to place your articles on the main page and feature some images from each of them in thumbnails. Thinking through both the content you plan to start with and what you’d like to add later can make the growth of your site seamless.
5. Responsive Images and Text
More people use their mobile devices to access the internet. Around 92 percent of Facebook’s ad revenue now comes via mobile. That is a huge shift in advertising and usage that is almost certain to translate over to website elements and design. Make sure all your designs are responsive to mobile. Some developers now go with a mobile-first design and let it adapt to desktop devices. While the world might not quite be ready to give up their desktops, at least balancing between the different screen sizes expands your potential customer base.
6. Shorter Forms
Do away with lengthy forms on your site. People don’t have the time, patience or incentive to fill out endless amounts of information. Those on mobile devices have difficulty filling out forms. You’re much better off asking for a few pieces of information, such as name and email, and then contacting the lead if you need more than that. Adding forms may or may not be essential website elements, but the length of them can make or break your conversions.
Look for ways to make filling them out easier, too, such as linking the user up through a Facebook or Google account with a single click.
7. Site Speed
You’ve probably heard that people’s attention spans are shorter than they’ve ever been before. Blame the instant access to Alexa or our culture of getting everything immediately, but if your site doesn’t load in a few seconds, you risk losing visitors. You might not think of speed as a feature of your website, but it is arguably one of the most important unseen factors in how well your page performs.
In a survey of 750 consumers and 395 marketers, researchers found around 70 percent of people say page speed makes a difference in how willing they are to purchase from an online store.
8. Type Hierarchy
Your website should have a hierarchy to the typography. Limit yourself to a couple of fonts that work well together and then figure out the size and weight of each of your website elements, such as the H1 and H2 headers. How is italics or bolded font handled? What are the colors of the type, and how do they work with the background? You might think this all comes naturally, but without the right contrast, your text may be difficult to read for some users. Spend time on your typography hierarchy and your site visitors will thank you.
9. Button Styles
You already know that a button needs to tie into your overall color palette and contrast with the rest of the page, but have you thought about different styles and how to best deliver them? What happens when the button is static? What are the changes when someone hovers over a button? How can you include some motion in the hover action so the user is engaged?
Finally, think about what happens when the user clicks on the button. How does that person know their click was successful?
10. High-Functioning Footers
Many designers throw up a footer as an afterthought, including a copyright notice and maybe some contact information. However, many times, users scroll to the bottom of the page to locate contact information. What if you used your footer for more than just a placeholder? What if you used it to grab user attention and direct them to action? Perhaps you could include some social media buttons so users interact with you on those platforms?
Think about what you’d like to see in a footer and try out some different combinations until you hit on one that tests successfully with your particular users.
11. Negative Space
For a design to be visually pleasing, you need a nice balance of positive and negative space. However, as a website grows, it is easy to come up with a very cluttered page or sidebar that distracts the user from the main purpose of the page. Take a step back from your computer while designing and think about what you’d like to accomplish with that page. Then, remove any website elements that don’t meet that goal.
12. Calls to Action (CTAs)
A strong CTA draws your user to take a specific action. It captures attention by standing out in bold accent colors and appearing slightly larger than some of the other website elements. Pay close attention to the wording of your CTA, using action verbs and first and second person phrasing whenever possible. Try to avoid common CTA words, such as “submit,” and go for something a bit more original but still descriptive, such as “Get My Free Report.”
Back to Top
While it’s important to stay up to date and show your site isn’t ignored, it’s also important to create a consistent image users can rely on. They should know when they visit a business’s website that there will be certain information available and it will be found within specific links. Even when you update the site, you shouldn’t change the basic underlying structure of navigation and other important website elements.