web designing

Basics of Web usability

What is web usability and why is it important?

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

Your website has to be easy to understand navigate

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

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 important page and adjacent to the content, Anything flashing or placed above the top logo is regally an advertisement and The term ‘Shopping cart’ is used for items you might wish to buy. read also How To Keep Your Computer From Spreading Viruses

There are many other conventions like these that 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 in a different ways to 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 are 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 to the way in which we read printed matter, we see text before we see graphics images on the Internet. For optimal website usability don’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

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 website. If you do this, then you are preventing 60% of your users from using their primary navigation, 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. Frames can cause a many of 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 of other ways that websites can place restrictions on its users, in the end damaging their usability can you think of anymore? Just think back to the last time a website really makes you feel bad you, 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 of 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

The use of 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 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 website screen reader can know it is a heading.

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

Another usability benefit advantage of using headings for screen reader users, is that these users can call up a list of on page headings 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 easier for screen reader users to find the information which 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 link with texts represents a usability benefit for everyone 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.


Using lists within the HTML code is really useful for screen reader users, as screen readers make announcement 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 items such as website navigation.

This works in much the same way as answering phone calls telling you how many messages you have, before listening to them. By informing you of how many messages 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 it.

The use of lists is really 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 important information at the top of the page actually benefits everyone, as the very important information is now in the place where sighted users look first the top of the webpage.

Short, succinct ALT text

ALT text html is the alternative text for images that gets read out to screen reader users. Any website offering yet basic 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 your article, followed by the what, why, when, where and how. By putting the conclusion first, screen reader users can immediately gain an understanding of what the paragraph’s is all about. They can then decide whether they want to keep on listening or not, 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 safe in the knowledge that they will not be missing extra information.

Front loading content obviously 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 truly essential that it’s descriptive of the web page. Again, these 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 a number of seconds before the rest of the web page.


There are a many of relatively simple and simple things that 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.


I am a blogger, Web developer with 3 year's experience and IT specialises

Leave a Reply

Your email address will not be published.

Back to top button