Accessibilité : des volontaires ?
1Accessibilité : des volontaires ? Paris Web 2008
Écoutez donc
2Accessibilité : des volontaires ? Paris Web 2008
Plan
CécitéMalvoyanceDéficiences moteursDéficiences auditivesDéficiences intellectuellesDéficiences techniques
Accessibilité : des volontaires ? Paris Web 2008 3
Cécité
4Accessibilité : des volontaires ? Paris Web 2008
Accessibilité : des volontaires ? Paris Web 2008
Cécité : Images
•Devinez !
5
Accessibilité : des volontaires ? Paris Web 2008
Cécité : Images
6
Accessibilité : des volontaires ? Paris Web 2008
Solutions : images
Faire des textes alternatifs pertinents
•<img src="toto.png" alt="…" />
7
Accessibilité : des volontaires ? Paris Web 2008
Cécité : Liens
8
Accessibilité : des volontaires ? Paris Web 2008
Solutions : liens
Faire des liens pertinents
<a href="a.php">Cliquez ici</a><a href="a.php">Découvez Parisweb</a>
9
Accessibilité : des volontaires ? Paris Web 2008
Cécité : Formulaires
•Un formulaire du monde réel
10
Solutions : Formulaires
Associer intitulé et champ<label for="nom">Nom</label>
<input type="text" id="nom">
Accessibilité : des volontaires ? Paris Web 2008
Cécité : Vidéos
12
Accessibilité : des volontaires ? Paris Web 2008
Solutions : vidéos
Faire de l’audio-description
13
Accessibilité : des volontaires ? Paris Web 2008
Cécité : langue
14
Solutions : langue
marquer la langue principale<html lang="de">
signaler les changements de langues<span lang="en">
Malvoyance : vous et moi
16Accessibilité : des volontaires ? Paris Web 2008
Accessibilité : des volontaires ? Paris Web 2008
Malvoyance : Luminosité
Luminosité des couleurs
17
Accessibilité : des volontaires ? Paris Web 2008
Malvoyance : Contraste
Contraste de couleurs
18
Accessibilité : des volontaires ? Paris Web 2008
Malvoyance : Contraste
19
Accessibilité : des volontaires ? Paris Web 2008
Solutions : contraste et luminosité
Éviter certaines combinaisons Contrastes de luminosité > 3:1
Color contrast analyser
20
Accessibilité : des volontaires ? Paris Web 2008
Malvoyance : information par la couleur
21
Accessibilité : des volontaires ? Paris Web 2008
Solutions : information par la couleur
Pas d'information uniquementpar la couleurSites webLes bonnes pratiques
5€<p>Sites web Les bonnes pratiques <span>5€<img src=‘…’ alt=‘prix avec réduction -10%’ /></span></p>
22
Déficiences motrices
23Accessibilité : des volontaires ? Paris Web 2008
Accessibilité : des volontaires ? Paris Web 2008
Déficiences motrices: Un formulaire
24
Solutions : Déficiences motrices
Associer intitulé et champ<label for="nom">Nom</label><input type="text" id="nom">
Prévoir une sessiond’une durée suffisante
Accessibilité : des volontaires ? Paris Web 2008
Solutions : Déficiences motrices
Éviter de changer descomportements prévus !Faire des liens d’évitement
26
Déficiences auditives
27Accessibilité : des volontaires ? Paris Web 2008
Accessibilité : des volontaires ? Paris Web 2008
•ça va ? vous entendez bien tout ?
Déficiences auditives : les orateurs parlent
28
Accessibilité : des volontaires ? Paris Web 2008
Solutions : Déficiences auditives
Faire du sous-titrage
29
Accessibilité : des volontaires ? Paris Web 2008
Le sous-titrage : les on-dit
« C’est impossible à faire ! »« Ça coûte trop cher ! »
30
Accessibilité : des volontaires ? Paris Web 2008
Solutions : Sous-titrage impossible ?
MagpieComposant Flash FLVPlaybackCaptioningInterface DailymotionSolutions professionnellesCommunauté de sous-titrage
31
Revenez samediRevenez samedi
Accessibilité : des volontaires ? Paris Web 2008
Solutions : Sous-titrage trop cher ?
Diminution des coûts par industrialisationUtilisation des données préexistantes
32
Déficiences intellectuelles
33Accessibilité : des volontaires ? Paris Web 2008
Accessibilité : des volontaires ? Paris Web 2008
Déficiences intellectuelles : Troubles concentration
•Mouvement
34
•Clignotement
Accessibilité : des volontaires ? Paris Web 2008
Déficiences intellectuelles : Troubles concentration
Quel est le chiffre qui est unique ?
Prêts ?
35
Accessibilité : des volontaires ? Paris Web 2008
Déficiences intellectuelles : Troubles concentration
36
Accessibilité : des volontaires ? Paris Web 2008
Déficiences intellectuelles : Troubles concentration
Alors ?
37
Accessibilité : des volontaires ? Paris Web 2008
Déficiences intellectuelles : Troubles concentration
38
Accessibilité : des volontaires ? Paris Web 2008
Solutions : troubles concentration
Laisser le contrôle
Lecture Pause Stop
39
Accessibilité : des volontaires ? Paris Web 2008
Solutions : troubles concentration
Limiter la durée et la quantité
40
Accessibilité : des volontaires ? Paris Web 2008
Déficiences intellectuelles : Apprentissage
•精神いっとう何事か奈良ならざらん
41
Accessibilité : des volontaires ? Paris Web 2008
Solutions : Apprentissage
Traductions, phonétique,définition, version audio
•seishin ittô nanigoto ka narazaran(avec une volonté tenace tout peut être accompli)
42
Accessibilité : des volontaires ? Paris Web 2008
Déficiences intellectuelles : Compréhension
Potentiellement il est possible de dire qu'avec un effort non négligeable et une attention toute particulière il est envisageable qu'un élément aussi insignifiant que la quantité d'informations dans une phrase et sa simplicité permettent de la comprendre plus facilement.
43
Accessibilité : des volontaires ? Paris Web 2008
Solutions Compréhension
Phrases simples
Information principale au début
44
Déficiences techniques
45Accessibilité : des volontaires ? Paris Web 2008
Accessibilité : des volontaires ? Paris Web 2008
Déficiences techniques : Javascript
46
Accessibilité : des volontaires ? Paris Web 2008
Solutions : Javascript
47
noscriptJavascript non obstrusif ☺
Script côté serveur ☺
Accessibilité : des volontaires ? Paris Web 2008
Déficiences techniques : Fond et couleur
48
Accessibilité : des volontaires ? Paris Web 2008
Solutions : Fond et couleur
49
Image de fond -> Couleur de fond
Satanas : display:none, text-indent:-5000px
Grand numéro d’hypnose !
http://www.flickr.com/photos/malavoda/2789900768/
50Accessibilité : des volontaires ? Paris Web 2008
Conclusion
51Accessibilité : des volontaires ? Paris Web 2008
Accessibilité : des volontaires ? Paris Web 2008
Crédits
•Ornements :•- Nela Dunato http://inobscuro.com/•- Obsidian Dawn http://www.obsidiandawn.com•Police :•- Dieter Steffmann http://www.steffmann.de/•Magie :•- marchanddetrucs.com et Vincent Valentin
52
Accessibilité : des volontaires ? Paris Web 2008
Des questions ?
•Stéphane Deschamps
•Aurélien Levy
53