1. Websites with good heuristics Irene Wachirawutthichai

2. Recognition rather than recall The options and its corresponding price is visible to the user without clicking through or hovering over it. The overall layout and labeling follow platform conventions; there is very minimal learning needed to understand the page. Consistency and Standards The price and the options are presented in a consistent layout/shape. The information of the item is limited to the main space and the action buttons to the right.

3. Aesthetic and Minimalist Design The layout of the page is cleanly divided into 2 columns with the content in the main column. The color scheme is monochromatic, which minimizes distraction. Instead of having lines or color differences, each post is divided using appropriate use of spacing and text sizes and text style (e.g. bold).

4. Error prevention The filters are all predetermined, so users just need to choose which one. The search results also changes as the user types, even without pressing the enter key, allowing the user to see if the action they’re doing is still correct. Visibility of system status The choice of filters are highlighted with a different color as they are selected and remains that way. This informs the user the specifications of the current results.

5. Visibility of system status As the user adds an item to cart, the system provides feedback by showing the cart contents as a pop-up. Not only does it tell the user that the current item has been added, it also tells what else they had in the cart at the moment. The ‘size’ also remains selected and the top left navigator tells the user where in the page they are.

6. Websites with bad Heuristics

7. Visibility of system status On this page, the website doesn’t tell the user whether it is open for registration or not. The real time enrollment is not visible on this page either, despite being a crucial information for the target user group. User control and freedom It is very hard to navigate through the different pages that provide more information about the courses offered. There is no direct way to access the course details page without clicking on one of the hyperlinked course name. Match between the system and the real world The word ‘enrollment summary’ does not immediately ring a bell when I first used it. It needs time to get used to. The SLN numbers are hyperlinked but there’s no indication of where the user will be directed to.

8. Aesthetic and Minimalist Design The information is very cluttered. Even though all the options are visible, it distracts the user from reading the essential components of the webpage because there’s just too many things in one space. The sub topics are also not very well distinguished from the bigger topics as the font size and color is very similar.

9. Error prevention The website’s search engine does not provide suggestions as the user types in the keyword for searching. The system also does not explicitly inform users what category they are searching in either. (It is left in default.) Help users recognize, diagnose and recover form errors The website’s search engine does not provide suggestions if the query doesn’t bring back any result. Even if there is a one letter difference, the system won’t recognize what the user is searching for and can’t give a suggestion either (like that of Google’s ‘did you mean …”).

10. Consistency and Standards, User control and freedom When the user goes to check the shopping cart, the website directs the user to the page where there are no menu tabs. The only way to go back to the main page using only the website’s navigator is to click ‘Keep shopping’. It does not provide a lot of user control and fails to provide a consistent navigating tool and appearance.