Χρώμα

Το χρώμα είναι ένα εξαιρετικό εργαλείο για τη μεταφορά πληροφοριών σε μία διεπαφή χρήστη. Για παράδειγμα, μπορεί να χρησιμοποιηθεί για:

  • ενίσχυση της εμφάνισης και της αίσθησης μίας επιφάνειας εργασίας προστίθοντας ένα θέμα
  • τονισμός μίας δυναμικής ειδοποίησης σε μία εφαρμογή διαχείρισης συστήματος
  • έμφαση ενός στοιχείου σε μία μακρά λίστα για να επισπεύδει τη σάρωση
  • προσθήκη λεπτομερειών αισθητικής ευχαρίστησης σε ένα εικονίδιο

However, color should always be regarded as a useful addition to your design, not as a necessity. Never depend upon colors alone to display important information, and keep in mind that if colors cannot be perceived correctly (for example, the user has an 8-bit system, or is color-blind), your application should still be usable.

8.1.1. Παλέτα

A 32-color palette has been developed for the GNOME desktop. The palette may be downloaded from http://developer.gnome.org/projects/gup/images/ximian-palette. To use it in The GIMP, save it to your ~/.gimp_1.2/palettes folder, and restart The GIMP. A single, consistently-used palette helps give a unified look and feel to the desktop while minimizing visual distractions. If you need a color that is darker or lighter than the colors in this basic palette (e.g., for anti-aliasing), choose a color that is closest to the hue you need, then darken or lighten as required.

Φιγούρα 8-1Η βασική παλέτα του GNOME 32-χρωμάτων
Table 8-1Τιμές RGB και δεκαεξαδικές για τη βασική παλέτα
Χρώμα Description RGB Hex Χρώμα Description RGB Hex
Βασικό 3Δ έντονο 234 232 227 #EAE8E3
Βασικό 3Δ μεσαίο 186 181 171 #BAB5AB
Βασικό 3Δ σκούρο 128 125 116 #807D74
3D με σκιά 86 82 72 #565248
Έντονο πράσινο 197 210 200 #C5D2C8
Μεσαίο πράσινο 131 166 127 #83A67F
Σκούρο πράσινο 93 117 85 #5D7555
Πράσινο με σκιά 68 86 50 #445632
Έντονο κόκκινο 224 182 175 #E0B6AF
Μεσαίο κόκκινο 193 102 90 #C1665A
Σκούρο κόκκινο 136 70 49 #884631
Κόκκινο με σκιά 102 56 34 #663822
Έντονο μοβ 173 167 200 #ADA7C8
Μεσαίο μοβ 136 127 163 #887FA3
Σκούρο μοβ 98 91 129 #625B81
Μοβ με σκιά 73 64 102 #494066
Έντονο μπλε 157 184 210 #9DB8D2
Μεσαίο μπλε 117 144 174 #7590AE
Σκούρο μπλε 75 105 131 #4B6983
Μπλε με σκιά 49 78 108 #314E6C
Δέρμα προσώπου έντονο 239 224 205 #EFE0CD
Δέρμα προσώπου μεσαίο 224 195 158 #E0C39E
Δέρμα προσώπου σκούρο 179 145 105 #B39169
Δέρμα προσώπου με σκιά 130 102 71 #826647
Τόνος με κόκκινο 223 66 30 #DF421E
Τόνος με σκούρο κόκκινο 153 0 0 #990000
Τόνος με κίτρινο 238 214 128 #EED680
Τόνος με σκούρο κίτρινο 209 148 12 #D1940C
Τόνος με πράσινο 70 160 70 #46A046
Τόνος με σκούρο πράσινο 38 199 38 #267726
Άσπρο 255 255 255 #ffffff
Μαύρο 0 0 0 #000000

8.1.2. Απόχρωση, φωτεινότητα, αντίθεση

Users with vision disorders, such as color-blindness or low vision, require alternatives to default settings. A good user interface anticipates these needs by providing customizable preferences and support for accessible themes. Even better is an application that is already configured with carefully-chosen color and contrast defaults.

An estimated 11% of the world population has some sort of color-blindness. Those affected typically have trouble distinguishing between certain hues such as red and green (deuteranopia or protanopia), or blue and yellow (tritanopia). Therefore it is necessary to allow the user to customize colors in any part of your application that conveys important information. This means that your application must effectively convey information using just the colors from any theme that the user chooses.

A useful tool for reviewing information about color-blindness and checking legibility of images for color-blind users is Vischeck, an online tool that simulates the way an image or a website might appear to a user who has deuteranopia, protanopia, or tritanopia.

Φιγούρα 8-2How the earth looks to a user with normal color vision (left), deuteranopia (middle), and tritanopia (right). (Images from http://www.vischeck.com).

Other users have more problems with contrast levels rather than hue on their screen. Some users require a high level of contrast between background and foreground colors, such as black on white, white on black, or some other high-contrast combination. Others can experience discomfort unless they use low-contrast settings, such as gray text on a lighter gray background.

You can meet these needs by ensuring your application supports the accessible GNOME themes (found in the gnome-themes module in cvs), which include high and low contrast themes, and large print themes. This means you must supply default and large sizes of high-, low- and regular-contrast icon sets with your application.

Κατευθυντήριες γραμμές
  • Use the GNOME color palette. If you need a darker or lighter shade, start from one of the colors from the palette and darken or lighten as needed.
  • Do not use color as the only means to distinguish items of information. All such information should be provided by at least one other method, such as shape, position or textual description.
  • Ensure your application is not dependent on a particular theme. Test it with different themes, especially high and low contrast accessibility themes, which use fewer colors, to ensure your application respects the settings. For example, all text should appear in the foreground color against the background color specified in the chosen theme.
  • Select colors carefully. When they need to be recognizably different, select the light colors from orange, yellow, green or blue-green, and darker colors from blue, violet, purple or red, as most people affected by color-blindness already see blue, violet, purple and red as darker than normal.