Website usability

What is Website Usability Testing and How to Do It?

20 March, 2019

Что такое тестирование юзабилити сайта и как его проводить?2

From this article you will learn what website usability testing is, what stages it presupposes, and why each website owner must be interested in this practice. We’ll also talk about usability research methods, look at some effective services and an example of usability test report. All this information will help you not only better understand the process of website usability testing but also know when to conduct it on your own and when to engage UX experts.

The Essence of Website Usability Testing from the perspective of City Usability

On the picture below, you may see Linfen, a city in China, which was considered one of the most polluted cities in the world in 2018. Its citizens never dry the laundry outside: when contacting with the air, it immediately gets covered with a thick layer of smog.

Linfen

Повседневный Линьфэнь.

Till 1978 there was no coal mine in the city ― Linfen was always associated with orchards and gardens. The Chinese government took care of the area and the residents. Just see how Linfen looked like before pollution: clean air, greenery, and no signs of the future catastrophe.

Одна из городских площадей Линьфэнья до 1978 года.

Now let’s look at another city, Vienna. In April of 1945, the capital of Austria was captured by the Soviet Forces, who destroyed it completely.

The Vienna Offensive, April 1945

Бой на территории Вены в апреле 1945 года.

The government of Austria always caring about its people and their interests, in 2018 it was the ninth time in a row that Vienna became the world’s most comfortable city according to «Mercer» research agency. The same year, analysts of «Economist» supported their colleagues and declared Vienna the most liveable city on the planet.

View over Vienna

Дневной вид на Вену.

Now let’s look at usability testing based on the above-mentioned examples of the two cities. In Linfen, the government placed economics over the interests of people, which emaciated the city and made it a place unsuitable to living. The story of Vienna was different: the government put the interests of people over its economic ambitions, that is why the city prospered and is now recognized as the best world’s megalopolis.

If now we substitute the cities with the websites, the situation will be the same:

  • Linfen is an example of a badly thought-out website where one may hardly find the needed information. Such website is not user-friendly, so you might want to leave it and never come back.
  • Vienna is an example of a user-friendly website which people will find easy to work with. You will want to stay on its pages more, making a purchase or reading the content.

Website usability testing is such type of research which actually helps to transform Linfen into Vienna: you conduct usability testing for a website to get a list of items to elaborate on, correct mistakes, increase conversion rate, and make your website appealing to users.

Further, we will take a closer look at the ways to conduct usability testing and the knowledge one needs to do it properly.

What is usability testing?

Usability testing is a complex evaluation of a website based on its ease of use and the efficiency of its technical elements.  The ease of use of a website largely depends on its UI-design, while its functionality is tested during a website audit. Let’s find out how these processes are interconnected.

UI-design entails the creation of a prototype of a product or a visual interface that is likely to be convenient to its users. UX-testing is the approbation of the product on the target audience or the users who are expected to be interested in the website being launched or the newly created product. To better understand the difference between UI and UX, let’s consider two examples, namely, ketchup bottles and paved paths in a park.

According to the designer’s point of view, a ketchup bottle must have the following properties: it should be compact, fit the user’s hand well, look stylish and have a cap and a dispenser. This is the UI-design – product that seems right according to the developer. After that, the UI bottle is given to the end user, who thinks that the design is absolutely flawed: the bottle is too small, it has no flip-lid at the bottom, but instead there is a seemingly useless dispenser at the top of the bottle. This is UX-testing – a practical assessment of the usability of the product.

The ketchup bottle example demonstrating the difference between UI and UX

Разница между UI и UX на примере бутылки с кетчупом.

Now let’s study the paved paths example. An architect has designed a park with paved paths for, say, lazy Sunday walks and surrounded them with a green lawn, having some trees planted  here and there. This is the UI-design – the architect relied on his own vision of user convenience. When the project was implemented, it turned out that the park visitors almost never used one section of the pavement and instead walked right over the lawn to cut their way short. This is UX-testing, which showed that the design was not usable enough and the visitors had to create an additional path for their convenience.

The paved path example illustrating the difference between UI and UX

Разница между UI и UX на примере пешеходных дорожек.

