What is Web Usability?
Web usability, in its most basic form, refers to a website’s ability to be user-friendly and is a factor that influences the user’s experience. We live in an increasingly interconnected society where consumers can easily find alternatives if they are dissatisfied. This includes leaving a website if they do not enjoy the user experience and looking for another one. Many websites focus on multiple factors of web creation and sometimes forget to make it user-friendly.
Here are some factors of Web Creation that you might find familiar:
Web Design
- CMS
- Media
- Content
- Usability
- Aesthetics
Web Development
- Security
- Navigation
- Accessibility
- Functionality
- Responsiveness
Aside from those mentioned, there are many other factors to consider as well. Let’s dive in.
#1: Readability & Visibility
Your site could be full of informational content but if the content is hard to read, visitors will leave. Visiting a messy site is akin to opening a book with words all over the place – It would only make the reader want to close the book. To improve web usability, here is a list of things to look out for:
- Font:
There are plenty of fonts available that range in a wide variety of different styles. However, you should not pick a font just because it looks pretty or cool. Remember, the user is visiting your website to gain information. If they can’t read anything, they will just leave. Compare the 2 fonts below and imagine the entire website in either font:
Google‘s fonts is a highly recommended tool. The category of fonts available can be easily filtered by ‘style’, ‘ thickness’ and even ‘trending’. A well-chosen font can improve web usability by making it easily readable.
- Font Size:
After choosing a readable font, the size is the next factor to take note of. Although there isn’t a specific font size, most sites’ typography size ranges between 12px to 26px. The sizes vary depending on whether it is the headers, heading, sub-heading, or others. Compare the 2 font sizes below and visualise the entire website in either size:
One has a very large font size, while the other has a very small font size. Both font sizes are difficult to read; the large font size struggles to fit on the screen, while the small font size is barely visible.
- Font & Background (Colours):
Font type and size are not the only factors to consider. While those factors affect the sites’ readability, colours affect your site’s visibility. It does not mean avoiding the use of the same colours to separate texts from the background. AIt will take some time to look through a website because it is so full of content. It is important to avoid colour palettes that may strain your visitor’s eyes so that they may not leave midway. Although Black (texts) & White (background) is considered as the standard, it can get boring and repetitive if not well designed. Therefore, some will choose other colour combinations to create contrast and make the website stand out. In the example, even though red and black look clear, it causes a certain amount of strain to the eyes over time. The effects and after-effects should also be taken into considerations when choosing website colours.
#2: Visual Balance
There are other visual aspects that improve web usability. Such as:
- Layout:
There are a variety of layouts, ranging from the usual horizontal single-column paragraph to Newspaper-style columns. Although it is good to experiment with different styles, it should not be too inconsistent. As mentioned earlier, if a book is filled with words all over the place, the reader will just close the book and stop reading. Layout styles can help keep the reader’s attention. Do not bore the viewers with a single layout for the entire site; instead, use multiple layouts that are consistent with the rest of the site.
- Images:
Using images can help readers with visualizations. It can also help brighten up the site and make it less wordy. A site with no image may cause users to lose interest, and can even be hard to understand. However, too many images may overload the senses and cause readers to be distracted and unsure of what to focus on.
- Spacing:
The more content you intend to include on your website, the more spacing you should use to split it up into bite-sized chunks. Too much information crammed into a little space can confuse the readers, causing them to lose attention and interest. Using appropriate spacing allows readers to take a breather and process the information they’ve just received.
Tip: A method to effectively break up the contents would be the use of ‘Headings’ and ‘Subheadings’. It helps to clearly label the contents into categories and topics.
For example, the site “www.ARNGREN.net” is an example of what NOT to do. The layout is inconsistent without the use of a grid and their images are all over the place with barely any spacing; making the entire site look disorganized.
#3: Navigation & Responsiveness.
A recent “Desktop vs Mobile Usage” study conducted shows that there has been a substantial increase in the number of users using mobile phones to access websites from 2016 to 2017.
- Mobile Friendly
With the rise of mobile usage, designing a site to be mobile-friendly would improve web usability. Just because a website is accessible does not mean it is mobile-friendly. The 2 key factors that show the difference between a mobile-friendly site and a normal site would be navigation and responsiveness.
Navigation: As the method of interacting with elements can differ between platforms, we cannot do certain actions on mobile. For example, a “Drag and Drop” action can be done via a mouse on a desktop but may not be doable on mobile.
Responsiveness: There is an obvious difference in screen sizes between a mobile phone and a computer desktop. Therefore, if the site is not mobile-friendly, it would be distorted or heavily zoomed to fit a mobile device’s resolution.
For example, “The Wedding Lens“ website is not optimized for mobile. When viewed on mobile, it appears extremely zoomed out and requires visitors to zoom in manually to view the content.
By making a site mobile-friendly, the business can benefit substantially in multiple ways. First, it makes the website appear clean and consistent regardless of the platforms used to view it. Second, it increases web usability as it is user-friendly for mobile users. Last, with the current search engines’ algorithms and rise in mobile usage, a mobile-friendly site would rank higher in search engines compared to the ones that are not.
About Pixel Mechanics
As a one-stop e-commerce solutions provider in Singapore, Pixel Mechanics is a website design and development company that aims to help businesses transition to the online space seamlessly.