CityHost.UA
Help and support

Usability of the site and a checklist for them

 9297
25.09.2019
article

In the previous publication, we already considered what the usability of the site is and how it affects the ranking. Now let's analyze how to correctly analyze a web resource for ease of use.

Below is a site usability checklist specifically for this. By following it, you will be able to understand how user-friendly the web resource is and identify flaws that need to be corrected.

What is a site usability checklist? This is a list of points to pay attention to. Or, in other words, the step-by-step instructions are simple and understandable even for beginners.

Basic requirements for site usability

  1. Fast page loading. Users will not have to wait long for the site to open. They will wait a couple of seconds - and leave him. You can check the speed of downloading a web resource using any specialized service. For example, PageSpeed Insights from Google.
  2. Cross-browser layout. The site should display normally in any browser. And on any monitor regardless of screen size.
  3. Adaptability for mobile devices. The site must be displayed correctly on any smartphone or tablet. After all, the share of mobile users is more than 50% (that is, users visit websites more often from smartphones than from PCs).
  4. The same style. The web resource interface (header, menu, footer) is made in the same style.
  5. Reloading the page when selecting a language. Opt out of being redirected to the main page when choosing a different language on a multilingual site. The page should just reload in the same window.
  6. Location of the company logo. The optimal location is the upper left corner. Moreover, the logo must be clickable.
  7. Page structure. Each page should be filled in such a way that users determine the site's theme on the first screen (by slogan, images, headings).
  8. Company contacts. They must be indicated in the header and footer of the site.
  9. A favicon that is easy to remember. It is displayed not only in the browser tab, but also in the Yandex issue.
  10. Easy closing of pop-ups. This minimizes user irritation.
  11. No background music. Refuse to turn on music automatically. It's just annoying.
  12. "Up" button. It must be on the site - for the possibility of fast scrolling up.
  13. The 404 page is fixed. The better it is designed, the higher the probability that the user will continue to explore the site.

Assessment of visual perception

Assessment of site usability for users is performed as follows:

  1. Determine the overall impression of the web resource. The design should be pleasant and not repulsive.
  2. Check that there are no colors that are too bright. Their use is allowed, but in moderate quantities.
  3. Make sure that the pages are not cluttered with different elements. But at the same time, they are not empty.
  4. Check the display of blocks. Make sure that they do not move, do not climb out of the frame and are located approximately at the same level in relation to each other.
  5. Check that there is no empty space between the blocks. Especially in the lower part. Otherwise, visitors will decide that the page has ended and there is no point in scrolling further.
  6. Make sure the buttons and blocks are the optimal size.
  7. Check the number of elements with animation. It is recommended to abandon it (or use it at a minimum).
  8. Make sure all important information is in the top left corner. According to statistics, this is where users look most often.

Analysis of web resource usability by navigation and search tools

Check sheet for evaluating the usability of buttons and links:

  1. If you move the cursor over the active element, it will change to a "hand".
  2. Each button is clickable and has a clear description.
  3. The action cancellation buttons are located at a distance from the action confirmation buttons (to exclude accidental pressing).
  4. The user must understand where a specific link leads (due to its anchor or text next to it).
  5. Links should have an optimal length and a standard appearance (blue color, after clicking - changes to purple).

Checklist for checking the usability of a web resource for navigation:

  1. The menu is available from any page. And it is always located in one place.
  2. In the mobile version of the site, the menu is hidden, and appears when you click on a special icon.
  3. There are "breadcrumbs" on the site, by which users will understand where they are. And if necessary, they will be able to return to previous levels.
  4. The "Payment Terms", "Delivery Terms", "Contacts" pages are easily accessible.
  5. Menu items are concise and start with a capital letter.
  6. By the name of the H1 header, visitors should understand what the page is about.
  7. The internal link is well thought out, without dead ends. For this, each page should have at least 2-3 links leading to other products, sections, articles.

Checklist for checking the usability of the search form:

  1. There is only one search field. And it is placed in the upper right corner.
  2. When LMB is pressed, the field becomes active. A cursor is displayed inside it.
  3. The search is easy to use (it starts when you press a special icon or the Enter button; queries with errors are corrected automatically, etc.).
  4. When you enter the first letters, a list of relevant queries is displayed.
  5. Full information about the results (number of pages, etc.) is displayed.
  6. In the absence of search results, the visitor is offered alternative solutions (enter another query, etc.).
  7. The site has an advanced search (if you need it).

Checklist for checking the usability of text content

  1. The text is divided into paragraphs, has subheadings, bulleted or numbered lists. Overall, an easy read. A separate plus will be the presence of images and tables.
  2. The font color does not blend with the background.
  3. The text is written not for SEO, but for people. Contains a maximum of useful information.
  4. Numbers in the text are written in numbers. And those that are too large are separated by spaces for better understanding (for example, 1,200,500).
  5. Headings are concise, clear, convey the essence of the page.
  6. If various content is published in the blog, it should be divided by topics.
  7. After the text comes a block with other articles to interest users to stay on the site.
  8. The text contains links to other articles or product cards, categories, subcategories.
  9. The same font (ideally 12-16 pixels) is used for all pages.
  10. The font is easy to read at any scale of the page.

