Nine Import Elements of Web Design
- Navigation
- Visuals
- Content
- Web Friendly
- Interaction
- Conversions
- Information Accessibility
- Intuitiveness
- Branding
Navigation
It is important that the website is easy to navigate on desktop and mobile devices (equally!) Following basic principles such as placing menus at the top or on the side of every page. This makes them immediately accessible as they are in the expected places. It is also a good idea to keep menus as simple as possible. Consider using a hamburger menu to reduce the visual distractions while keeping navigation simple.
*An example of a navigational menu with drop down
Larger sites or sites where your users need to take a number of steps to reach their intended page, should include breadcrumbs and an accessible site map. This will help your users to quickly move around your site or return to a previous page. Without these elements being available, your users would need to retrace their steps, lengthening their journey to the point of (possible) frustration.
If your website uses buttons or other interactive elements it is recommended that they are clearly labeled. This will help the user to understand what they are doing and can help them to take action quickly.
Visuals
When a new user comes to your website you have a very short period of time to capture their attention. Using great visual content is an effective way to do this and drive them into your website.
If you decide to use visual elements on your website it is important to do so with purpose. Be sure to use visuals that align with the content on the page and that it supports the intended outcome. For example, ecommerce websites will have photos of the products, media outlets may use videos, or instuctonal guides may use diagrams to provide an example.
Another great design element is the use of white space. When done effectively, using white space can help draw the user’s attention to a specific part of the page, such as a key message or offer. Doing this highlights the importance of this element compared to others. The new MacBook Air page is a great example of how to use whitespace effectively.
*Source: ImpactPlus
Content
One of the most important aspects, and often the most overlooked, is how your content appears on the website. We often have organizations come to us and tell us their website fails to deliver or their audience has a hard time finding information. When we audit their website we often find that their web pages are walls of text with no major headings or images.
When you are planning your website or publishing a new blog it is important that the content is broken up. Using clear headings (H1, H2, H3, etc.) helps users to navigate the content quickly, finding the information they need. Without these in place users would need to sift through all the content on the page, eventually becoming frustrated and leaving.
You should also use images or graphics to break up the text. These can help support the content or even make it easier to consume. For example, using diagrams or maps.
Web Friendly
Your audience is going to visit your website from a variety of different devices. For example, if they come from a social media site they are most likely on a mobile device. But, for more serious sessions such as a purchase they are more likely to be on a desktop. It is important that your website delivers the best experience possible regardless of the device they are on. This can include how your website appears on each device as well as how quickly it will load.
Some of the elements discussed before also help our website perform better online. By using title tags and headings you don’t only make the website easier to navigate for using but also search engines. As these bots crawl your site they will analyze these headings to better understand the content. These headings will have a direct impact on your search rankings. You should also optimize your images as well with proper titles and alt text.
Interaction
When you are designing your website it is easy to forget about some of the small things that make a website great. Whether the website is yours or you are the user, some small features can make all the difference.
Including interactive elements such as well-placed call-to-action buttons (CTA), return-to-top buttons, or other interactive elements can help lengthen your user’s journey and ultimately increase the chance that they convert. By making navigation or actionable steps a part of your website, you reduce the effort needed from your users and make their experience much more enjoyable.
*An example of a call to action on a website
But, as we have mentioned before it is important that this isn’t overdone. If you use too many of these elements your website will become confusing and the exact opposite of what you want to achieve.
Conversion
A good website will help your organization achieve its goals. Working with your web developer, you will want to discuss the role of each page and how they will assist the user’s journey. Having a better understanding of what each page should achieve and where the user is in their journey, you can provide them with the appropriate tools to convert.
Information Accessibility
Not every user will convert online, they may need to reach out to you directly, or come to your store. For instances like this it is important that your business’s information is immediately accessible, or easy to find. Information such as your address, phone number, and email address could be placed in the footer as this is common. If you do not include this information, your users will have a difficult time reaching you. This will cause them to become frustrated and look for alternatives.
*Footer on the Digital Giant’s website
Intuitiveness
One of the most important things to consider when it comes to user experience is how intuitive your website is. While you may want a website that is unique and stands out, some elements are expected to be in certain locations. A website that looks great but is difficult to use won’t be of any use.
Elements such as navigation menus should be placed at the top of the page or on side and be immediately accessible. Other elements such as a CTA benefit from being in the top right section of the page. It is also important that content on the page aligns with what the users expect, you can’t mislead them.
When you are mapping out your website, ask yourself what does the user need from the page, what will they want. If they need to get back to a specific page, can they?
Branding
As mentioned before, your website is often the first interaction someone will have with your organization. Your website should be consistent with your brand so users who come to the site or visit your location can understand that they are visiting the same organization. There should be no question about it.
When you are choosing the different elements of your website such as colors, typography, logos, etc provide your web designer with your branding guidelines. This will allow them to incorporate your brand into the website and provide them with a framework to work with. This will help reduce the back and forth in the review stages as well.
Choosing a Web Designer
As you can see there are a variety of different things to consider when designing our website. Choosing a web designer that understands all of these will save you a lot of frustration as they will incorporate these elements naturally. We recommend that you speak with a variety of web designers to find the one that suits you the best.
