lectures.alex.balgavy.eu

Lecture notes from university.
git clone git://git.alex.balgavy.eu/lectures.alex.balgavy.eu.git
Log | Files | Refs | Submodules

usability-principles.html (2672B)

      1 <html>
      2 <head>
      3     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/highlight.min.js"></script>
      4     <script type="text/javascript" async src="https://cdn.jsdelivr.net/gh/mathjax/MathJax@2.7.5/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
      5     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/styles/default.min.css">
      6     <link rel="Stylesheet" type="text/css" href="style.css" />
      7     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      8     <script>
      9       document.addEventListener('DOMContentLoaded', function() {
     10         document.querySelectorAll('pre.code').forEach(function(item) {
     11           hljs.highlightBlock(item)
     12         })
     13       });
     14     </script>
     15     <title>usability-principles</title>
     16 </head>
     17 <body>
     18 <style type="text/css">
     19 nav a {
     20     text-align: left;
     21 }
     22 nav #name {
     23     text-align: right;
     24     float: right;
     25     font-style: italic;
     26 }
     27 </style>
     28     <nav>
     29     <a href="index.html">Index</a>
     30     <span id="name">Alex Balgavy</span>
     31     </nav>
     32     <hr>
     33     <div class="content">
     34     
     35 <div id="Usability principles"><h2 id="Usability principles" class="header"><a href="#Usability principles">Usability principles</a></h2></div>
     36 <p>
     37 Nielsen usability principles:
     38 </p>
     39 <ol>
     40 <li>
     41 Visibility of system status
     42 
     43 <ul>
     44 <li>
     45 always keep user informed about what's happening
     46 
     47 <li>
     48 like a progress bar
     49 
     50 </ul>
     51 <li>
     52 Match between system and real world
     53 
     54 <ul>
     55 <li>
     56 speak the users' language
     57 
     58 <li>
     59 use words, phrases, concepts familiar to user
     60 
     61 </ul>
     62 <li>
     63 User control and freedom
     64 
     65 <ul>
     66 <li>
     67 allow users to easily escape from places where they accidentally appeared
     68 
     69 <li>
     70 like 'emergency exits'
     71 
     72 </ul>
     73 <li>
     74 Consistency and standards
     75 
     76 <ul>
     77 <li>
     78 don't make the user think
     79 
     80 <li>
     81 avoid making them wonder whether different shit is actually the same shit
     82 
     83 </ul>
     84 <li>
     85 Help users recognise, diagnose, and recover from errors
     86 
     87 <ul>
     88 <li>
     89 write errors in plain language
     90 
     91 <li>
     92 suggest a way of solving it.
     93 
     94 </ul>
     95 <li>
     96 Error prevention
     97 
     98 <ul>
     99 <li>
    100 prevent errors whenever possible
    101 
    102 </ul>
    103 <li>
    104 Recognition is better than recall
    105 
    106 <ul>
    107 <li>
    108 make stuff recognisable
    109 
    110 </ul>
    111 <li>
    112 Flexibility and efficiency of use
    113 
    114 <ul>
    115 <li>
    116 provide accelerators invisible to novices
    117 
    118 <li>
    119 give more experienced users more tools
    120 
    121 </ul>
    122 <li>
    123 Aesthetic &amp; minimalist design
    124 
    125 <ul>
    126 <li>
    127 don't include irrelevant or rarely needed information
    128 
    129 <li>
    130 <span id="Usability principles-hide the stuff"></span><strong id="hide the stuff">hide the stuff</strong>
    131 
    132 </ul>
    133 <li>
    134 Help and documentation
    135 
    136 <ul>
    137 <li>
    138 provide info that can be easily searched
    139 
    140 <li>
    141 give concrete steps that can be easily followed
    142 
    143 </ul>
    144 </ol>
    145 
    146     </div>
    147 </body>
    148 </html>