Basic principles of website usability

Usability refers to how convenient a product is in real life. For example, if this is a taxi application, users will evaluate not so much color combinations and fonts, but the ability to call a car in one click or by voice when it’s raining outside, and you have a child in one hand and three shopping bags in the other. The article explained how to make the interface user-friendly, what problems you might encounter and how to avoid them, and also showed in numbers how usability is related to business indicators. 

What is usability in simple words

Quite simply, usability is responsible for ensuring that the user tries your product and is satisfied. Let's break it down: you make Labubu-shaped cakes. You have thousands of likes on social networks, everyone is squealing with delight, a sea of ​​reposts, a queue in Direct. Customers go to the website to place an order, and that’s where it all ends, because you don’t have an “Order” button or it’s hidden so that you have to search with a flashlight, there are 15 advertising banners on each page, pages freeze when loading due to too large photos and cooking videos, and the mobile version does not have a responsive design. The most persistent, the one who finally found the order form, will have a new surprise: 25 fields where you need to indicate not only the colors and composition of the cake, but also your zodiac sign, phase of the moon and the position of the stars. Probably only your grandmother will not escape from this, and even then out of love. 

Usability tasks

Usability is officially regulated by the standard ISO 9241-11:2018, which describes usability through three quality indicators. These can also be called the main tasks:

1. Efficiency - no obstacles in the user's path (CJM). Came, placed an order, received an order. 

2. Effectiveness - to get results, you need to put in a minimum of effort. That is, you don’t need three hours and 35 clicks to add an item to your cart. For example, smart forms with auto-filling of data from a VK profile and highlighting errors are very helpful with this.  

3. Satisfaction - after interaction, the user does not want to leave an angry review with one star and forget about you forever. He saves the link in his favorites, downloads the application and recommends you to friends. 

Basic principles

Jakob Nielsen is known in the world of UX/UI design much like Mendeleev is among chemists. In 1990, he formulated 10 heuristics - principles that underlie human-centric interfaces. 

1. Show action statuses. The user must understand what is happening: the download is in progress, the order is accepted, the document is sent. If the interface is silent, the person starts to get nervous and press all the buttons in a row, as a result he calls 8 taxis to Griboyedov, then cancels, he gets angry, the taxi drivers get angry, and the application is to blame.

2. Speak the user's language. No “error 0x80004005” and “create entity”. We communicate in human language: “payment declined,” “incorrect code,” “application accepted.” If a client has to open Google to understand what they want from him, most likely he will not return. 

3. Give freedom of action. The user should be able to undo the action, go back and correct the error. Nobody likes interfaces in the style: “You deleted everything. Congratulations."

4. Be consistent. If the button is blue on the home page, it should not turn green in the cart. The menu and button names should be the same on the website and in the application. 

5. Prevent errors. Automatic suggestions, limiting the entered values ​​(for example, in the “Year of Birth” field you cannot enter more than 4 digits), format checking, all this saves the user’s time and business money.

6. Prompt. Minimize client memory load. Order history, tips, templates, previously selected parameters, all this should be saved in the system. 

7. Stay flexible. A beginner needs tips, an experienced user needs quick actions, filters, hot keys and bulk operations. Allow customers to customize how they want to use your product. 

8. Remove visual noise. Focus on aesthetics and minimalism, carefully consider the placement of banners and promotions, do not let them distract the user from important information. 

9. Help the user correct errors. Error messages should be clear and helpful: “invalid phone format, start with +7” is better than “Warning! Error!". 

10. Give a certificate. It’s better, of course, to do without it, but still mini-tips, FAQ, and a page with rules should be at hand. Important: not in the form of a huge PDF: “How to work with the system”, no one will read it.

Usability using the example of a website

A classic example of a good interface: Yandex. Nothing superfluous, the search bar is in the center = the main action, the main services are placed in the top panel, the weather and courses are compact and do not distract, and visual noise is kept to a minimum. An endless feed with promotional items is located under the search and also does not particularly interfere with working with the search engine. By the way, we have a great article about what should be on the main page of the site. 

But it often happens differently. A person opens the main one: on top there is a full-screen banner, below it is a second one, on the right is a pop-up window asking you to subscribe to the newsletter, on top of this is a chat bot with a cross that has crawled out of the screen. In the mobile version everything looks even worse. The page has not yet loaded, but the person has already closed three windows, barely found how to remove the bot and is hardly interested in looking further. The only chance to sell him something: you offer an exclusive that cannot be found anywhere else. 