An audit is a complex check of the website conducted to detect any technical vulnerabilities in it. Website audit will help you find out whether the targeted traffic has been reached, if any problems have occurred and prompt the actions you need to undertake to improve the situation. For example, if your website has caught a virus, all search engines will immediately detect it and block the entire website. As a result, it will get filtered as a potentially harmful resource, and some users will be unable to access it; hence the traffic drops, low sales, and other ensuing circumstances. Website audit will help you to troubleshoot and timely address the detected problems.

Let’s see at which point UI-design interplays with website audit and what they all have to do with usability testing. Here’s a chart listing the possible ways to study user behavior and the steps one may take to conduct a complex website audit.

Ways to analyze user behaviorWebsite audit components
InterviewsTechnical audit
Online surveysWebsite content audit
QuestionnairesSemantic kernel evaluation
Tree testingLanding page audit
ScorecardsChecking web analytics tools
A/B testingLink audit
Persona BuildingCompetitors analysis
Click testAssessment of the internal optimization quality
Navigation testMarketing audit
5 second testingDevelopment opportunities audit
Usability testingUsability audit

UX-testing is the linking spot between UI-design and website audit. In UI-design, usability testing allows one to evaluate the convenience and practicality of a website (remember the ketchup bottle and the paved paths examples). User audit shows technical vulnerabilities of the website and suggests ways to tackle them to let the UI-design play. Since the processes are interconnected, it would be wise to conduct them simultaneously as components of one complex check. Otherwise, each process has little practical value of its own: no one needs a non-functioning website or a working website with an ugly design. Practically, the connection between UI-design, UX-testing, and the usability audit is realized in the following way:

  1. First, the developers study the market niche, analyze the competition, collect the necessary information, and design the website as they see it fit. This is the UI-design stage.
  2. After that, the website is tested by the users and the design of the website is adjusted according to their feedback. This is how UX-test works.
  3. Finally, the website is assessed by technical specialists, who are responsible for making the components of the UI work flawlessly. This is the usability audit stage.

If the website has a convenient design, is appealing to its users (as shown in the UX-test), and works properly (according to the usability audit), chances are high that it will eventually reach its point.

Why UX-testing is important

When the user visits a website for the first time, it takes them up to three seconds to evaluate the design of the website. If everything is just fine, the visitor spends the next ten seconds to get to know the structure of the website, its navigation, and content. If no problem arises and everything is clear, the user will most likely study the suggested content and perform the necessary action: subscribe to updates, call the office, buy the offered item or use the service.  However, if a first-time visitor encounters a problem within the first 15 seconds, they will most probably close the page without paying due attention to what is being offered. If the user decides to stay on the page but gets confused or disappointed by something, the same situation will occur, and the website will miss its point.

As it can be seen from the chart, $1 invested in UX testing brings you $100 in ROI.

1 $ вложенный в вопросы UX-тестирования возвращает обратно 100 $.

To better understand the aim of UX-testing, imagine that you have placed a popup window encouraging the visitors to provide their phone numbers and get a callback from the manager. If the website users get irritated by that window, they will study the content of the website but order the goods or services from your competitors. In this case, timely UX-testing will help you spot the trouble and tackle it before it affects your sales: the results of the very first survey will prompt you to remove the popup window from your website.

What if you do not UX-test your website

К чему приводит отсутствие юзабилити-тестов.

Nowadays, trillions of dollars circulate in the e-commerce sector, and 35% of this money will be lost due to the lack of proper UX-testing. Suppose you decide to advertise your product at the expense of UI audit and UX assessment. In this case, after the expansion of the marketing budget, the website will get more traffic. The irritating popup window will divert the majority of the visitors to your competitors, who have realized the importance of UX-testing and designed convenient websites. Your website will miss its point anyway, while the increased marketing costs will translate into financial losses.

Thus, UX-testing helps one to tackle the fundamental issues affecting the conversion rates. This is the main reason to conduct timely usability assessments and correct faults in the design of your website.

UX-testing makes the process of website development much easier and allows one to launch websites two times faster.

UX-тесты упрощают проектирование сайта и позволяют его запускать в два раза быстрее.

Along with that, UX-testing has a number of other advantages: it boosts the sales, allows for reanimation of faulty e-startups, and saves the time of website developers. Thus, usability testing is a great opportunity to rejuvenate abandoned projects.

