Basics of Web usability

What is web usability, and why is it important?

Web usability is all about making your website so that your website users can find what they are looking for quickly and efficiently. A usable website can reap a considerable advantage for your website and your business. Every 1 dollar invested in improving your website’s usability returns 10 to 1000 dollars. A website usability redesign can increase the sales or conversion rate by 100%

Your website has to be easy to understand and navigate

Users have gradually become accustomed to particular layouts and phrases on the web, for example:

The organization logo is in the top left corner and links back to the homepage of your website, the term ‘About us’ is used for organization information, Navigation is in the same place on each critical page and adjacent to the content, and Anything flashing or placed above the top logo is regally an advertisement. The term ‘Shopping cart’ is used for items you might wish to buy. Read also How To Keep Your Computer From Spreading Viruses.

Many other conventions like these enhance your website’s usability. Can you think of some more?

Don’t underrate the importance of these conventions. As the Internet matures, we are getting more and more used to things being a certain way. Break those conventions, and you may be left with nothing but a website with underprivileged usability and a handful of dissatisfied website visitors. You may like How to Make Sure my Wireless Home Network Is Secure.

Fast loading website

Usability studies have shown that 10 seconds is the maximum time internet users will wait for a page to load. As of 2022, just 80% of web users had broadband, so it’s essential for optimal usability that your website loads faster.

Things to do to speed up the loading time of your website:

  1. Use CSS and not tables to lay out your webpage
  2. Use CSS and not graphics to create fancy navigation items

Information should be easy to retrieve

We read web pages differently than the way we read printed matter. We, in the main, don’t read pages word for word; instead, we scan. When we scan web pages, certain items stand out as the following:

  1. Headings
  2. Link text
  3. Bold text
  4. Bulleted lists

Did you notice that graphics images were left out of that list? Different from the way in which we read printed matter, we see the text before we see graphics images on the Internet. For an optimal website, usability doesn’t place important information in graphics images as it might go unnoticed. Check this Guide To Computer Security

Restrictions must not be put on users.

Please don’t stop your users from navigating through the web in the way that they want to. For example:

1. Every time a website link is opened in a new window, the back button is disabled. Approximately 70% of Web users employ the back button as their primary means of Navigation on the website. If you do this, then you are preventing 60% of your users from using their primary Navigation, and now that can’t be good for usability. Don’t miss Some Basic Changes To Make In Your Internet Explorer Options

2. Don’t make use of frames to lay out your website. Structures can cause many usability problems, namely:

  • Disabling the back button (see above)
  • Bookmarking not possible
  • Impossible to e-mail the link to someone else
  • Problems with printing
  • Users feel trapped if external links open up in the same window
  • Search engine optimization issues

There are many other ways that websites can place restrictions on their users, in the end damaging their usability. Can you think of any more? Just think back to the last time a website made you feel bad. What annoying thing did it do to make you feel that way?

Improving Usability for Screen Reader Users

Simply making sure your website is accessible to screen reader users is, unfortunately, not enough to be sure these users can find what they are looking for in a reasonably fast and efficient manner. Even if your website is accessible to screen reader users, its usability could be so incredibly poor that they need not have bothered coming to your website.

Luckily, there are many simple to implement guidelines you can follow below, which not only drastically improve usability for screen reader users, but for all internet users:

Descriptive headings

Using on-page headings is one of the most important usability features for website screen reader users, as it helps people more easily understand the web page structure. Even though the text on the web page may appear to be a heading for sighted users, it must be labeled as a heading within the HTML code for the website screen reader can know it is a heading.

Screen readers don’t look at web pages but read through the HTML code. If a piece of text is called a heading within the HTML code, then the screen reader will be called that it a heading. If not, screen reader users won’t really know if something visually appears to be a heading is actually a heading without indicating it.

Another usability benefit advantage of using headings for screen reader users is that these users can call up a list of on-page titles and jump to the section of the web page in which they are most interested. This works in much the same way as sight website users scanning through web pages by glancing at headings. If headings are descriptive of the content limited beneath them, it becomes far more accessible for screen reader users to find the information they want. Read also How To Start Your Career In Information Technology beginner

Descriptive link text

Screen reader users can browse through WebPages by calling up a list of on-page links on a web page and activating the link in which they are most interested. As such, non-descriptive link text such as click here should be avoided at all as it makes no sense whatsoever out of context.

The good news is that the use of descriptive links with texts represents a usability benefit for all web users. When we scan through WebPages, one of the items that stand out to us is link text. ‘Click here’ is totally meaningless to internet users scanning through web pages and forces users to hunt through surrounding text to discover the link destination site.

Lists

Using lists within the HTML code is really useful for screen reader users, as screen readers make announcements about the number of items in each list before reading out the list items. This helps these users know what to expect when hearing a list of things, such as website navigation.

This works in the same way as answering phone calls and telling you how many messages you have before listening to them. By informing you of how many announcements you have on your phone, you instantly know what to expect. If there are only two or three messages, you can probably remember them much more, and you will probably want to get a pen and paper and make notes of them.

The use of lists is just a behind-the-scenes change to the HTML code and need NOT affect the visual appearance of the website.

Logical linearization

Screen reader users generally have to listen to WebPages from beginning to the end, top to bottom, left to right. Sighted internet users, on the other hand, can glance through a webpage almost randomly, spotting and scanning important information wherever it may appear on the web page. Because of this, important information should always be placed towards the top of the webpage.

One example of how not to do this is to place instructions for a form at the bottom of the webpage.

Putting crucial information at the top of the page actually benefits everyone, as the vital information is now in the place where sighted users look first at the top of the webpage.

Short, concise ALT text

ALT text HTML is the alternative text for images that gets read out to screen reader users. Any website offering yet essential ease of understanding will provide this alternative text. Some websites try to over-explain the information conveyed by images, forcing screen reader users to have to listen to a lot of unnecessary and irrelevant information to users.

Screen reader users often take longer than sighted websites users to work through websites, so help make their surfing time easier with succinct ALT text HTML.

Short, front-loaded paragraphs

Front loading means placing the conclusion first in your article, followed by the what, why, when, where, and how. By putting the decision first, screen reader users can immediately understand what the paragraphs are all about. They can then decide whether they want to keep on listening or not or if they want to skip to the next paragraph, which they can easily do with the screen reader. If the paragraphs are short, they can do this safely in the knowledge that they will not be missing extra information.

Front-loading content benefits everyone, as internet users no longer have to search around for the main point of each paragraph.

Descriptive page title

The page title is the very first thing that website screen reader users hear when arriving at any website, so it’s genuinely essential that it’s descriptive of the web page. Again, this benefits everyone as users can use the web page title to adjust themselves and confirm that they are on the page they think they are on. This is especially true for website users on dial-up connections where the page title displays several seconds before the rest of the web page.

Conclusion

Many relatively straightforward things can be done to improve usability for screen reader users. Fortunately, nearly all of them improve usability for all website users, meaning everyone benefits which is never a bad thing.

Leave a Comment

Your email address will not be published.

Scroll to Top