When it comes to e-commerce, the biggest losses occur at the checkout stage. Baymard Institute reports users are abandoning carts in 70% of cases, while more than 60% of respondents cite usability problems as the reasons:

• I had to create an account (=there was no quick order);

• the ordering process is too long/complicated;

• there were errors/glitches on the site;

• it was not possible to find out the final cost of the order in advance, and so on. 

Literally: because of a crooked interface, you lose millions of rubles a year. 

Typical problems

1. The interface is too complex. Three-level menus, dozens of identical buttons, tooltips and pop-ups in the most inconvenient places. The more elements you add, the faster the user will close the page. 

2. Poor mobile adaptation. There are still sites where the desktop version was simply shrunk in the mobile version; as a result, the buttons became the size of a pixel, and the text went off the screen. Most of the audience comes from smartphones; ignore it and you will lose customers. Here we told how to adapt a website for mobile devices. 

3. The site or application is inconvenient. Fashionable pastel colors are invisible when viewed on the screen of a mobile gadget on a sunny day. Text that is too small is impossible to read while running. It is important to consider real scenarios: how and under what conditions they will use your product. 

4. Low download speed. If the page takes more than three seconds to load, most likely the client is already with competitors. The time for dial-up is long gone.

5. Ignore the behavior of real users. It’s like landscaping in courtyards, when a path is laid not where people already walk, but as it should be. Test, collect feedback and make the interface convenient for those who will use it. 

How to evaluate

One method is Nielsen heuristic evaluation, where you go through key scenarios as a user and check if the basic principles are met. This way you can find gross errors, but this method has limitations: firstly, for an objective assessment, the check must be performed by a team, and secondly, the recommendations are described quite abstractly.  

The next tool is usability tests. It's watching real people try to accomplish real tasks. Five to seven participants are enough to see up to 80 percent of problems, and these numbers are supported by dozens of studies. The person acts honestly: he doesn’t know what you “meant”, he clicks the way your real clients click. If they are lost at a stage that seems obvious to you, then you need to reconsider the logic. 

A/B testing helps test hypotheses on high traffic, when there are two versions of a solution and you need to understand which one works better. You create two pages, for example, with different order buttons, and the system (Yandex Metrica and the like) automatically divides the traffic: some people see the old version, some see the new one. Then the numbers are compared: which option gave more clicks, purchases or completed actions is left. 

There is also behavioral analytics: click maps, session recordings, funnels, scrolling depth. It shows where people get stuck, what they miss, and what blocks they completely ignore. Sometimes it’s enough to watch three recordings of a session to understand why no one clicks “subscribe to the newsletter”: they simply don’t reach it.

And finally, the most underrated part: user feedback. Mini-surveys, “did you find what you were looking for” forms and other methods of interaction provide honest answers about the usability of the project. 

It is best to use all methods in combination. 

The connection between usability and business indicators

According to the Baymard Institute, only checkout optimization provides the potential for conversion growth by 30–35 percent. In the report User Experience Design That Converts: Complete Guide 2025 notes that investing in UX can increase product revenue by up to 400 percent if the work is based on research and real user experience. 

This is also evident in practical cases. Upscend published a redesign of an e-commerce project, where interface improvements gave +44 percent conversion in 12 weeks. We have similar experience; over the years we have done hundreds of projects and we know that even minimal changes (reduced the number of fields in the form, enlarged and recolored the “Buy” button, and so on) can easily increase conversion by 10–30%. The conclusion is as simple as possible: do it for people and make a profit. 

How to improve

1. Simplify CJM, leaving only those steps that you cannot do without.

2. Remove unnecessary elements; the less noise, the more people will reach the CTA.

3. Particular attention is paid to the mobile version, the interface should work in any weather, on the run and upside down. 

4. View session recordings, clicks, errors, failures and adjust the site/application for them.

5. Think like a user, become a user. The best way to figure out what's wrong is to go through CJM and ask your friends to test it. 

6. Test hypotheses in A/B testing, collect analytics and make decisions based on accurate data. 

7. Watch your speed. The coolest website will lose to one assembled on your knees using a free constructor or neural network if each page takes a minute to load. 

When we do custom website design, we take into account everything, from appearance to functionality. We analyze the niche, competitors and target audience, check that the pages load equally quickly on a push-button Grandmotherphone and on a MacBook, and open correctly on a TV and projector: what if you want to show the site on a business forum. We are proud of every work in the portfolio, if you want, we will put together a cool project for you.