Юзабилити-тест — это возможность возобновить неудачные стартапы.

Every year up to $1 trillion is spent on the launch of internet startups. Approximately $150 billion is lost on projects that get abandoned. The good news is that the majority of those dying startups can be reanimated by timely usability testing.

Losses incurred by online stores due to insufficient UX-testing

Убытки интернет-магазинов из-за отсутствия юзабилити-тестов.

A striking 27% of the online shoppers in the US abandon their orders due to unsatisfactory checkout flow and design. If translated into money terms, this means that American online-stores lose $260 billion yearly to poor UX. Other countries experience similar problems.

How to test website usability: A complete case study

In this section, you will learn about the processes of UX-testing from a practical example. We will analyze the website of one of  the e-commenrce stores wesco-shop.us and provide some recommendations on how to improve it. If you are planning to launch a Google Ads campaign, redesign your website, or promote it using SEO, UX testing will be of great use to you, too. In one of the upcoming sections, we will throw some light on how one can assess the usability of a website on their own.   But if you are too pressed for time – consider delegating this task to professionals.

Tip #1 Make sure items are categorized properly

Sometimes products listed on a page are of different colors. This makes the page seem messy and distracts the user’s attention. If all products are grouped according to their color, the page will look neat and stylish.

Product Catalog before the UX-test

Каталог продукции до проведения юзабилити-аудита.

Here we see a purple clock standing out from the rest of the items listed on the page. For the page to look orderly, replace the purple kitchen clock with a red one. The colors would not matter that much if it weren’t for the stylistics of the website. Since the design concept presupposes that the products should be grouped according to their colors, make sure this condition is observed.

Product Catalog after the UX audit: all items are red

Каталог продукции после проведения аудита: все товары перекрашены в красный цвет.

The client has adhered to the recommendation and filled the page with red items only. Now the page looks crisp and well thought out. To boost this effect, the client may choose to hire a designer, who will ensure that the same color shade is used throughout the entire catalog.

Tip #2 A scrolling problem

The inner scrollbar on the page should be deleted. The scrollbar has been designed incorrectly.   The faulty code should be edited so that we can get rid of the scrollbar and make the page look better.

A scrolling problem

Проблема с прокруткой.

In this example, the scrollbar is too thick and placed too far from the right margin. Moreover, its color matches that of the items presented in the catalog. This distracts the viewer’s attention and makes the page difficult to navigate. Ironically, by getting rid of the scrollbar, you will make the page more user friendly.

A recommendation on how to edit the code.

Совет по редактированию кода.

Our task is to study the code, find the problem, make a screenshot, and highlight the part that needs to be edited. After that, notify the client about the problem and provide the screenshot.

The website owner disregarded our recommendation and chose not to remove the scrollbar

Владелец сайта не воспользовался советом, не поправил код и не решил проблему с прокруткой.

For some reason, the client did not  address the scrollbar problem. The thick grey line is still there, preventing the users from studying the catalog. We have no access to the back-end of the website, and thus we cannot edit the code ourselves. So, let’s  continue our analysis, hoping that the website owner will tackle this problem.

Tip #3  A mistake in the footer’s layout

Sometimes  when refreshing the landing page, the user can notice a website footer errors: a frey field with a search bar appears at the bottom of the page though  they are not supposed to be there. To fix this problem, one should adjust the code to restore the original layout of the website.

Website footer problem

Ошибка в подвале сайта.

There should be some empty space at the bottom of the page. That is, avoid placing any elements there other than links to social media and payment systems or “Sign Up” and “Back to the top” buttons.

The website owner did not correct the footer problem

Владелец сайта не воспользовался советом и не исправил ошибку в подвале сайта.

The website owner did not stick to our recommendation and decided not to adjust the code. As a result, the grey box still emerges at the bottom of the page from time to time, covering payment system logos. The non-functioning search bar that appears there will irritate most visitors as well.

Tip #4 Make sure the design elements are properly aligned

Three content blocks with categories got shifted to the left and do not fit the general page layout. To fix this problem, go to the back end and center them properly. As easy as that!

Headings layout before the usability audit.

Расположение рубрик до проведения юзабилити-аудита.

