{"id":12145,"date":"2022-09-06T00:00:00","date_gmt":"2022-09-06T04:00:00","guid":{"rendered":"https:\/\/kryzalid.net\/?p=12145"},"modified":"2024-12-10T14:57:37","modified_gmt":"2024-12-10T19:57:37","slug":"the-12-rules-of-ergonomics-you-shall-apply","status":"publish","type":"post","link":"https:\/\/kryzalid.net\/en\/web-marketing-blog\/the-12-rules-of-ergonomics-you-shall-apply\/","title":{"rendered":"The 12 rules of ergonomics you shall apply\u2026"},"content":{"rendered":"\n
Here are the 12 rules of ergonomics, or the commandments of every UX designer at Kryzalid!<\/p>\n\n\n\n
1. You shall organize information through architecture<\/h2>\n\n\n\n
The menu of your site will allow for the best organization of information. To achieve this, group elements logically and structure them according to key content to help users navigate. Page titles must meet three criteria:<\/p>\n\n\n\n
\n
Meaning:<\/strong> The user should easily understand the content they will find.<\/li>\n\n\n\n
Complementarity:<\/strong> The contents should complement each other.<\/li>\n\n\n\n
Exclusivity:<\/strong> Facilitate the user’s choice between two possibilities.<\/li>\n<\/ul>\n\n\n\n<\/figure>\n\n\n\n
2. You shall ensure the visual organization of pages<\/h2>\n\n\n\n
One of the rules of ergonomics concerns optimizing the organization and visual hierarchy<\/strong>. Remember, in a previous article, we introduced the Gestalt theory, which states that you should respect the principles of proximity and similarity, differentiate elements, and provide multiple levels of reading.<\/p>\n\n\n\n
Additionally, it\u2019s always better to avoid an overload of information<\/strong>. Display only the main navigation elements and reduce the number of images or animations.<\/p>\n\n\n\n<\/figure>\n\n\n\n
3. You shall pay great attention to the consistency of the site<\/h2>\n\n\n\n
A website should help users navigate as efficiently as possible<\/strong>. This requires achieving consistency by maintaining the same order of information presentation from page to page, using the same vocabulary and icons, the same presentation formats, etc.<\/p>\n\n\n\n
<\/div>\n\n\n\n<\/figure>\n\n\n\n
4. You shall adapt to user conventions<\/h2>\n\n\n\n
In ergonomics, always aim to design a solution perfectly adapted to the user, which often means adhering to certain conventions<\/strong>! For example, it’s common to place the logo in the top left corner of the screen, the cart in the top right, etc. The vocabulary used is also crucial: terms like “home” and “contact” immediately make sense to the user. The same applies to interaction objects and color codes.<\/p>\n\n\n\n<\/figure>\n\n\n\n
5. You shall provide all information at the right time<\/h2>\n\n\n\n
Users must have access to all the information<\/strong> they need when they need it: text to help them make decisions, visual elements to guide them in navigation, etc. Be careful not to remove important information, like the price of an item once it’s in the cart. Similarly, information should be provided at the most opportune moment: nothing is more annoying than having to create an account to see shipping fees when it could have been done earlier!<\/p>\n\n\n\n<\/figure>\n\n\n\n
6. You shall carefully choose each element<\/h2>\n\n\n\n
Understanding is essential on a website. That\u2019s why it’s important not to rely solely on icons, to choose a precise and user-oriented vocabulary<\/strong> that is perfectly understandable. Often, it’s better to opt for conventional terms to avoid any ambiguity.<\/p>\n\n\n\n<\/figure>\n\n\n\n
7. You shall guide the user step by step<\/h2>\n\n\n\n
On a website, the user must be constantly guided and assisted<\/strong>. Therefore, ensure that various elements are well-organized and perfectly visible, highlight clickable items, input fields, etc. And above all, make sure nothing is misunderstood!<\/p>\n\n\n\n<\/figure>\n\n\n\n
8. You shall anticipate user errors<\/h2>\n\n\n\n
Users are human and can make mistakes! To handle potential errors<\/strong>, for example, in a form:<\/p>\n\n\n\n
\n
Indicate required fields,<\/li>\n\n\n\n
Provide clear labels to avoid confusion,<\/li>\n\n\n\n
Properly size fields to be filled out,<\/li>\n\n\n\n
Distinguish certain buttons like “cancel” and “submit,”<\/li>\n\n\n\n
Request confirmation before any canceling action, etc.<\/li>\n<\/ul>\n\n\n\n
Finally, every error message should be explained, easily noticeable, and courteous to avoid offending the user!<\/p>\n\n\n\n<\/figure>\n\n\n\n
9. You shall help the user get straight to the point<\/h2>\n\n\n\n
![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/1-architecture.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/2-organisation-visuelle-des-pages.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/3-coherence.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/4-conventions-1024x671.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/5-information.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/6-comprehension.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/7-guidage-1024x986.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/8-gestion-des-erreurs.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/9-rapidite.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/10-liberte-1024x701.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/11-accessibilite-1024x553.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/kryzalid.net\/wp-content\/uploads\/2022\/08\/12-satisfaction-utilisateur-1024x806.png\")
<\/figure>\n","protected":false},"excerpt":{"rendered":"