Hello! Welcome to our session on how to easily spot usability flaws on website pages. Before we start, don’t forget to subscribe to our channel, hit like, and enjoy many useful videos about optimizing your website and improving conversions. Plerdy offers numerous tools suitable for various specialists and levels of knowledge; even a business owner can use them—it’s really not complicated. If you have questions during the usability testing video, please ask in the comments. Let’s go!
List of Examples of Usability Testing of E-Commerce Websites
Hidden Essential Elements
Well, it turns out that potential customers who come to this website page won’t see what they need to see. What’s the point of hiding it? It looks like they had a neat idea for website design, but it really doesn’t work well.
Ineffective Filtering Options
Now let’s try filtering something on the website. When you click here, there’s only one country. How is there just one country? This filter makes no sense at all for website usability.
Inconvenient Interface Choices
Okay, there is a size selection here which is fine. We choose this size, but why did they put a cross here? It’s clearly inconvenient for website usability.
The Need for Heat Maps
This definitely needs to be checked with a heat map; it’s simply about analyzing to avoid silly bugs, or the website user will get annoyed. Usability testing helps prevent these issues.
Misleading Cursor Placement
In this case, the potential client will make mistakes here; getting the mouse cursor right here is very tricky for website usability.
Disappearing Selections
Let’s try to select a year now, and everything disappears on the website. So, we had a country selection here. Where did that usability element go? And there was a country here. Where did it go? It’s absurd, totally absurd. Where did it disappear? So now it turns out I need to click here, and then one filter is deleted, and the other remains. They clearly did something wrong in terms of website usability.
Missing Prices and Information
Moving on below on the website, we see the price has disappeared somewhere. Maybe it went to watch the Eurovision final… It’s unclear where that price went; we try to open it on the website, but there’s no information, not even a picture loading.
Reporting Bugs Through Video
Such bugs are very easy to find in video session reports; they show that there is indeed a problem or bug on the website, and it really needs to be improved and optimized. This is a clear bug on the website page. This shouldn’t be done this way because it affects website conversion.
Unavailability of Products
Moving on. Here we have a product on the website. For example, if I want to buy this, I open it, and it turns out this product is unavailable. Wow… how nicely they did it for website aesthetics, and why did I click, wasting my time on this? Not serious. This is very easy to fix if the product is not available on the website:
- First idea: move this product down.
- Second idea: lock the button and write “Out of stock” so you don’t open the popup.
- Third idea: add a field to notify by email about the product’s availability.
- Fourth idea: remove this product if it will never be available. This can all be done correctly.
This is also a bug that needs analyzing for website usability. As I already said, watch the video sessions to see how users behave on the website pages. The heat maps will also show that potential customers will simply be annoyed by this, so it is not right to do as done on this particular website.
Non-Standard Search Field Issues
Here, we actually have a non-standard solution regarding the search field. When we click here, a field opens, and it appears somewhere here, which is not right from one perspective, although I understand what they wanted to do, they wanted to line everything up with the logo. Since there is symmetry below the menu here on the website, it’s okay. But it’s better to do it as Apple does, or as I remember, Samsung also does it, there will be a pop-up, it will not move the whole block down, then it will really be correct.
Inconsistent Button Design and Functionality
The green and green buttons are also not correct because these buttons have different functionality. Yes, there is a frame here, but actually, the functionality is different, so it should also not be done in one-color buttons.
Product Display and User Experience
And here there are three products on the website; it didn’t even make sense to hide them at the bottom, super at the bottom.
Cart Interaction and User Feedback
I’m adding a product to the cart on the website. So everything is okay here, I added it to the cart, it appeared in the cart, and the popup disappeared. More interesting when the message, your product in the cart, continue shopping or place an order. Somehow they ignored this here.
Purchase Process and Empty Fields
Next, in the purchasing process, we move to this page on the website. I see many fields, and it turns out this field is empty. Hmm… why is this field empty? It’s not clear why this field is empty, or do I have to enter the house number here. Well, it’s definitely not clear.
Security and Payment Fields
Ah, at the bottom, they immediately show the fields for payment on the website. I’m not sure how secure this is in this case. Maybe it’s an iframe, then it’s okay.
Promo Code Field Design Flaws
Ugh, how crookedly they did the promo code field on the website. Look how the size is here. Oh, where did it disappear? The validation message, field, and button form—well, it’s clearly visible that different teams worked on this. It’s very crooked, very askew… or no one tested it.
Mobile Version Testing and User Engagement
Let’s also check the mobile version of this website. What strikes me here is that this hamburger icon is non-standard. I think this is a risk, there will be few clicks. As I already said, it’s just testing such a hypothesis with a heat map and micro events to really understand if users often click there. And of course, it’s very easy to run A/B testing.
Summary and Encouragement
Thank you for your attention. I really hope this was useful for you and that you got new information. There will be even more new videos to come, so don’t hesitate to subscribe to the channel and hit like. See you next time.