Anyway, the client should double check the rubricator. Even when centered, the three small content blocks look somewhat unnatural. Let’s add a new category, use bigger images and center all elements again.  Looks pretty cool, does not it?

The layout of the content blocks with categories after the UX-test: all elements have been centered properly

Расположение рубрик после проведения юзабилити-аудита: ошибка центрирования исправлена и блоки стоят ровно.

The website owner adhered to our suggestions and introduced the necessary changes immediately. Now there are four content blocks placed neatly under the main image. If the store will have new product categories in future, they can be added as separate blocks and placed on top of each other. Such a layout will look attractive and easily navigable.

Tip #5 Size all elements optimally

The comments box should be resized and centered. Right now it looks too big and inconvenient.

The comment box before the usability audit

Расположение поля для комментариев до проведения юзабилити-аудита.

Let’s outline the optimal size of the comments block. Such an adjustment will make the it look more user-friendly: it will be easier for the user to type in the comment, check it and amend it if necessary.

The adjusted comments field: the box has become smaller and looks more attractive and convenient.

Поле для комментариев после исправления ошибок: ячейка уменьшилась, растянулось по ширине и выглядит аккуратней.

The website owner partially took our recommendations into account: the comment box got smaller, but it is still fitted to the width of the page. In this case, the user is likely to find difficulty writing lengthy comments with, say, a profound description of some problem they may have encountered. Let’s warn the client about this issue and move on to the next tip.

Tip #6 Inadequate image layout

All images from each block should be of the same size. If this requirement is not followed, the website will look messy and shoddy. This can result in the lack of customer loyalty, a decrease in sales, and other problems.

Image size before the usability audit

Размер изображений до проведения юзабилити-аудита.

Mark the image that stands out from the rest, show the screenshot to the client and explain how important it is to fix the problem immediately. In fact, the issue is not complex at all, and it takes a couple of code adjustments to make the page much more attractive.

Tip #7 Replace an image returning a 404 error

Find the broken image right under the categories block. Advise the client to replace it with a working one or delete it altogether.

A broken image found during UX-testing

Битое изображение, обнаруженное в процессе проведения юзабилити-аудита.

Mark the broken image and inform the website owner about the problem. Ask the developer to double check the code and update the website theme, Again, the issue is not complex at all, but it takes some time to fix it.

With the necessary adjustments made, the website features images of the same size, and all blocks look stylistically similar. The non-working image has been replaced with a SALE block.

блок-скидка SALE.

Our advice was taken into account: the developer updated the theme, adjusted the code, and added a new image. The intimidating 404 error code image has been replaced with a promising “Sale” banner. Now it’s high time to attract new clients!

Tip #8 Delete unnecessary links

The feedback form features a link «Powered by YOTPO»  – this is a specific service that aids in the work with customer feedback. If the link remains there, it will drive a significant portion of the traffic away from the website. Obviously, we did not subscribe for that.

An unnecessary link found during UX-testing

Ненужная ссылка, выявленная в процессе юзабилити-аудита.

There is an unspoken rule: all elements featured on an online-store website should facilitate the customer’s buying experience. If something may distract the customer from browsing the products and proceeding to the checkout, it should be concealed or removed. Otherwise, the drop in conversion rates is inevitable.

The website owner did not delete the link.

Владелец сайта ссылку не удалил.

Obviously, the website owner did not think that our advice was important enough and left the link to YOTPO where it was. In this regard, one may realize that quality UX hinges on great attention to detail, but proper implementation of those details is even more important. This case study demonstrates how many essential details are left unattended.

Tip #9 Make the images mobile friendly

Having switched to the mobile version of the website, the user will notice that the first image in the suggested product range will be larger than the others. This mistake must be corrected since the website should be compatible with and properly displayed on all devices.

A mobile version error.

Ошибка в мобильной версии сайта.

Switching to the mobile version of the website, we can spot some layout problems: the first image is noticeably larger than the other images on this page. It should be resized so that one more product description can be displayed on screen simultaneously. That is, two products should be shown in one line.

The issue has been addressed. Now all the images in the collection are of the same size.

Ошибка с размером исправлена и в мобильной версии сайта все элементы коллекции одинакового размера.