Checklist for checking the usability of images and videos:

  1. Only high-quality images are used.
  2. Photos are selected according to the content of the page and carry a certain semantic load.
  3. The images must be the same (in size, background, perspective).
  4. The photo can be viewed in full resolution (if necessary).
  5. Videos on the site can be managed at your discretion: turn on, pause, turn off the sound .

Analysis of the usability of means of feedback and communication with buyers

  1. Contact details are provided in text form, not as an image (so that they can be copied if necessary).
  2. Copying information is allowed on the "Contacts" page (that is, there is no copy protection).
  3. Contact details are placed in the header and footer (so that they are visible on any page).
  4. There must be means for quick communication (online consultant, callback form, messengers).

You also need to make sure that the "Contacts" page has:

  • exact address;
  • phone numbers (ideally - of different operators);
  • mailing address;
  • work schedule;
  • links to social networks;
  • feedback form;
  • location of the company on the map;
  • a road map and a photo of the building (especially if the office is in a hard-to-reach place).

Usability of feedback forms

  1. The form is conveniently located on the "Contacts" page.
  2. You don't need to register to send a message - it's enough to specify the email or phone number where the answer will come. If the user accidentally closes the form, the text should be saved.
  3. Notifications about the user's response are sent to the mail/phone.

Online consultant

  1. The chat icon is clearly visible, but at the same time it does not cover the main content.
  2. You can send messages at any time of the day (the user can see whether the consultant is online or not).
  3. If the consultant is not online, the user is invited to leave his data to contact him during working hours.
  4. The real photo of the store employee is displayed in the online chat.

Comment

  1. Users should be able to comment on articles and other reviews without registration. If you accidentally close the page, the typed message is saved.
  2. To avoid false reviews, you can add quick authorization through social networks.

Analysis of the usability of product categories of the online store

  1. No more than 15-20 products are displayed on the page.
  2. The visitor has the opportunity to choose the number of products that will be displayed in the list.
  3. Having separate sections with popular/new models is recommended.
  4. The product must contain a photo, name, price, an "Order" button and a sale icon, if any.

Checking the usability of filters

  1. The visitor can choose various filtering options, and only then see the result.
  2. The "Show" or "Apply" button is clearly visible.
  3. Interdependent filters synchronize quite quickly. And without reloading the page.
  4. Filters with no results are inactive (to exclude a null result).
  5. The user sees the number of products matching the selected filters.
  6. The URL of the page changes dynamically when you select filters.
  7. There must be a button "Cancel all" (to display a standard list of products).

Sorting accuracy

  1. Popular products are displayed first in the list, unavailable products are displayed last.
  2. The user can create individual sorting (from cheap to expensive, novelties, etc.).
  3. The visitor should be able to see which sort is currently in use.

A normal engine is needed to implement all these points. We have previously considered which CMS to choose for an online store .

Checking the usability of registration forms and the shopping cart

Checklist for checking the usability of the order form:

  1. The number of mandatory fields should be minimal (and all of them should be placed in one column).
  2. Mandatory fields should stand out against the background of others.
  3. The password field should display the number of characters entered.
  4. Filling out the form should be convenient (you can move to other fields with the cursor or keys, filled lines are visually different from unfilled ones).
  5. All points are described in detail, if necessary, there are hints.
  6. The information entered by the user must be checked. If a field is filled in incorrectly, a message is displayed where and what error was made.
  7. If there are errors, the data entered in other fields will not be deleted.
  8. Before sending the form, the user has the opportunity to edit any field.

Usability of the registration form

  1. The user must understand the benefits of registering on the site.
  2. Ideally, the user's e-mail will be automatically "remembered" instead of the login.
  3. It must be possible to authorize through popular social networks.
  4. Unsubscribing from mailings is done in a couple of clicks.
  5. You can automatically register when making a purchase (so as not to enter the same data twice).
  6. After registration and purchase, a corresponding letter will be sent to your e-mail.

Evaluation of the usability of the shopping cart

  1. The basket has a clearly visible icon and is located in a place familiar to everyone.
  2. When adding products to the cart, it changes, a number appears that reflects the number of products added to it.
  3. There is no extra information on the "Basket" page.
  4. All the necessary information about the products is displayed: name, photos, description, number of units, price and total cost to be paid.
  5. The names of each model are clickable. The client can open any product card directly from the shopping cart.
  6. The user can change the number of products directly in the cart, instead of adding each of them individually.
  7. The visitor is given the opportunity to add or remove a product. The final cost is recalculated without reloading the page.
  8. After completing the purchase, the cart is cleared.

Results

Now you probably understand why it is so important to follow the site usability checklist. Yes, an online store needs reliable and inexpensive website hosting , a convenient design, a well-developed structure, etc. But the importance of site usability for search engine optimization is difficult to overestimate. If users will log in and log out immediately, it doesn't matter how cool the online store is. Behavioral factors will be bad, and search engines will show the web resource far outside the TOP-10. To prevent this from happening, go through all the checklists and try to fix as many flaws as possible on your website.

Was the publication informative? Then share it on social networks and join our Telegram channel. We remind you that you can order cheap hosting from the hosting company CityHost. For technical questions, contact the online chat or call ?? 0 800 219 220.


Like the article? Tell your friends about it: