Tadaaam !
Merci Olivier, tu m'as mis sur la bonne piste :
voilà un outil qui affiche "l'enveloppe" des couleurs accessibles en
fonction de l'autre couleur : Colour Contrast Visualiser
<http://www.stainlessvision.com/projects/colour-contrast-visualiser> de
Thomas Hooper / stainlessvision, en Flash (ou AIR, pas testé).
Il ne faut pas hésiter à cliquer sur les boutons radio H, S et B ou R, G
et B pour découvrir les possibilités. C'est souvent le B de HSB qui est
le plus intéressant, avec le sélecteur vertical (HSB signifie Hue,
Saturation, Brightness ; voir Wikipedia pour les différences avec HSL).
Quand un des 2 carrés de couleur est entièrement hachuré (c'est-à-dire
qu'aucune couleur ne convient), l'outil devient un peu déroutant ; on ne
sait pas trop comment sortir de cet état. Ce n'est pas évident de
choisir une couleur de fond alors que le carré de couleur est
entièrement hachuré / transparent mais a priori le sélecteur vertical
(ou bien cliquer sur un autre bouton radio) est le plus rapide. À
apprivoiser !
J'ai trouvé cet outil par hasard via Google Images (et non Google) en
cherchant à quoi pouvait bien ressembler accessiblecolours.co.uk
qu'Olivier citait.
Archive.org a bien gardé une trace de toutes les pages du site
accessiblecolours
<http://web.archive.org/web/20100917024655/http://www.accessiblecolours.co.uk/>
(c'est rare) mais uniquement le code HTML, pas les CSS ni les images.
Ceci dit il y a des styles en ligne avec les propriétés color et
background-color pour chaque couleur. Pour UNE fois c'est une bonne
chose, haha !
Je vais tenter d'extraire le contenu de toutes les palettes qui étaient
présentes sur le site mais, sans les photos dont elles étaient
inspirées, c'est moins intéressant. L'agence web du créateur du site
existe toujours, il y a aussi moyen de le contacter.
Ph.Vayssière
Le 24/10/2012 16:51, Olivier Nourry a écrit :
Bonjour,
il y a cet outil:
http://www.dasplankton.de/ContrastA/
qui permet de visualiser les 3 seuils WCAG2 en fonction d'un choix de
2 couleurs de base.
C'est pas ce que j'ai croisé de plus intuitif comme interface, mais
(si j'ai bien tout compris) ça colle avec ce que vous cherchez.
Y a ça aussi: http://gmazzocato.altervista.org/fr/colorwheel/wheel.php
Il y a celui-ci qui peut aider à générer automatiquement des palettes,
et faciliter la mesure.
http://colorschemedesigner.com/
Sinon, il y avait ce site qui propose (proposait?) des palettes
accessibles: http://accessiblecolours.co.uk/ mais on dirait bien qu'il
a disparu. Si quelqu'un retrouve une copie...
Cordialement,
*Olivier Nourry*
Twitter: @OlivierNourry <http://twitter.com/#%21/OlivierNourry>
Le 23 octobre 2012 11:22, Philippe Vayssière
<[email protected] <mailto:[email protected]>> a écrit :
Bonjour,
je préfère dire "par dichotomie" c'est plus classe !
Donc non, pas de logiciel à part un logiciel de dessin avec une
"boîte de dialogue des couleurs" proposant à la fois l'affichage
et l'édition en RVB, HSL (saturation et luminosité) et hexadécimal
#123456 plus Color Contrast Analyzer pour re-pipetter ces couleurs
et obtenir le contraste.
Le seul logiciel gain de temps que j'utilise est, sous Win XP,
FileBox eXtender <http://www.hyperionics.com/files/index.asp> qui
permet entre autres de garder CCA /au-dessus/ des autres fenêtres
quand je le souhaite (ou toute autre fenêtre). Et ClipX
<http://bluemars.org/clipx/> un utilitaire de copier-coller
multiple pour avoir les 25 derniers contenus de mon presse-papier
(il en existe bien d'autres).
Une page web qui calculerait, pour une couleur de texte et une
couleur de fond données quelle couleur de texte (ou de fond)
aurait un contraste de 4,5:1 en ne faisant varier que la
Luminosité (cas le plus courant), ça serait une bonne idée,
n'est-ce pas ? :)
Le calcul du rapport de contraste n'est pas très compliqué mais il
faut y ajouter la conversion vers et depuis HSL
<http://en.wikipedia.org/wiki/HSL_and_HSV> avec de la trigo. Et
une interface simple à utiliser, c'est probablement ce qu'il y a
de plus dur à créer.
Un autre "écueil" serait de vouloir systématiquement atteindre
4,5:1 et non dépasser cette valeur ... mais qui ne rêverait de
n'avoir que ce problème ?
Ph. Vayssière
Le 23/10/2012 09:34, CHUZEVILLE Hervé a écrit :
Bonjour Philippe,
Juste une question : as-tu utilisé un logiciel pour déterminer
ces couleurs de manière automatique ou est-ce le résultat d'une
recherche manuelle ? (car dans le cas où c'est trouvé avec un
logiciel, je suis curieux de connaître le nom du logiciel…)
Merci.
*Hervé CHUZEVILLE, webmestre
*Agence de l’Eau Rhône Méditerranée & Corse
*De :*liste_gta [mailto:[email protected]]
*De la part de* Philippe Vayssière
*Envoyé :* lundi 22 octobre 2012 15:37
*À :* [email protected]
<mailto:[email protected]>
*Objet :* Re: [Liste GTA] Couleurs et contraste
Bonjour,
Le 22/10/2012 14:17, Erwan Ripoll a écrit :
Hello la liste,
On me demande de valider une créa pour une refonte de site web dont
l'essentiel des menus sont orange sur fond blanc et les formulaires blanc sur
fond orange....
Nous sommes tous d'accord que ça ne passe pas le critère 3.3, peu
importe le niveau de contraste de l'orange ?
Il n'y a qu'un seul rapport de contraste pour "orange sur blanc"
(#FFA500 sur #FFF) mais on peut diminuer la luminosité du orange.
Le problème, c'est que le résultat est, même sans avoir beaucoup
de goût, particulièrement immo.. euh terne :)
Les exemples suivants sont des textes en couleur (visibles si
vous recevez les mails de la liste GTA au format HTML, avec
Thunderbird et peut-être quelques autres clients mails)
texte en orange (couleur HTML) #FFA500
teinte d'orange rapport de contraste 3:1 #CE8600
teinte d'orange rapport de contraste 4,5:1 #A46A00
texte autre orange #FF6600 2,9:1
teinte de cet autre orange avec rapport de contraste 4,5:1 #CA5100
C'est moins pire dans le second cas semble-t-il.
Ph. Vayssière
PS: avec 9 jours d'avance /trick or treats!/ de circonstance !
De plus, je suis sur Mac. Une idée de logiciels permetant de vérifier correctement le niveau de contraste ?
Merci d 'avance et bonne journée à tous !
Erwan
Responsable de Production Web
AUSTRALIE
_______________________________________________
liste_gta mailing list
[email protected]
http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