The website owner has introduced the necessary changes and now the catalog can boast of adaptive design.This means that the layout of the website will look appealing and orderly on any gadget.  If you open the page on your smartphone, the catalog will feature two product descriptions in one row. Just as we have meant it.

Open the website on your tablet and flip it horizontally – the images are still displayed adequately.

Все изображения отображаются корректно.

Check the layout of the website on a tablet. Turn the tablet to landscape orientation and see four elements displayed in one line. The page looks neat and ready for a broader product range.

Flip the tablet vertically – the images are displayed correctly anyway.

Смотрим сайт на планшете в вертикальном положении. Все изображения отображаются корректно.

Turn the tablet back to horizontal orientation – four products are still displayed in one line and everything looks attractive and precise. Now we can move on.

Tip #10 Ensure that your website design is adaptive

In this case,  the mobile version does not allow the user to see the entire menu and offers no link to the home page.

A problem in the mobile version of the website

Проблема меню в мобильной версии сайта.

The problematic area of the interface is marked in red. In the mobile version, part of the main navigation menu is hidden under the website header and the users have to open the website once again to get to the home page.

The problem remained unsolved.

Проблема осталась нерешенной.

The website menu does not work. Clicking on the menu button makes the page refresh.  This means that the website owner has not solved the problem.

Tip #11 Optimize the image size

One of the catalog pages features images of different sizes. This is not the way to go. We want all items look stylistically homogeneous.

Images of different sizes on one of the catalog pages

Проблемы с размером изображений в одном из разделов каталога.

The catalog shows image thumbnails. These are used to help the website visitor get a quick view of the product. At this point, details are not that important, so there is no need to scale the products proportionally.

Обновленный вид страницы.

Most images here are of the same size. However, the last one stands out from the rest. Apparently, the designer intended to demonstrate that the item is comparatively small, but in this context, it makes little sense and makes the page look messy.

How to do UX-testing

Stage 1

First, it is paramount to formulate the goals, hypotheses, and the immediate tasks of usability testing. UX-testing entails a profound research procedure, so it is sensible to undertake it in two cases: if you want to health check your website or to troubleshoot if your website does not work as expected.

If UX-testing is done as a preventive measure, its goals, hypotheses, and tasks revolve around checking whether the website functions adequately and all of its elements are displayed correctly. In this case, few changes will be made since it will take only minor adjustments to fix most of the potentially encountered problems. On the other hand, if the website does not yield the expected results, the goals, hypotheses, and tasks of UX testing should be considered separately. The goal is determined by the problem to be solved in the course of usability testing. Hypotheses aid in finding the possible root cause of the problem, while the tasks help to build the strategy to tackle the problem. To understand the process better let’s consider the following example: the website owner has undertaken SEO-optimization, invested in advertising, had his website get to Google Top 3, increased its traffic by 50%, and… lost 50% of his sales. In such a situation, one needs to formulate precise goals, hypotheses and tasks before starting the usability test.

The goal of UX-testingHypothesesTasks
Detect the root cause of the 50% drop in sales and understand why the well thought out promotion strategy has yielded a negative result
  • Technical problems.
  • Mistakes in SEO-optimization
  • Inadequate advertising
  • Low-quality content
  • Deliberate actions of the competitors
  • Conduct the technical audit and define the possible cause of the malfunction.
  • Double check the semantic kernel and keywords.
  • Contact the advertiser and double check the message of the published ads.
  • Analyze the block report and assess the quality of the published articles.
  • Check YouTube channels and forums for negative feedback or criticism.

Stage 2

To conduct a quality UX-testing, it is absolutely necessary to narrow down the focus and test the hypotheses one by one. Trying out all hypotheses at once will only bring confusion and hinder you from detecting the actual root cause of the problem. Let’s get back to our example. After the preliminary testing of the formulated hypotheses, we have arrived at the following conclusions: three issues were not detected, one obvious problem has occurred, and one hypothesis remains questionable.

