This post is a recap of Webmontag Bonn (October 21, 2019) that was dedicated to usability testing topics. The speaker explained Think Aloud method in detail. This presentation was followed by a discussion on website usability and accessibility.
This post is a recap of Webmontag Bonn (October 21, 2019) that was dedicated to usability testing topics.
It started with a talk by the organizer, Lina D., that introduced general concepts of usability testing. Normally, it includes figuring out how intuitive a UI is, how users handle their tasks within a UI and what improvements can be possibly made. Some common methods include prototyping, benchmarking, case studies with personas, interviews, eye-tracking, etc. The speaker went into detail regarding the Think Aloud method. This method has the following parts:
- A prototype is built (can be also done on existing software or even on a paper prototype)
- A use case is written (i.e. a task that a user has to fulfill);
- Users are invited for a short interview;
- During ice-breaker, the tester tries to define what customer type the user belongs to;
- A task is presented to the user. They have to complete the task while commenting on their actions;
- The test completes with a short feedback round;
- The whole test lasts about 20 minutes
The talk was followed by a lively discussion about the presented method and also about general usability problems. One question was how to select test participants, especially in the case of a very narrow target group. For example, you can try to reach them in person through industry events, etc. My suggestion was to launch the software and get feedback by analyzing analytics data or making online surveys (though from my experience a lot of people use this survey instead of customer service chat). Somebody also suggested recruiting the participants for one-on-one tests by displaying banners within the software.
There was also a lengthy discussion on accessibility. In the public sector in Germany, there exist accessibility catalogs that constitute minimum requirements for the software to be accepted. However, without proper accessibility testing, such catalogs are only partially helpful. It was noted that a lot of times users with a disability have a completely different workflow interacting with a software or a website.
The last topic that was brought up in the large discussion round was about how to onboard users to new software. For example, through instructional videos, FAQs, pop-up windows within the user interface (UI), or an overlay with explanations of different elements on the first login.
After this, the discussions of the Webmontag continued in smaller groups accompanied by pizza and cold drinks.
In this post, I will discuss compatibility, performance and security testing as important parameters of UX website testing.
In the previous post, I covered the first group of website testing parameters. In this post, I will discuss compatibility, performance and security testing.
- Check how your website is rendered through different browsers and if the website functionality is maintained. You surely do not need to cover all existing browsers, however, the website should be compatible with the essential browsers and browser versions. In case you have visitor statistics from the past, you will know which browsers your visitors use (this may differ e.g. depending on the business you are in). Otherwise, you can use available statistics, such as by W3 (https://www.w3counter.com/globalstats.php). By the way, instead of installing all of the browsers, you can just turn to one of browser testing tools (Browser Sandbox, Ghostlab, etc.)
- Device compatibility at a higher level means mobile-friendly layout and functionality. At a more granular level, it means compatibility with most often used devices, in particular with their screen sizes and resolutions.
- Statistics on operating systems (device platforms) can also be found in your previous web analytics reports, or, in the absence of those, on the Web (here you can also refer to W3 website).
- The last point on compatibility refers to the most common OS, browser and device combinations. Also here you can use professional testing tools without having to buy hundreds of devices.
- Load testing examines how a site would perform at peak loads (extremely high user activity), stress testing may stretch the site beyond its limits or well beyond an expected peak load.
- Take preventive measures in order for a website crash not to happen (use a reliable hosting company, cautiously make code changes) or to restore your website quickly in case it does crash (making a backup, of course).
- Website speed greatly influences not only user experience but also how your website is ranked in the search engines. For determining the site speed you can again turn to Google Search Console, but there are a lot of other tools out there.
- Login security guarantees that only logged in users can view certain areas of your site, but also that each user may only use their unique user name and password.
- Form validation means that only valid information can be entered. It is essential that your website’s code cannot be manipulated through form fields.
- Internal website files should not be available to external viewers unless you want some of them to be accessible (such as .pdf files for download). Also, be careful about any transactions involving file uploads to prevent visitors from uploading executable files.
- SSL enables secure file transfer between a server and a client and is an crucial feature of any up-to-date website. Using SSL causes that the links in the browser appear as https://. In case SSL is not present, website visitors will get a warning from most browsers.
- This is by no means a full list of measures to protect your website from hack attacks, so check logs of important transactions and error messages to identify any security breach attempts. Abnormal user behavior can sometimes be identified through your web analytics data.
Using the framework shown above, you will be able to test most important UX/UI parameters of your website before or just after it goes live.tes
UX/UI testing is an essential step in website development. You should plan for testing early in the process and decide what will be tested in addition to the tools you will use. Remember that you cannot test everything, so prioritization should also take place.
This post is largely based on a Udemy UX and Web Design Masters course and provides a basic framework for website testing.
This table structures testing parameters into several categories. Below I will explain the first three groups of criteria. My next post will cover the rest of the parameters.
- Links to and from pages on the site should point to a correct destination. This includes mailto: and social media links. While you will not be able to control all of the incoming links (links coming from other domains), bear in mind that changing your URLs without a redirect will cause them to become invalid. Pay special attention to internal links, that is cross-linking between the site’s pages.
- Things to check on the forms are default form values, required data format, entry validation and storing entered information.
- Apart from including a privacy statement, test what happens if cookies are actually rejected, blocked or deleted by users. Also check that all information is encrypted and that cookies are not stored longer than required.
- The capability to be indexed by search engines is an aspect less related to the UI/UX of the page, however, it directly affects if and how your website appears in Google Search results. A popular tool to use is Google Search Console. This tool additionally checks the site usability on mobile devices.
- Database connections include correct execution of database queries, reliable data storage and retrieval and correct updating of stored information in case of any changes.
- Navigation clarity means that users should be able to find what they need on the site using the navigation. Furthermore, the navigation should stand out from the rest of content and its elements should be labeled clearly.
- Ideally, the content of the website should match what visitors are looking for but in any case it should be understandable and actionable.
- Distraction in the desired user journeys, such as pop-ups or multiple CTAs should be avoided.
- Calls-to-action express the purpose of your website or, in other words, what you want users to do. In my post on CTAs I covered how they should be formulated and designed.
- The main benchmark of your website’s usability is the ability of users to complete their tasks and their satisfaction with the results and the process.
- Beside the correct rendering of fonts and colors, it is important that the overall readability and visibility of the content are not impacted (an example of bad usability is using light font colors over white background). In addition, consider emotional aspects of the website colors and how they match your brand.
- Proper handling of errors means that they are recognized and assigned to the correct category. For example, an HTTP 404 error message is generated when users try to reach a non-existent page. Other examples of errors can be form submission errors or incorrect content display.
- Error handling also includes displaying appropriate and understandable error messages to the user. In parallel, errors should be logged into the system for review. However, make sure not to include any security-sensitive information into the displayed error messages, e.g. user names.
- It goes without saying that all known errors should be promptly fixed.
In the next part, I will go through testing parameters for compatibility, performance and security.