Issues that have not been detectedThe existing problemThe hypothesis that needs further testing
Deliberate acts of the competitors. This hypothesis was not proved because the UX-testing tools have allowed for quick analysis of the popular resources for any negative action undertaken by a third party. No such information was provided.Low quality content. The content of the website is divided into three sections, namely, ‘Blog,’ ‘Product cards, and ‘News.’
The majority of the ‘Product cards’ lack product descriptions, images, or videos. Instead, there is a list of characteristics that are supposed to advertise the product. The ‘Blog’ section contains very few posts. Besides, each of the articles published in this section abounds in mistakes and is hardly informative to the reader. The ‘News” section provides only some basic information about the company, which is very generic and boring.
Technical issues. On some gadgets, the page download time has increased, and the layout is different from the one designed originally. . Apart from that, some videos cannot be played on tablets and smartphones.
Inadequate advertising settings. The advertisers provided their feedback and confirmed that the ads were appropriate.
Incorrect SEO-optimization. SEO-professionals  have checked the enquiries that have brought the website to Google and Yandex Top 3. All procedures were carried out properly, and relevant keywords are used for website promotion.

Stage 3

When the main hypotheses have been identified – it’s high time to choose the relevant UX-testing methods and try them out on the target audience.  Let’s name the most popular methods and see how they apply to our hypotheses.

  1. Corridor testing entails a group of users who take turns to test the product or website functionality, while the moderator (the person who organizes the test) records the process via a user test application. When the task is completed – the users’ actions are analyzed and the results are used for improving the UX.
  2. Remote moderated usability testing – in this case the moderator talks to respondents (the target audience) personally via Skype, telephone or any other communication channel and collects the necessary information.  Further, the interviews are documented and used for usability improvement.
  3. Remote unmoderated usability testing entails the tests conducted via specific testing applications without the participation of the moderator. The application offers a range of tasks which the respondents are expected to complete the way they see it fit. For example, the respondents may be asked to find the contact details of the website owner. When the task is finished, the moderators record the problems that have occurred and use these reports to enhance the website usability.
  4. A/B testing – involves the creation of several versions of the same product, whereby the user is asked to choose the best variant. Read more about A/B testing in the article on website conversion optimization.
  5. Expert review presupposes engagement of a professional who can spot any problems without turning to the target audience. For example, if you have to analyze an online furniture store website, seek advice from an experienced furniture seller, who can throw light on some nuances that will help improve the website conversion rate.

In our opinion, the most suitable way to test the ‘poor content’ hypothesis is the remote unmoderated testing, while spotting of possible technical issues will be delegated to experts, who will provide an expert review. Needless to say, the choice of the testing method largely depends on the hypothesis, so you need to find the most relevant one for each scenario.

UX-testing methodsThe tested hypothesisThe information to be learned
Remote unmoderated usability testingLow quality content hypothesisThe user behavior will show which sections of the website they visit most often, how long it takes them to study the content, which articles they close at once, and which of them evoke more interest.
Expert reviewTechnical issues hypothesisThis way we can quickly check how the user switches from page to page, what factors hinder convenient work with the website and how these issues can be addressed.

Stage 4

After the relevant hypotheses and their testing methods have been chosen, the testing itself takes place. There are three possible scenarios: the hypothesis is proved, dismissed or proved partially.  In the first case, one can start tackling the problems immediately. In the hypothesis is dismissed – one should double check the goals of UX-testing and come up with new hypotheses. Finally, if the hypothesis is proved only partially, new hypotheses need to be tested.

The hypothesis was provedThe hypothesis was dismissedThe hypothesis was partially proved
If the users leave because of poor content, it is necessary to hire a content editor, who will take charge of the content quality and make the articles more useful to the target audience.If the content is not the website’s weak spot, the low conversion rate is probably caused by the technical flaws in the design. The visitors find it inconvenient and leave the website.The best way out is to hire an editor, adjust the content of the website, and test new hypotheses until all issues are addressed effectively.
If the visitors cannot use the website because of it being inadequately displayed, developers should be hired, who will fix all the underlying issues.If all elements of the website are displayed correctly and do not irritate the users, it would be wise to double check the content and observe the users’ behavior.In this case, developers need to be be hired to fix the bugs in the code, while at the same time new hypotheses should be tested. Carry out the procedure until all problems are solved.

Stage 5

After troubleshooting has been completed, it’s time to do the final UX-testing. In essence, this is just another usability test that helps to determine whether all processes have been carried out effectively. If no new faults are detected in the course of this test, the usability testing is considered successful. However, if new weaknesses are identified, one should get back to the beginning and repeat the procedure once again. It would be irrational to ignore the final test because without it you will not be able to find out whether the website can yield positive results.

At this point, many mistakes occur due to the users’ lack of awareness about the process of usability testing and little to no experience in this field.

Thus, UX testing is often outsourced to professional UX-agencies, which come up with a detailed usability testing plan and provide a comprehensive report after completing the procedure. This report contains suggestions in regard to usability testing, which can help the website owner to improve its performance.  However, it should be noted that the usability test report is fairly useless if the recommendations contained in it are not implemented systematically.

A guide to DIY usability testing

The importance of UX-testing is so immense that it should be done regardless of one’s experience and budget. For this reason, let’s find out how to conduct a usability test independently. We have made a checklist that can be followed by any website owner.

Step 1

Before you even start your UX-testing, correct the most common UX design mistakes. To learn more about them, read our article “TOP 10 UX Design Mistakes” and introduce the necessary adjustments to your website.

Step 2

Look through the previous section and formulate the objective of your research. After that, pick up the hypotheses and outline the tasks that will help to test them. To simplify the work process, use free UX-testing tools.

Step 3

You will hardly know how to carry out the UX-testing of a website without the basic conversion metrics at hand. That is, if you did not estimate the effectiveness of your website before the usability testing, the audit and the subsequent adjustments will have little practical value. You will not be able to determine whether the website has become more effective or it is better to discard all the recent changes immediately (such situations can occur as well).

Step 4

A simple lifehack: if you do not know how to test your website for convenience, ask your audience. Gather feedback from customer responses, comments, and posts in social media. Watch out for users’ remarks and implement their recommendations.

Step 5

Look through the article “20+ Websites with Disastrous Usability” The common issue shared by these websites is a large number of attention grabbers – images, buttons, bits of text, and other elements that distract the user from the main purpose of the website. And now take a look at «TOP-60 Restaurant Websites with Great Design”. All these websites are well-planned and aimed at a specific action. So, the conclusion to draw is: use fewer attention-grabbers, but focus on the target action instead.  Ideally, the user should be prompted to do one target action per page.

Step 6

Study the ready-made usability test reports and try to implement the methods that match your website’s needs.

Step 7

Do not hesitate to get inexpensive offline expert help. For example, if you have are an online electronics retailer, find an offline store similar to yours and talk to the sales assistant there. Try to find out about the customers’ interests, their needs, wants, and concerns. In case an opportunity arises, try working at that store and establish the contact with the target audience. Great knowledge of the audience is the main prerequisite of a perfect usability test.

UX-Testing Software

In 2018 smartphones have beaten laptops in terms of the traffic reached, and now 52% of the users prefer mobile internet. For this reason, usability tests use two types of tools: some tools will come in handy when you test the usability of a desktop version of your website, while others will help to evaluate its mobile UX.

The statistics below show the share of web traffic reached from different devices as of January 2018

Статистика использования девайсов для выхода в интернет по состоянию на январь 2018 года.

WEBSITE UX-TESTING APPS

ApplicationTests that can be done
Google AnalyticsIs a multifunctional web analytics tool. It allows for tracking of website traffic, observe the target audience behavior, and identify the traffic sources. It will also help you understand which pages the users stay on for the longest time. This information will tell you a lot about your website visitors: their interests, likes and dislikes, as well as the chances of their coming back.
PageSpeed InsightsWith this tool you will be able to track the page download speed of your website both on desktop and mobile devices. The test also returns a report highlighting the problematic pages and optimization recommendations.
PlerdyThis service offers a website heatmap that helps to analyze the users’ online behavior. Also, with Plerdy you can easily redesign your website, optimize the published content, analyze calls to action, boost your conversion rates and perform a range of other tasks.
AskUsersUse this tool to directly contact the users of your website and ask them questions regarding its work.
User TestingTest a website or an app remotely: you develop a technical task → indicate what needs to be tested → activate the targeting option → build your target audience → send the task to the User Testing users → receive a UX-test with video or audio commentary.
Usability ToolsUsability Tools allows you to record the users’ online behavior in the form of a video.
Usability HubThe tool supporting the five-second test, click test, as well as questions, navigation, and preferences tests.
Optimal WorkShopThis is a complex tool identifying user behavior based on three tests: the tree testing (evaluates the navigability of a website), card sorting test (identifies the users’ expectations and the way they make decisions while browsing your website), and a click map test (assesses the design and attractiveness of separate website elements or pages).
Fend-GUIYou can use this tool to create an attention map and understand how (in what order) the information presented on the web page is perceived by users.

MOBILE UX-TESTING APPS

Software usability test applicationTests that can be done
CrashlyticsThis application allows one to track users’ complaints as well as system errors that caused the mobile app to crash.
AdjustMeasure the demand for the app in mobile applications stores, identify the traffic sources,  track various conversion indexes, identify the average transaction value, and analyze the user behavior on the platform.
AppsFlyerThis app helps to assess the effectiveness of an internet or TV marketing campaign.
HockeyAppUse this software to analyze user behavior inside an application, timely spot and address system errors, and to collect statistics and feedback from the platform visitors.
Sensor TowerThis software has been specifically developed to promote applications in Google Play и App Store.
WoopraThis app helps online retailers to build their sales funnel. This is a great tool for gathering and segmenting the registered users’ data.
AmplitudeAmplitude allows you to observe in real time how the audiences interact with your product.
AppLyzerWith this app you can form the semantic kernel and filter the relevant enquiries only.
ClicktaleThis is a convenient tool for making a heatmap and clicktracking.

To ensure a quality UX-testing – make sure you properly organize a simultaneous assessment of both the desktop and the mobile versions of the website. Otherwise, the website may be displayed inadequately on some devices, which will translate into loss  of audience. In 2019, losing audience can have a detrimental effect for the business, which practically means being buried by the competition. So, don’t let it happen.

Nota Bene

Now you know what usability testing is and what important role it plays for the health of your business. We hope that you will use this service systematically and garner your users’ support.   Before we get to our final remarks, let’s revisit the main points of this article:

  1. Website usability testing is a complex procedure that is aimed to evaluate the website’s ease of use and technical functionality.
  2. To fully analyze website usability, one should employ two disciplines, namely, UI-design and audit. UI-design is responsible for the visual presentation of a website and its ease of use, while audit is associated with the assessment of its technical elements.
  3. UI-design and audit overlap when it comes to usability (UX) testing. Usability test entails product improvement based on the target audience’s feedback: you ask the users about the problems they may have experienced while using your website → collect their responses →  and then try to address the issues.
  4. If you disregard UX-testing, any other attempts at website promotion will hardly be effective: $1 spent on usability testing translates into $100 in ROI in future.
  5. Usability testing is a complex procedure usually carried out by professionals at UX agencies.
  6. However, doing UX-testing without professional help is a difficult task. One should be able to formulate proper goals, single out hypotheses, plan the tasks and choose the website testing methods. After that, one should carry out the test itself, evaluate the results, conduct the final test, assess the results again, address the identified problems and evaluate the effectiveness of the changes that have been introduced.
  7. Since 2018, most of the world web traffic is reached through smartphones, so UX testing for mobile applications has become extremely important.

Feel free to share your thoughts about UX-testing in the comments: is it a useful thing to do or is it a mere marketing trick?

TOP 50 Resources for Web Design Inspiration

TOP 50 Resources for Web Design Inspiration

GO
ux audit apple

Sample usability audit of apple.com

GO
Сравнение карт кликов Plerdy, Яндекс.Метрики и Hotjar

Comparison of Plerdy, Yandex.Metrica, and Hotjar Heatmaps

GO
22 самых дорогих интернет-магазинов мира

22 Most Expensive-Looking Online Stores in the World

GO
топ веб дизайнерів

Top 30 Best Web Designers of the World

GO

20+ Websites With Disastrous Usability

GO
How Usability Influences Sales

How Usability Influences Sales in an Online Store

GO
top-10 ux design mistakes

TOP 10 UX Design Mistakes

GO
The Practical Benefits of the Smart Form Builder

The Practical Benefits of the Smart Form Builder

GO
Top 60 Restaurant Websites with Great Design

Top 60 Restaurant Websites with Great Design

GO
Blog Categories
Articles from the blog