SlideShare une entreprise Scribd logo
1  sur  14
Télécharger pour lire hors ligne
Accessibilité numérique

          Premiers pas

Les TICs et l’art – 6 décembre 2011




                                                  Magali Oualid
                                Expert AccessiWeb en évaluation




                                                             1
Sommaire
Présentation générale de l'accessibilité numérique ............................................................................................................. 3
   Définition .......................................................................................................................................................................... 3
   Les différents handicaps et les solutions associées .......................................................................................................... 3
      Handicaps visuels .......................................................................................................................................................... 3
      Handicaps auditifs......................................................................................................................................................... 3
      Handicaps moteurs ....................................................................................................................................................... 3
      Handicaps cognitifs ....................................................................................................................................................... 4
   Tous les autres utilisateurs ............................................................................................................................................... 4
   Ce qu'il faut retenir ........................................................................................................................................................... 4
   Les moyens de mise en œuvre de l'accessibilité numerique ............................................................................................ 4
      Les recommandations internationales ......................................................................................................................... 4
      Les initiatives nationales ............................................................................................................................................... 5
      Le cadre légal français ................................................................................................................................................... 5
      Les personnes concernées ............................................................................................................................................ 6
      Le calendrier de mise en œuvre ................................................................................................................................... 6
   Le périmètre de mise en œuvre sur un site web .............................................................................................................. 7
Mise en œuvre : les critères incontournables ...................................................................................................................... 8
   Sur un site web ................................................................................................................................................................. 8
      Les images ..................................................................................................................................................................... 9
      Les couleurs .................................................................................................................................................................. 9
      Les contenus multimedia ............................................................................................................................................ 10
      Les tableaux ................................................................................................................................................................ 10
      Les liens....................................................................................................................................................................... 11
      Structuration et présentation de l'information .......................................................................................................... 11
      L'éditorial .................................................................................................................................................................... 12
      Navigation et consultation .......................................................................................................................................... 12
   Sur les documents mis en téléchargement..................................................................................................................... 13
      L'accessibilité des PDF................................................................................................................................................. 13
      Les documents Word .................................................................................................................................................. 14




                                                                                                                                                                                        2
PRÉSENTATION GÉNÉRALE DE L'ACCESSIBILITÉ NUMÉRIQUE
Un mot d’introduction : pourquoi l’accessibilité numérique est-elle devenue un enjeu important aujourd’hui ?
    -      Développement du web dans tous les domaines de la vie sociale et professionnelle
    -      L’accessibilité numérique, dont l’objectif est de rendre les contenus numériques consultables et utilisables par
           tous :
               -    Est un facteur important de l’insertion sociale et professionnelle pour tous
               -    Par la prise en compte de toutes les situations (handicaps, environnement technique,
                    cultures/langues…)
               -    Et bénéficie en retour aux producteurs des contenus eux-mêmes (élargissement de leur audience et
                    de leur visibilité)

DÉFINITION
L'accessibilité numérique a pour objectif l'accès à l’information pour tous, quels que soient :
    -      Les capacités physiques de l’utilisateur
    -      Les capacités intellectuelles de l’utilisateur
    -      Le matériel ou les logiciels utilisés
    -      Le type de terminal utilisé
    -      La qualité du réseau utilisé
La loi de 2005 s’intéresse particulièrement aux personnes handicapées, et par ailleurs, l’accessibilité du web s’est
développée au départ grâce à la pression des associations de personnes malvoyantes et non voyantes. Nous allons
donc passer en revue des différents handicaps pour mieux comprendre le contexte.

LES DIFFÉRENTS HANDICAPS ET LES SOLUTIONS ASSOCIÉES
HANDICAPS VISUELS
De la malvoyance à la cécité.
Problèmes rencontrés :
    -      Images et objets multimédias
    -      Liens
    -      Tableaux et cadres
    -      Utilisation de la couleur, contrastes
    -      Utilisation de la souris
Outils :
    -      Configuration du navigateur
    -      Loupes d’écran
    -      Synthèse vocale
    -      Plage braille
HANDICAPS AUDITIFS
Différents niveaux de surdité, donc de capacité de lecture.
Problèmes rencontrés :
    -      Informations sonores
    -      Informations textuelles
Outils
    -      Transcriptions spécifiques
    -      Vidéos en langue des signes
HANDICAPS MOTEURS

                                                                                                                         3
Contrôle musculaire, membre manquant, douleurs au mouvement.
Problèmes rencontrés :
    -    Utilisation du clavier et de la souris
Outils
    -    Clavier et souris adaptés
    -    Logiciel de commande vocale
    -    Trackball
    -    Clavier virtuel
HANDICAPS COGNITIFS
Difficultés d’attention, de compréhension, de mémorisation, d’apprentissage.
Problèmes rencontrés / Aide apportée par l’ergonomie du site
    -    Navigation incohérente
    -    Pages longues, Syntaxe compliquée
    -    Animations

TOUS LES AUTRES UTILISATEURS
    1.   L’étudiant sur un poste de l’université dont il n’est pas administrateur : impossible d’installer un module
         complémentaire si besoin : flash, adobe reader…
    2.   L’élève ou le parent en milieu rural qui ne dispose pas chez lui d’une liaison ADSL : Difficulté pour télécharger
         contenus multimedias ou fichiers volumineux (cf academie en ligne.fr)
    3.   Le citoyen qui utilise une borne internet à sa mairie : taille de l’écran, aucune possibilité d’installer un module
         supplémentaire si besoin
    4.   Une personne ne parlant pas notre langue : besoin de traduction du site (niveau d’accessibilité élevé)
    5.   Un utilisateur qui navigue sur son mobile… : les images, vidéos, fichiers à télécharger ralentissent la navigation
         ; la résolution d’écran doit aussi être prise en compte.

CE QU'IL FAUT RETENIR
L’accessibilité du web adresse tous les handicaps
         Et pas seulement le handicap visuel
Au-delà, l’accessibilité concerne tous les utilisateurs
         par la prise en compte de tout type de configuration, matériel, réseau, logiciel
Un site accessible est par ailleurs
    -    plus facile à maintenir et à faire évoluer parce que structuré et robuste
    -    plus facile à utiliser par tous par la prise en compte de tous les contextes d’utilisation
    -    mieux référencé (libellés de liens clairs et explicites, utilisation des balises de titre , etc)



LES MOYENS DE MISE EN ŒUVRE DE L'ACCESSIBILITÉ NUMERIQUE
LES RECOMMANDATIONS INTERNATIONALES
En 1996 : Web Accessibility Initiative lancée par le W3C (World Wide Web Consortium)
    -    Normes pour les outils de production de contenus
    -    Normes pour les contenus eux-mêmes (WCAG)
    -    Normes pour les outils de consultation des contenus (navigateurs)
C’est la combinaison de l’ensemble de ces normes qui garantit l’accessibilité.
Exemples :
Outils de production :

                                                                                                                          4
critère : prévoir un champ pour saisir l’alternative de l’image insérée dans le contenu
Contenus :
critère : insérer une alternative textuelle pertinente pour toute image insérée dans le contenu (pertinente signifie
transcription de l’information apportée par l’image ; si pas d’information, codage spécifique prévu)
Outils de consultation :
critère : interpréter correctement l’alternative de l’image (si la valeur correspond au codage d’une image de décoration,
le navigateur ignorera l’alternative).


En tant que producteurs de contenus, nous sommes concernés par les normes relatives aux contenus.


Trois niveaux de conformité sont distingués :
A (bronze pour AW) : ce qui doit être fait
AA (argent pour AW) : ce qui devrait être fait
AAA (or pour AW) : ce qui pourrait être fait


Exemples de critères :
    -    Alternative textuelle pertinente sur les images : relève de la responsabilité des contributeurs
    -    Libellés de liens explicites hors contexte : relève de la responsabilité des contributeurs
    -    Code source conforme au modèle déclaré en entête du code (standards du web) : relève de la responsabilité
         des développeurs
    -    Navigation cohérente, avec menu et fil d’ariane par ex : relève de la responsabilité des graphistes
    -    Codage des tableaux pour pouvoir relier chaque cellule à son entête de colonne : relève de la responsabilité
         des développeur et contributeur


LES INITIATIVES NATIONALES
L’Association Braillenet vise à encourager le développement d’Internet au service des personnes handicapées, dans les
domaines de l’information, de l’éducation et de la culture.
A ces différents titres, elle a lancé de nombreuses initiatives :
    -    Accessiweb : centre de ressources et de recherche sur l’accessibilité du web
              -   Définition d’un référentiel basé sur les recommandations internationales
              -   un guide d’utilisation, un label de certification pour les sites web,
              -   un grand nombre de formations spécialisées
    -    La bibliothèque Hélène : + de 7.000 ouvrages numériques accessibles aux personnes déficientes visuelles
    -    L’institut de l’accessibilité numérique :
         -   Créé par l’Université Pierre et Marie Curie, l’Institut National de recherche en informatique et en
             automatique et Universcience et l’association BrailleNet
         -   vocation de coordonner les initiatives et les compétences mobilisées pour assurer un accès égal à tous à
             l’information
         -   il intervient dans quatre domaines principaux :
              •   la recherche et développement
              •   les enseignements
              •   la certification de conformité aux standards internationaux
              •   la veille permanente en matière de bonnes pratiques


LE CADRE LÉGAL FRANÇAIS
    -    Le cadre juridique


                                                                                                                       5
-   La loi 2005-102 du 11 février 2005 pour l’égalité des droits et des chances, la participation et la
                  citoyenneté des personnes handicapées (article 47)
              -   Décret d’application : 14 mai 2009 (publié le 16/05/09)
                      -    Référentiel RGAA paru le 01/10/2009
    -   Le cadre institutionnel
              -   La DGME : élaboration du référentiel
              -   Le CIH : mise en œuvre et accompagnement


Il est à noter que ce dispositif ne prévoit pour toute sanction que l'inscription du site non conforme sur une liste (non
effective à ce jour).


LES PERSONNES CONCERNÉES
LES PUBLICS
    -   Administrés ; les types de contenus concernés sont les :
              -   Sites internets institutionnels
              -   Toute interface web destinée au public
              -   Tout document numérique mis en ligne
    -   Personnels les types de contenus concernés sont les :
              -   Sites intranets
              -   Toute interface web utilisée dans le cadre du travail
              -   Tout document numérique mis en ligne sur les intranets et applications web
LES RESPONSABLES MISE EN OEUVRE
    -   L’équipe projet
              -   Décideurs
              -   Chef de projet
              -   développeurs
    -   Les contributeurs
              -   Webmestres
              -   Producteurs de documents mis en ligne
    -   Les organismes de formation
              -   Obligation de formation prévue par le décret
LES BENEFICIAIRES
    -   Les internautes et intranautes
              -   Accès à toute l’information
    -   L’administration émettrice
              -   Qualité de service
              -   Portabilité sur tout type de réseau
              -   Élargissement de son audience, meilleur référencement
              -   Facilité de maintenance


LE CALENDRIER DE MISE EN ŒUVRE
    -   Délais généraux
              -   2 ans pour les sites existants >> 15/05/2011
              -   Applicabilité immédiate pour tout nouveau site, nouveau contenu
    -   Dans le cadre d’un projet
              -   Prise en compte dès le lancement

                                                                                                                       6
-   Prise en compte à chaque étape du projet
          -   Au quotidien
                    -   Responsabilité du maintien de l’accessibilité : les contributeurs de site et producteurs de documents
                        numériques

LE PÉRIMÈTRE DE MISE EN ŒUVRE SUR UN SITE WEB
Le périmètre de l’accessibilité d’un projet web englobe à la fois le site, les outils et les personnes intervenant à
différents titres sur le projet.

    ère
1         zone du périmètre : Le site web
Ce terme désigne les pages destinées aux utilisateurs (internautes), sur lesquelles les contenus doivent être accessibles
à tous quelle que soit la manière de naviguer sur Internet, ainsi que tous les fluxs qu’il propose :
          •   courriels,
          •   syndications de contenus
          •   fichiers à télécharger
          •   échanges avec les réseaux sociaux
          •   services en ligne tels que les inscriptions aux concours, ou le suivi de son dossier administratif (enseignants)
Il s’agit de la première zone à laquelle on pense lorsque l’on évoque l’accessibilité d’un site.

    ème
2         zone du périmètre : Les outils de publication et d’administration
L’outil de publication doit permettre aux contributeurs de mettre en œuvre l’accessibilité lorsqu’ils créent des contenus
à publier sur le site :
          -   alternative textuelle des images : un champ doit être disponible lors de l’insertion de l’image dans un article
              pour saisir cette alternative
          -   titre des liens : certains liens nécessitent de donner des informations complémentaires à leur libellé, par
              exemple :
                    -   qu’il s’agit d’un fichier à télécharger de tel format, tel poids,
                    -   ou qu’il s’agit d’un lien externe qui s’ouvrira en nouvelle fenêtre
                    -   Dans ce cas, l’outil de publication doit permettre de renseigner un attribut spécifique du lien
                        permettant de donner cette information
          -   changements de langue par rapport à la langue du site
          -   structuration du texte : l’outil doit permettre l’insertion de niveaux de titres
          -   Etc

    ème
3         zone du périmètre : L’équipe projet
Constituée de
La maîtrise d’ouvrage : l’administration, l’entreprise qui commande le site (ou sa refonte)
et la maîtrise d’œuvre : les équipes techniques internes, le(s) prestataire(s) d’intégration/développement/graphique
Intervient dans la mise en œuvre de l’accessibilité :
de la conception du site (expression du besoin par la maîtrise d’ouvrage)
à sa réalisation par la maîtrise d’œuvre (développeurs, graphistes, intégrateurs - choix des outils, intégration dans les
développements…)
et ensuite pour la maintenance du site.
Ces acteurs sont inclus dans le périmètre de l’accessibilité du site au titre des compétences concrètes qu’ils doivent
avoir.

    ème
4         zone du périmètre : Les contributeurs :

                                                                                                                                 7
3 types de contributeurs (au sens producteurs de contenus) peuvent être distingués :
Les contributeurs directs
Ce sont ceux qui travaillent dans l’outil de publication : ils font partie du périmètre à prendre en compte dans le cadre
du projet en tant que destinataires des actions d’accompagnement liées à l’accessibilité.
Les contributeurs indirects internes
Le contenus ne sont pas seulement produits dans l’outil de publication : les fichiers en téléchargement par exemple
proviennent souvent de contributeurs indirects du site (mais internes à l’organisation). Ils seront eux-aussi destinataires
d’actions d’accompagnement liées à l’objectif d’accessibilité du site.
Les contributeurs indirects externes
Ces fichiers peuvent aussi être fournis par des contributeurs externes à la structure (prestataire, sur commande), mais
ces contributeurs externes fournissent le plus souvent les contenus multimédias (vidéos, animations flash…) : les
services qui les gèrent, qui passent les commandes, doivent savoir quoi exiger en termes d’accessibilité et ces
prestataires doivent s’y conformer. A ce titre, ils entrent dans le périmètre de l’accessibilité du site à prendre en
compte par l’équipe projet.



En synthèse :
L’accessibilité ne s’arrête pas aux outils de gestion du site
il faut tenir compte aussi des outils de développement,
et des process de création de contenus hors outil de gestion du site
La mise en œuvre de l’accessibilité ne concerne pas que les « webmestres » mais aussi :
l’équipe technique,
les contributeurs directs,
les contributeurs indirects internes ou externes



MISE EN ŒUVRE : LES CRITÈRES INCONTOURNABLES

SUR UN SITE WEB
Les thématiques abordées sont les suivantes :
    -    Les images
    -    Les couleurs
    -    Le multimédia
    -    Les tableaux
    -    Les liens
    -    Les éléments obligatoires
    -    La structuration de l’information
    -    La présentation de l’information
    -    Les formulaires
    -    La navigation
    -    La consultation
Pour chacune des thématiques abordées, seuls les critères à la charge des contributeurs seront abordés. (donc toutes
les thématiques ne sont pas vues)
Ex : images : toute image doit avoir une alternative textuelle
    -    développeur/éditeur d’outil de publication : doit prévoir le champ de saisie
    -    contributeur : doit renseigner le alt de façon pertinente
    -    éditeur de navigateur : doit prévoir l’interprétation correcte de la valeur saisie
                                                                                                                         8
Par ailleurs, seuls les critères de niveau A seront pris en compte (bronze, la présentation s’appuyant sur le référentiel
Accessiweb plutôt que le RGAA).


LES IMAGES
    •    Principe
             –      Toute image porteuse d’information
                         •   Texte
                         •   Liens
                         •   Chiffres
                         •   Information complémentaire au texte
             –      doit avoir une alternative textuelle
                         •   Attribut html alt
             –      Cette alternative doit être pertinente
                         •   Restitution de l’information portée par l’image


Utilisateur concerné :
    -    utilisateur de synthèse vocale (personne non voyante)
    -    utilisateur d’un navigateur textuel (personne présentant un handicap cognitif ou moteur ; les images ne
         s’affichent pas)
    -    utilisateur disposant d’une liaison bas débit ou naviguant sur un téléphone portable (désactivation des images
         pour rendre la navigation plus fluide)
Image texte : à utiliser seulement si le style du texte ne peut pas être restitué par une feuille de style (police
inexistante, logo…)
Image lien : la destination du lien est une information de navigation
Image avec des chiffres : n° de téléphone, statistiques, chiffres clés
Information complémentaire : ex, photo de l’arrivée d’une course, qui montre qui est le gagnant (à condition que ce ne
soit pas dit dans le texte de l’article associé à l’image)
Mise en œuvre par les contributeurs :
    -    le champ « alt » doit être systématiquement renseigné
    -    pour être pertinente, la valeur saisit doit être conforme aux règles suivantes :
             o      image décorative : valeur = "" (la synthèse vocale ne lira rien, on parle de alt vide)
             o      image texte : valeur = le texte de l’image
             o      image lien : valeur = destination du lien + information complémentaire si besoin (ex : ouverture en
                     nouvelle fenêtre, cf « Les liens »)
             o      si l’image lien est en doublon avec un libellé de lien « en clair », le mieux est de poser un seul lien sur
                    le tout (libellé + image)
    -    la valeur de l’alternative doit être la plus concise possible (80 caractères, exceptionnellement plus longue)


LES COULEURS
    •    Principes :
             –      la couleur ne doit pas être utilisée seule pour donner une information ;
             –      un contraste suffisant doit exister entre les couleurs du texte et du fond.
Utilisateur concerné :
    -    utilisateur mal voyant
    -    utilisateur ne distinguant pas les couleurs
Mise en œuvre par les contributeurs :
Site web : les couleurs sont gérées uniquement par la charte graphique du site

                                                                                                                             9
Ne pas utiliser la couleur seule pour mettre en avant une partie du texte d’un contenu (associer par ex du gras [mais
pas de souligné])
Texte de petite taille : le contraste minimum entre le texte et le fond doit être de 4,5
Texte de grande taille (150% min de la taille du texte par défaut, ou 120% gras) : le contraste minimum doit être de 3


LES CONTENUS MULTIMEDIA
    •    Principe : tout contenu multimedia (vidéo, son, animation) doit avoir si nécessaire
             –     une transcription textuelle,
             –    des sous-titres synchronisés pertinents
             –    une audio description pertinente.
             –    Et le contrôle de leur consultation doit être possible (arrêt, pause, reprise).


Utilisateur concerné :
    -    utilisateur présentant des déficiences auditives et/ou visuelles
    -    utilisateur ne disposant pas du logiciel nécessaire
    -    utilisateur disposant d’une liaison bas débit (téléchargement ou consultation impossible ou très difficile)
Mise en œuvre par les contributeurs :
    -    Animations flash :
             o    si l’animation contient du texte, elle doit avoir une alternative textuelle :
             o    soit un lien vers un fichier à télécharger (format accessible : txt, pdf accessible)
             o    soit un lien vers une page web
             o    le lien de l’alternative doit être associé de manière évidente à l’animation
             o    dans tous les cas, une animation flash doit pouvoir être contrôlée : arrêt, pause, reprise
    -    Vidéos : chaque vidéo doit être accompagnée à minima :
             o    d’une transcription textuelle (transcription des discours/dialogues, description des actions…)
             o    de sous-titres synchronisés
             o    En général, le contrôle de la consultation d’une vidéo est implémenté dans les lecteurs utilisés.


LES TABLEAUX
    •    Principe : associer à chaque tableau les informations nécessaires à leur lecture ou leur interprétation par les
         aides techniques ou par un navigateur ayant une configuration spécifique :
             –    Titre
             –    Résumé
             –    Relations entre les cellules et les entêtes de lignes et de colonnes


Utilisateur concerné :
    -    utilisateur de synthèse vocale (personne non voyante)
    -    utilisateur de navigateur textuel (personne présentant un handicap cognitif ou moteur)
    -    utilisateur disposant de feuilles de styles spécifiques
Mise en œuvre par les contributeurs :
Tableaux de données : il faut renseigner les éléments suivants dans les propriétés du tableau :
    •    résumé du tableau, concis et pertinent : à renseigner dans les propriétés avancées
    •    titre du tableau, concis et pertinent = champ « légende du tableau » [balise caption dans le code html]
    •    éléments html permettant d’établir les relations entre chaque cellule et les entêtes de colonnes et de lignes
         [th, header, id] (voir diapo suivante)
    •    sens de lecture du tableau

                                                                                                                         10
Tableaux de mise en forme : sont déconseillés (sinon, il faut garantir que l’information sera restituée correctement en
cas de linéarisation du tableau)


LES LIENS
     •     Principes :
               –    Donner des intitulés de liens explicites (hors contexte)
                         •     et le moins long possible
               –    Informer l’utilisateur sur l’ouverture éventuelle du lien en nouvelle fenêtre


Utilisateur concerné :
     -     utilisateur de synthèse vocale (personne non voyante)
     -     utilisateur présentant un handicap moteur
     -     Ces deux types d’utilisateur ont la possibilité d’afficher la liste des liens de la page dans une nouvelle fenêtre
           pour une navigation plus rapide.
Mise en œuvre :
Libellé du lien :
     •     concis (auparavant, limité à 80 caractères, plus de limite aujourd’hui mais concision attendue)
     •     Explicite : devait être explicite hors contexte en V1 ; aujourd’hui, le contexte peut être pris en compte (titre
           précédent, title du lien, élément précédent de l’énumération…)
Titre du lien (info bulle) :
     •     ne doit être renseigné que s’il est nécessaire d’ajouter une information complémentaire au libellé du lien ; ex :
           ouverture en nouvelle fenêtre, description du fichier à télécharger (format, taille, poids)
     •     doit contenir le libellé du lien + les informations complémentaires (parce que les synthèses vocales liront le
           champ le plus long entre le libellé et le titre du lien, mais pas les deux)
Sur une même page, deux liens avec le même libellé doivent conduire vers la même page >> il faut éviter les liens « en
savoir plus », « cliquez ici »…


STRUCTURATION ET PRÉSENTATION DE L'INFORMATION
     •     Principes :
               –    Utiliser des titres pour structurer un contenu
               –    Respecter la hiérarchie des titres
               –    Baliser correctement les sigles et les listes
               –    Ne pas justifier le texte
               –    Séparer la forme et le fond (CSS)


Utilisateur concerné :
     -     tout internaute
     -     utilisateur de synthèse vocale ou de plage braille (personne non voyante)
     -     Utilisateur présentant un handicap cognitif
Titres :
     -     Les titres permettent une prise de connaissance rapide du contenu de la page
     -     Sauter un niveau de titre (pour une raison de mise en forme par ex) rend la structuration de la page
           incohérente
     -     Le libellé du titre doit permettre une compréhension immédiate de l’information qu’il coiffe
Sigles :
     -     La balise acronyme doit être utilisée pour les sigles qui peuvent être lus comme un mot
     -     La balise abréviation doit être utilisée pour les sigles qui sont lus lettre à lettre

                                                                                                                          11
-    La première occurrence sur une page doit avoir un attribut « title » donnant son libellé complet
Listes
    -    Les listes à puces et les listes numérotées doivent être balisées avec les bons éléments html (ul, ol, li)
    -    Pour les listes de définition : dl, li (à ne pas utiliser pour faire de la mise en forme)


La séparation de la forme et du fond est gérée par l’utilisation de CSS >> pas de mise en forme dans les contenus eux-
mêmes. Cela permet à l’utilisateur d’appliquer éventuellement la feuille de style adaptée à son handicap


L'ÉDITORIAL
    •    Principes :
              –   Les changements de langue doivent être indiqués
              –   Le texte doit être rédigé dans un langage clair et compréhensible par tous


Utilisateur concerné :
    -    tout internaute
    -    utilisateur de synthèse vocale ou de plage braille (personne non voyante).
Mise en œuvre par les contributeurs :
    -    Les changements de langue par rapport à la langue du site (indiquée dans le code source) doivent être
         indiqués (attribut html « lang »)
         La fonction doit être présente dans l’éditeur de texte ou bien il faut pouvoir accéder au code source du
         contenu pour ajouter la balise.
    -    pas de « syntaxe cryptique » , langage clair et compréhensible par tous ou alternative textuelle à un texte
         contenant du « jargon » (langage pro spécifique)


NAVIGATION ET CONSULTATION
    •    Principes :
              –   Les ouvertures en nouvelle fenêtre doivent être annoncées
              –   La destination des liens doit être explicite
              –   Les documents en téléchargement doivent être dans un format accessible
              –   Les informations relatives au document à télécharger doivent être fournies


Utilisateur concerné :
    -    Tout utilisateur
    -    Utilisateur de synthèse vocale (manip différente pour un retour arrière quand l’ouverture est en nouvelle
         fenêtre par ex)
    -    Utilisateur disposant d’une liaison bas débit (ne voudra pas télécharger un document trop volumineux ou
         devra prévoir du temps pour cela)
Mise en œuvre par les contributeurs :
Ouverture en nouvelle fenêtre (liens) : l’information doit être donnée soit dans le libellé du lien soit dans son « titre »
(title ) lequel doit contenir le libellé du lien + nouvelle fenêtre
Destination du lien : le libellé du lien doit être explicite hors contexte – cf thématique liens
Docs en téléchargement :
    -    Les formats accessibles par défaut sont : HTML, txt
    -    Les formats pouvant être rendus accessibles sont : PDF, word ou assimilé (open office) [cf diapo suivante]
    -    Informations à fournir dans le title du lien de téléchargement : libellé du document (= libellé du lien), format,
         nb de pages, poids, modalité d’ouverture
NB : il est conseillé d’ouvrir le document en nouvelle fenêtre pour éviter qu’en le fermant, l’utilisateur quitte le site

                                                                                                                            12
SUR LES DOCUMENTS MIS EN TÉLÉCHARGEMENT
L'ACCESSIBILITÉ DES PDF
     •     Principes :
               –    La langue du document est spécifiée
               –    Les éléments non textuels ont une alternative textuelle
               –    Le texte est structuré
               –    Les liens sont actifs et accessibles
               –    Les formulaires, tableaux et listes sont accessibles
               –    Le texte peut faire l’objet d’une recherche ou d’une sélection
               –    L’ordre de lecture est clair
               –    Une aide à la navigation est disponible
               –    L’interdiction de copier le texte ne doit pas être activée


     •     Mise en œuvre
Langue : menu Fichier/propriétés du document/avancées
Alternatives textuelles : il faut d’abord baliser le document, puis sur chaque balise image, insérer un texte de
remplacement (cf thématique images)
NB : on ne balise pas les images non porteuses d’information !!!
>> pour baliser : options avancées/accessibilité/ajouter des balises au document
>> sur un document déjà balisé, gestion des balises avec : affichage/panneaux de navigation/balises/propriétés
Structuration du texte :
     -     Balisage du texte pour insérer des niveaux de titre
Liens : libellés concis et explicites hors contextes, title si besoin + hypertexte activé (Options avancées/liens/créer à
partir des urls)
Formulaires :
     -     Champs de saisie actifs
     -     Descriptions des champs
     -     Ordre de tabulation défini pour naviguer de champ en champ
     -     Balisage complet du formulaire
>> menu formulaire, utiliser les options d’accessibilité sur chaque item du formulaire (le menu nous fait basculer dans
Adobe Designer >> pas le temps de tout passer en revue aujourd’hui ; cf le document d’Adobe
http://www.adobe.com/fr/accessibility/ )
Tableaux de données :
Utiliser les propriétés des balises pour déclarer les entêtes de colonnes et de lignes et les cellules du tableau
Listes :
Utiliser les propriétés des balises pour déclarer les listes et les articles de listes
Texte sélectionnable :
     -     Les documents scannés mis en pdf ne sont pas accessibles >> le texte doit être rendu sélectionnable (ce qui
           permet aussi d’y faire une recherche de mots)
     -     Acrobat pro permet de convertir du texte scanné en texte sélectionnable : menu Document/reconnaître du
           texte par OCR (= reconnaissance de caractères)
Ordre de lecture : (logique et simple)
     -     Il faut d’abord baliser le document
     -     Le panneau de gestion des balises dispose d’un onglet ordre qui permet de définir l’ordre de lecture dans
           chaque page
Aide à la navigation : insertion de signets (bookmarks)


                                                                                                                      13
-     Il faut avoir balisé et structuré le texte
     -     Menu Affichage/panneaux de navigation/signets >> utiliser le menu options pour créer et gérer les signets
L’option de sécurité interdisant de copier le texte doit être inactive :
     -     Parce que certaines aides techniques copient le texte pour pouvoir le lire
     -     Par défaut, cette option est inactive
Menu Fichier/propriétés du document/protection du document/modifier les options (quand « protection » est activée)


LES DOCUMENTS WORD

     •     Principes :
               –    La langue du document est spécifiée
               –    Les éléments non textuels ont une alternative textuelle
               –    Le texte est structuré
               –    Les liens sont actifs et accessibles
               –    Les formulaires, tableaux et listes sont accessibles
               –    Une aide à la navigation est disponible


     •     Mise en œuvre
Langue :
Outils/langue/langue…
Alternative aux images :
Clic droit sur l’image ou menu Format/image (après l’avoir sélectionnée)
Onglet « web », renseigner le champ « texte de remplacement »
Structuration du texte :
Utilisation des styles de titres pour hiérarchiser le texte
Liens :
Libellé concis et explicite hors contexte
Lien hypertexte activé
Formulaires :
Renseigner systématiquement le champ « texte d’aide » dans les propriétés de chaque champ du formulaire
Structurer le texte du formulaire par l’utilisation de styles de titres
Tableaux :
     -     Les tableaux créés dans word ne sont pas accessibles (le code html produit n’est pas « propre »)
>> pour faire un word accessible, il ne doit pas contenir de tableau
Listes :
Les formats de liste disponibles dans word ne produisent pas de code accessible mais leur lecture par une synthèse
vocale reste possible
Aide à la navigation :
     -     Insérer un sommaire automatique (il faut avoir appliqué des styles de titre auparavant)
     -     Utiliser des ancres si besoin avec des libellés de signets explicites
Un PDF généré à partir d’un word accessible sera lui-même largement accessible, voire totalement (s’il n’y a pas de
tableaux).




                                                                                                                       14

Contenu connexe

En vedette

Licences libres et licences creative commons version web
Licences libres et licences creative commons version webLicences libres et licences creative commons version web
Licences libres et licences creative commons version webLesticetlart Invisu
 
Les TIC et l'art : les corpus scientifiques face au web ouvert
Les TIC et l'art : les corpus scientifiques face au web ouvertLes TIC et l'art : les corpus scientifiques face au web ouvert
Les TIC et l'art : les corpus scientifiques face au web ouvertLesticetlart Invisu
 
Quelle utilisation des TIC dans une thèse en histoire de l'art ?
Quelle utilisation des TIC dans une thèse en histoire de l'art ?Quelle utilisation des TIC dans une thèse en histoire de l'art ?
Quelle utilisation des TIC dans une thèse en histoire de l'art ?Lesticetlart Invisu
 
Zotero, journée de formation 19 janvier 2017
Zotero, journée de formation 19 janvier 2017Zotero, journée de formation 19 janvier 2017
Zotero, journée de formation 19 janvier 2017Lesticetlart Invisu
 
Les TIC et l'art : Qu'est-ce qu'ISIDORE ?
Les TIC et l'art : Qu'est-ce qu'ISIDORE ?Les TIC et l'art : Qu'est-ce qu'ISIDORE ?
Les TIC et l'art : Qu'est-ce qu'ISIDORE ?Lesticetlart Invisu
 
Inha 2-redocumentarisation
Inha 2-redocumentarisationInha 2-redocumentarisation
Inha 2-redocumentarisationPeccatte
 
Inha in visu-metadonnees-12 septembre 2012
Inha in visu-metadonnees-12 septembre 2012Inha in visu-metadonnees-12 septembre 2012
Inha in visu-metadonnees-12 septembre 2012Peccatte
 
Femmes Ou Bagnoles
Femmes Ou BagnolesFemmes Ou Bagnoles
Femmes Ou Bagnolesciffer louis
 
Cheminement2011 light
 Cheminement2011 light Cheminement2011 light
Cheminement2011 lightPaul Savard
 
Encuentro adolescentes mel pamplona
Encuentro adolescentes mel pamplonaEncuentro adolescentes mel pamplona
Encuentro adolescentes mel pamplonaDavinia Martínez
 
Lenguaje Y ComunicacióN 2
Lenguaje Y ComunicacióN 2Lenguaje Y ComunicacióN 2
Lenguaje Y ComunicacióN 2alejandro
 
Iroko_Conare_IUM
Iroko_Conare_IUMIroko_Conare_IUM
Iroko_Conare_IUMportuero14
 
Carta Abierta De La P Pz Toros Aranda
Carta Abierta De La P Pz Toros ArandaCarta Abierta De La P Pz Toros Aranda
Carta Abierta De La P Pz Toros Arandamojaci
 
Universidad CatóLica De Temuco, Tarea 2
Universidad CatóLica De Temuco, Tarea 2Universidad CatóLica De Temuco, Tarea 2
Universidad CatóLica De Temuco, Tarea 2guestd4ebc
 
Les Tic et l'art: images numériques, traitement et diffusion, 1
Les Tic et l'art: images numériques, traitement et diffusion, 1Les Tic et l'art: images numériques, traitement et diffusion, 1
Les Tic et l'art: images numériques, traitement et diffusion, 1Lesticetlart Invisu
 
Universidad CatóLica De Temuco, Tarea 2
Universidad CatóLica De Temuco, Tarea 2Universidad CatóLica De Temuco, Tarea 2
Universidad CatóLica De Temuco, Tarea 2guestd4ebc
 
San Enrique De Osso
San Enrique De OssoSan Enrique De Osso
San Enrique De Ossoguestf7e5448
 

En vedette (20)

Licences libres et licences creative commons version web
Licences libres et licences creative commons version webLicences libres et licences creative commons version web
Licences libres et licences creative commons version web
 
Les TIC et l'art : les corpus scientifiques face au web ouvert
Les TIC et l'art : les corpus scientifiques face au web ouvertLes TIC et l'art : les corpus scientifiques face au web ouvert
Les TIC et l'art : les corpus scientifiques face au web ouvert
 
Quelle utilisation des TIC dans une thèse en histoire de l'art ?
Quelle utilisation des TIC dans une thèse en histoire de l'art ?Quelle utilisation des TIC dans une thèse en histoire de l'art ?
Quelle utilisation des TIC dans une thèse en histoire de l'art ?
 
Zotero, journée de formation 19 janvier 2017
Zotero, journée de formation 19 janvier 2017Zotero, journée de formation 19 janvier 2017
Zotero, journée de formation 19 janvier 2017
 
Les TIC et l'art : Qu'est-ce qu'ISIDORE ?
Les TIC et l'art : Qu'est-ce qu'ISIDORE ?Les TIC et l'art : Qu'est-ce qu'ISIDORE ?
Les TIC et l'art : Qu'est-ce qu'ISIDORE ?
 
Inha 2-redocumentarisation
Inha 2-redocumentarisationInha 2-redocumentarisation
Inha 2-redocumentarisation
 
Inha in visu-metadonnees-12 septembre 2012
Inha in visu-metadonnees-12 septembre 2012Inha in visu-metadonnees-12 septembre 2012
Inha in visu-metadonnees-12 septembre 2012
 
Femmes Ou Bagnoles
Femmes Ou BagnolesFemmes Ou Bagnoles
Femmes Ou Bagnoles
 
Cheminement2011 light
 Cheminement2011 light Cheminement2011 light
Cheminement2011 light
 
Ester Ruiz
Ester RuizEster Ruiz
Ester Ruiz
 
Encuentro adolescentes mel pamplona
Encuentro adolescentes mel pamplonaEncuentro adolescentes mel pamplona
Encuentro adolescentes mel pamplona
 
Lenguaje Y ComunicacióN 2
Lenguaje Y ComunicacióN 2Lenguaje Y ComunicacióN 2
Lenguaje Y ComunicacióN 2
 
Iroko_Conare_IUM
Iroko_Conare_IUMIroko_Conare_IUM
Iroko_Conare_IUM
 
Carta Abierta De La P Pz Toros Aranda
Carta Abierta De La P Pz Toros ArandaCarta Abierta De La P Pz Toros Aranda
Carta Abierta De La P Pz Toros Aranda
 
Universidad CatóLica De Temuco, Tarea 2
Universidad CatóLica De Temuco, Tarea 2Universidad CatóLica De Temuco, Tarea 2
Universidad CatóLica De Temuco, Tarea 2
 
Les Tic et l'art: images numériques, traitement et diffusion, 1
Les Tic et l'art: images numériques, traitement et diffusion, 1Les Tic et l'art: images numériques, traitement et diffusion, 1
Les Tic et l'art: images numériques, traitement et diffusion, 1
 
Universidad CatóLica De Temuco, Tarea 2
Universidad CatóLica De Temuco, Tarea 2Universidad CatóLica De Temuco, Tarea 2
Universidad CatóLica De Temuco, Tarea 2
 
Encuentro vocacional 2013
Encuentro vocacional 2013Encuentro vocacional 2013
Encuentro vocacional 2013
 
Wikim Conférence finale
Wikim Conférence finaleWikim Conférence finale
Wikim Conférence finale
 
San Enrique De Osso
San Enrique De OssoSan Enrique De Osso
San Enrique De Osso
 

Similaire à Les TIC et l'art : l'Accessibilité numérique

La compétence numérique, cadre de travail évolutif pour le design d'interface...
La compétence numérique, cadre de travail évolutif pour le design d'interface...La compétence numérique, cadre de travail évolutif pour le design d'interface...
La compétence numérique, cadre de travail évolutif pour le design d'interface...Vincent Beneche
 
Jouve : Le Livre blanc de l'accessibilite (2014)
Jouve : Le Livre blanc de l'accessibilite (2014)Jouve : Le Livre blanc de l'accessibilite (2014)
Jouve : Le Livre blanc de l'accessibilite (2014)Jouve
 
Le nomadisme en éducation : Web 2.0 et logiciels portables
Le nomadisme en éducation : Web 2.0 et logiciels portablesLe nomadisme en éducation : Web 2.0 et logiciels portables
Le nomadisme en éducation : Web 2.0 et logiciels portablesSophie Godbout
 
Utiliser les tablettes avec les seniors en bibliothèque
Utiliser les tablettes avec les seniors en bibliothèqueUtiliser les tablettes avec les seniors en bibliothèque
Utiliser les tablettes avec les seniors en bibliothèqueAnne-Gaëlle Gaudion
 
Atelier Mazedia Multitouch SITEM 2011 Expérience Fontevraud - Rétrospective
Atelier Mazedia Multitouch SITEM 2011 Expérience Fontevraud - RétrospectiveAtelier Mazedia Multitouch SITEM 2011 Expérience Fontevraud - Rétrospective
Atelier Mazedia Multitouch SITEM 2011 Expérience Fontevraud - RétrospectiveRoux Michel
 
Responsive Web design - defimedia
Responsive Web design - defimediaResponsive Web design - defimedia
Responsive Web design - defimediadefimedia
 
Concevoir des interfaces pour les seniors: enjeu essentiel pour les informati...
Concevoir des interfaces pour les seniors: enjeu essentiel pour les informati...Concevoir des interfaces pour les seniors: enjeu essentiel pour les informati...
Concevoir des interfaces pour les seniors: enjeu essentiel pour les informati...Isabelle Motte
 
Mise en place d’une application mobile de géolocalisation
Mise en place d’une application mobile de géolocalisationMise en place d’une application mobile de géolocalisation
Mise en place d’une application mobile de géolocalisationCléa Aurianne Leencé BAWE
 
Concevoir un site accessible avec le RGAA (2010)
Concevoir un site accessible avec le RGAA (2010)Concevoir un site accessible avec le RGAA (2010)
Concevoir un site accessible avec le RGAA (2010)Ardesi Midi-Pyrénées
 
#compublique Connaître et développer les outils de mise en accessibilité de s...
#compublique Connaître et développer les outils de mise en accessibilité de s...#compublique Connaître et développer les outils de mise en accessibilité de s...
#compublique Connaître et développer les outils de mise en accessibilité de s...Cap'Com
 
Accessibilité du Web et RGAA
Accessibilité du Web et RGAAAccessibilité du Web et RGAA
Accessibilité du Web et RGAAFabrice CROIZE
 
Projet de médiation numérique de la médiathèque George Sand de Moirans
Projet de médiation numérique de la médiathèque George Sand de MoiransProjet de médiation numérique de la médiathèque George Sand de Moirans
Projet de médiation numérique de la médiathèque George Sand de MoiransThomas Gomez de Mercado
 
Omeka ou comment réaliser une bibliothèque numérique à l'échelle d'un SCD
Omeka ou comment réaliser une bibliothèque numérique à l'échelle d'un SCDOmeka ou comment réaliser une bibliothèque numérique à l'échelle d'un SCD
Omeka ou comment réaliser une bibliothèque numérique à l'échelle d'un SCDJulien Sicot
 
Usages pédagogiques des outils nomades en info-doc
Usages pédagogiques des outils nomades en info-docUsages pédagogiques des outils nomades en info-doc
Usages pédagogiques des outils nomades en info-docsophiebocquet
 
Une App responsable pour de la mobilité durable
Une App responsable pour de la mobilité durableUne App responsable pour de la mobilité durable
Une App responsable pour de la mobilité durableChristophe Rochefolle
 
L’accessibilité web pour les organismes publics
L’accessibilité web pour les organismes publicsL’accessibilité web pour les organismes publics
L’accessibilité web pour les organismes publicsWilly Leloutre
 
Conception ingenierie-multimedia
Conception ingenierie-multimediaConception ingenierie-multimedia
Conception ingenierie-multimediapascal cargouet
 

Similaire à Les TIC et l'art : l'Accessibilité numérique (20)

La compétence numérique, cadre de travail évolutif pour le design d'interface...
La compétence numérique, cadre de travail évolutif pour le design d'interface...La compétence numérique, cadre de travail évolutif pour le design d'interface...
La compétence numérique, cadre de travail évolutif pour le design d'interface...
 
Jouve : Le Livre blanc de l'accessibilite (2014)
Jouve : Le Livre blanc de l'accessibilite (2014)Jouve : Le Livre blanc de l'accessibilite (2014)
Jouve : Le Livre blanc de l'accessibilite (2014)
 
Le nomadisme en éducation : Web 2.0 et logiciels portables
Le nomadisme en éducation : Web 2.0 et logiciels portablesLe nomadisme en éducation : Web 2.0 et logiciels portables
Le nomadisme en éducation : Web 2.0 et logiciels portables
 
Utiliser les tablettes avec les seniors en bibliothèque
Utiliser les tablettes avec les seniors en bibliothèqueUtiliser les tablettes avec les seniors en bibliothèque
Utiliser les tablettes avec les seniors en bibliothèque
 
Atelier Mazedia Multitouch SITEM 2011 Expérience Fontevraud - Rétrospective
Atelier Mazedia Multitouch SITEM 2011 Expérience Fontevraud - RétrospectiveAtelier Mazedia Multitouch SITEM 2011 Expérience Fontevraud - Rétrospective
Atelier Mazedia Multitouch SITEM 2011 Expérience Fontevraud - Rétrospective
 
Responsive Web design - defimedia
Responsive Web design - defimediaResponsive Web design - defimedia
Responsive Web design - defimedia
 
Concevoir des interfaces pour les seniors: enjeu essentiel pour les informati...
Concevoir des interfaces pour les seniors: enjeu essentiel pour les informati...Concevoir des interfaces pour les seniors: enjeu essentiel pour les informati...
Concevoir des interfaces pour les seniors: enjeu essentiel pour les informati...
 
Mise en place d’une application mobile de géolocalisation
Mise en place d’une application mobile de géolocalisationMise en place d’une application mobile de géolocalisation
Mise en place d’une application mobile de géolocalisation
 
#Et6-At12-Accessibilité
#Et6-At12-Accessibilité#Et6-At12-Accessibilité
#Et6-At12-Accessibilité
 
Concevoir un site accessible avec le RGAA (2010)
Concevoir un site accessible avec le RGAA (2010)Concevoir un site accessible avec le RGAA (2010)
Concevoir un site accessible avec le RGAA (2010)
 
#compublique Connaître et développer les outils de mise en accessibilité de s...
#compublique Connaître et développer les outils de mise en accessibilité de s...#compublique Connaître et développer les outils de mise en accessibilité de s...
#compublique Connaître et développer les outils de mise en accessibilité de s...
 
Accessibilité du Web et RGAA
Accessibilité du Web et RGAAAccessibilité du Web et RGAA
Accessibilité du Web et RGAA
 
Projet de médiation numérique de la médiathèque George Sand de Moirans
Projet de médiation numérique de la médiathèque George Sand de MoiransProjet de médiation numérique de la médiathèque George Sand de Moirans
Projet de médiation numérique de la médiathèque George Sand de Moirans
 
Adaptation du poste de travail Windows
Adaptation du poste de travail Windows Adaptation du poste de travail Windows
Adaptation du poste de travail Windows
 
Omeka ou comment réaliser une bibliothèque numérique à l'échelle d'un SCD
Omeka ou comment réaliser une bibliothèque numérique à l'échelle d'un SCDOmeka ou comment réaliser une bibliothèque numérique à l'échelle d'un SCD
Omeka ou comment réaliser une bibliothèque numérique à l'échelle d'un SCD
 
Usages pédagogiques des outils nomades en info-doc
Usages pédagogiques des outils nomades en info-docUsages pédagogiques des outils nomades en info-doc
Usages pédagogiques des outils nomades en info-doc
 
Une App responsable pour de la mobilité durable
Une App responsable pour de la mobilité durableUne App responsable pour de la mobilité durable
Une App responsable pour de la mobilité durable
 
L’accessibilité web pour les organismes publics
L’accessibilité web pour les organismes publicsL’accessibilité web pour les organismes publics
L’accessibilité web pour les organismes publics
 
Conception ingenierie-multimedia
Conception ingenierie-multimediaConception ingenierie-multimedia
Conception ingenierie-multimedia
 
130516-AccessibiliteAAS-Soutenance-LAST
130516-AccessibiliteAAS-Soutenance-LAST130516-AccessibiliteAAS-Soutenance-LAST
130516-AccessibiliteAAS-Soutenance-LAST
 

Plus de Lesticetlart Invisu

Kit de survie : Les bases de données
Kit de survie : Les bases de donnéesKit de survie : Les bases de données
Kit de survie : Les bases de donnéesLesticetlart Invisu
 
Kit de survie: Création et gestion d'une bibliothèque d'images numériques
Kit de survie: Création et gestion d'une bibliothèque d'images numériquesKit de survie: Création et gestion d'une bibliothèque d'images numériques
Kit de survie: Création et gestion d'une bibliothèque d'images numériquesLesticetlart Invisu
 
Kit de survie : Gestion et traitement des images numériques
Kit de survie : Gestion et traitement des images numériquesKit de survie : Gestion et traitement des images numériques
Kit de survie : Gestion et traitement des images numériquesLesticetlart Invisu
 
OpenRefine: traitement de données en masse
OpenRefine: traitement de données en masseOpenRefine: traitement de données en masse
OpenRefine: traitement de données en masseLesticetlart Invisu
 
Images numériques et métadonnées, seconde partie du 10 mars 2016
Images numériques et métadonnées, seconde partie du 10 mars 2016Images numériques et métadonnées, seconde partie du 10 mars 2016
Images numériques et métadonnées, seconde partie du 10 mars 2016Lesticetlart Invisu
 
Gérer ses références bibliographiques avec Zotero
Gérer ses références bibliographiques avec ZoteroGérer ses références bibliographiques avec Zotero
Gérer ses références bibliographiques avec ZoteroLesticetlart Invisu
 
L'ouverture des données de la recherche en 2015 : définitions, enjeux, dynami...
L'ouverture des données de la recherche en 2015 : définitions, enjeux, dynami...L'ouverture des données de la recherche en 2015 : définitions, enjeux, dynami...
L'ouverture des données de la recherche en 2015 : définitions, enjeux, dynami...Lesticetlart Invisu
 
Structurer, relier et diffuser des données avec les technologies du web séman...
Structurer, relier et diffuser des données avec les technologies du web séman...Structurer, relier et diffuser des données avec les technologies du web séman...
Structurer, relier et diffuser des données avec les technologies du web séman...Lesticetlart Invisu
 
Les TIC et l'art: Wikipedia et GeoNames
Les TIC et l'art: Wikipedia et GeoNamesLes TIC et l'art: Wikipedia et GeoNames
Les TIC et l'art: Wikipedia et GeoNamesLesticetlart Invisu
 
IdRef – Référentiels pour l’Enseignement Supérieur et la Recherche
IdRef – Référentiels pour l’Enseignement Supérieur et la RechercheIdRef – Référentiels pour l’Enseignement Supérieur et la Recherche
IdRef – Référentiels pour l’Enseignement Supérieur et la RechercheLesticetlart Invisu
 
Images numériques et métadonnées: traitement et diffusion, seconde partie
Images numériques et métadonnées: traitement et diffusion, seconde partieImages numériques et métadonnées: traitement et diffusion, seconde partie
Images numériques et métadonnées: traitement et diffusion, seconde partieLesticetlart Invisu
 
Le Thésaurus pour l'indexation des archives locales et le Web de données, INH...
Le Thésaurus pour l'indexation des archives locales et le Web de données, INH...Le Thésaurus pour l'indexation des archives locales et le Web de données, INH...
Le Thésaurus pour l'indexation des archives locales et le Web de données, INH...Lesticetlart Invisu
 
Réaliser un plan de gestion de données
Réaliser un plan de gestion de donnéesRéaliser un plan de gestion de données
Réaliser un plan de gestion de donnéesLesticetlart Invisu
 
Accompagnement actif des chercheurs à la gestion et au partage des données de...
Accompagnement actif des chercheurs à la gestion et au partage des données de...Accompagnement actif des chercheurs à la gestion et au partage des données de...
Accompagnement actif des chercheurs à la gestion et au partage des données de...Lesticetlart Invisu
 

Plus de Lesticetlart Invisu (20)

Invisu plaquette 2017
Invisu plaquette 2017Invisu plaquette 2017
Invisu plaquette 2017
 
Publier à quel prix?
Publier à quel prix? Publier à quel prix?
Publier à quel prix?
 
Plaquette InVisu 2016
Plaquette InVisu 2016Plaquette InVisu 2016
Plaquette InVisu 2016
 
Kit de survie : Les bases de données
Kit de survie : Les bases de donnéesKit de survie : Les bases de données
Kit de survie : Les bases de données
 
Kit de survie: Création et gestion d'une bibliothèque d'images numériques
Kit de survie: Création et gestion d'une bibliothèque d'images numériquesKit de survie: Création et gestion d'une bibliothèque d'images numériques
Kit de survie: Création et gestion d'une bibliothèque d'images numériques
 
Kit de survie : Gestion et traitement des images numériques
Kit de survie : Gestion et traitement des images numériquesKit de survie : Gestion et traitement des images numériques
Kit de survie : Gestion et traitement des images numériques
 
Atelier Zotero intermédiaire
Atelier Zotero intermédiaireAtelier Zotero intermédiaire
Atelier Zotero intermédiaire
 
OpenRefine: traitement de données en masse
OpenRefine: traitement de données en masseOpenRefine: traitement de données en masse
OpenRefine: traitement de données en masse
 
Images numériques et métadonnées, seconde partie du 10 mars 2016
Images numériques et métadonnées, seconde partie du 10 mars 2016Images numériques et métadonnées, seconde partie du 10 mars 2016
Images numériques et métadonnées, seconde partie du 10 mars 2016
 
Gérer ses références bibliographiques avec Zotero
Gérer ses références bibliographiques avec ZoteroGérer ses références bibliographiques avec Zotero
Gérer ses références bibliographiques avec Zotero
 
Dossier thématique droit cnrs
Dossier thématique droit cnrsDossier thématique droit cnrs
Dossier thématique droit cnrs
 
Plaquette InVisu 2015
Plaquette InVisu 2015Plaquette InVisu 2015
Plaquette InVisu 2015
 
L'ouverture des données de la recherche en 2015 : définitions, enjeux, dynami...
L'ouverture des données de la recherche en 2015 : définitions, enjeux, dynami...L'ouverture des données de la recherche en 2015 : définitions, enjeux, dynami...
L'ouverture des données de la recherche en 2015 : définitions, enjeux, dynami...
 
Structurer, relier et diffuser des données avec les technologies du web séman...
Structurer, relier et diffuser des données avec les technologies du web séman...Structurer, relier et diffuser des données avec les technologies du web séman...
Structurer, relier et diffuser des données avec les technologies du web séman...
 
Les TIC et l'art: Wikipedia et GeoNames
Les TIC et l'art: Wikipedia et GeoNamesLes TIC et l'art: Wikipedia et GeoNames
Les TIC et l'art: Wikipedia et GeoNames
 
IdRef – Référentiels pour l’Enseignement Supérieur et la Recherche
IdRef – Référentiels pour l’Enseignement Supérieur et la RechercheIdRef – Référentiels pour l’Enseignement Supérieur et la Recherche
IdRef – Référentiels pour l’Enseignement Supérieur et la Recherche
 
Images numériques et métadonnées: traitement et diffusion, seconde partie
Images numériques et métadonnées: traitement et diffusion, seconde partieImages numériques et métadonnées: traitement et diffusion, seconde partie
Images numériques et métadonnées: traitement et diffusion, seconde partie
 
Le Thésaurus pour l'indexation des archives locales et le Web de données, INH...
Le Thésaurus pour l'indexation des archives locales et le Web de données, INH...Le Thésaurus pour l'indexation des archives locales et le Web de données, INH...
Le Thésaurus pour l'indexation des archives locales et le Web de données, INH...
 
Réaliser un plan de gestion de données
Réaliser un plan de gestion de donnéesRéaliser un plan de gestion de données
Réaliser un plan de gestion de données
 
Accompagnement actif des chercheurs à la gestion et au partage des données de...
Accompagnement actif des chercheurs à la gestion et au partage des données de...Accompagnement actif des chercheurs à la gestion et au partage des données de...
Accompagnement actif des chercheurs à la gestion et au partage des données de...
 

Dernier

DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptx
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptxDIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptx
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptxMartin M Flynn
 
Apprendre avec des top et nano influenceurs
Apprendre avec des top et nano influenceursApprendre avec des top et nano influenceurs
Apprendre avec des top et nano influenceursStagiaireLearningmat
 
Pas de vagues. pptx Film français
Pas de vagues.  pptx   Film     françaisPas de vagues.  pptx   Film     français
Pas de vagues. pptx Film françaisTxaruka
 
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...NaimDoumissi
 
Pas de vagues. pptx Film français
Pas de vagues.  pptx      Film   françaisPas de vagues.  pptx      Film   français
Pas de vagues. pptx Film françaisTxaruka
 
La Base unique départementale - Quel bilan, au bout de 5 ans .pdf
La Base unique départementale - Quel bilan, au bout de 5 ans .pdfLa Base unique départementale - Quel bilan, au bout de 5 ans .pdf
La Base unique départementale - Quel bilan, au bout de 5 ans .pdfbdp12
 
Chana Orloff.pptx Sculptrice franco-ukranienne
Chana Orloff.pptx Sculptrice franco-ukranienneChana Orloff.pptx Sculptrice franco-ukranienne
Chana Orloff.pptx Sculptrice franco-ukranienneTxaruka
 
PIE-A2-P 5- Supports stagiaires.pptx.pdf
PIE-A2-P 5- Supports stagiaires.pptx.pdfPIE-A2-P 5- Supports stagiaires.pptx.pdf
PIE-A2-P 5- Supports stagiaires.pptx.pdfRiDaHAziz
 
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdf
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdfVulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdf
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdfSylvianeBachy
 
Faut-il avoir peur de la technique ? (G. Gay-Para)
Faut-il avoir peur de la technique ? (G. Gay-Para)Faut-il avoir peur de la technique ? (G. Gay-Para)
Faut-il avoir peur de la technique ? (G. Gay-Para)Gabriel Gay-Para
 
PIE-A2-P4-support stagiaires sept 22-validé.pdf
PIE-A2-P4-support stagiaires sept 22-validé.pdfPIE-A2-P4-support stagiaires sept 22-validé.pdf
PIE-A2-P4-support stagiaires sept 22-validé.pdfRiDaHAziz
 
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptx
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptxPrésentation - Initiatives - CECOSDA - OIF - Fact Checking.pptx
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptxJCAC
 
Cours de Management des Systèmes d'information
Cours de Management des Systèmes d'informationCours de Management des Systèmes d'information
Cours de Management des Systèmes d'informationpapediallo3
 
Bernard Réquichot.pptx Peintre français
Bernard Réquichot.pptx   Peintre françaisBernard Réquichot.pptx   Peintre français
Bernard Réquichot.pptx Peintre françaisTxaruka
 
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...Bibdoc 37
 
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdf
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdfBibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdf
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdfBibdoc 37
 
Bibdoc 2024 - Ecologie du livre et creation de badge.pdf
Bibdoc 2024 - Ecologie du livre et creation de badge.pdfBibdoc 2024 - Ecologie du livre et creation de badge.pdf
Bibdoc 2024 - Ecologie du livre et creation de badge.pdfBibdoc 37
 

Dernier (18)

Bulletin des bibliotheques Burkina Faso mars 2024
Bulletin des bibliotheques Burkina Faso mars 2024Bulletin des bibliotheques Burkina Faso mars 2024
Bulletin des bibliotheques Burkina Faso mars 2024
 
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptx
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptxDIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptx
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptx
 
Apprendre avec des top et nano influenceurs
Apprendre avec des top et nano influenceursApprendre avec des top et nano influenceurs
Apprendre avec des top et nano influenceurs
 
Pas de vagues. pptx Film français
Pas de vagues.  pptx   Film     françaisPas de vagues.  pptx   Film     français
Pas de vagues. pptx Film français
 
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...
 
Pas de vagues. pptx Film français
Pas de vagues.  pptx      Film   françaisPas de vagues.  pptx      Film   français
Pas de vagues. pptx Film français
 
La Base unique départementale - Quel bilan, au bout de 5 ans .pdf
La Base unique départementale - Quel bilan, au bout de 5 ans .pdfLa Base unique départementale - Quel bilan, au bout de 5 ans .pdf
La Base unique départementale - Quel bilan, au bout de 5 ans .pdf
 
Chana Orloff.pptx Sculptrice franco-ukranienne
Chana Orloff.pptx Sculptrice franco-ukranienneChana Orloff.pptx Sculptrice franco-ukranienne
Chana Orloff.pptx Sculptrice franco-ukranienne
 
PIE-A2-P 5- Supports stagiaires.pptx.pdf
PIE-A2-P 5- Supports stagiaires.pptx.pdfPIE-A2-P 5- Supports stagiaires.pptx.pdf
PIE-A2-P 5- Supports stagiaires.pptx.pdf
 
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdf
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdfVulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdf
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdf
 
Faut-il avoir peur de la technique ? (G. Gay-Para)
Faut-il avoir peur de la technique ? (G. Gay-Para)Faut-il avoir peur de la technique ? (G. Gay-Para)
Faut-il avoir peur de la technique ? (G. Gay-Para)
 
PIE-A2-P4-support stagiaires sept 22-validé.pdf
PIE-A2-P4-support stagiaires sept 22-validé.pdfPIE-A2-P4-support stagiaires sept 22-validé.pdf
PIE-A2-P4-support stagiaires sept 22-validé.pdf
 
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptx
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptxPrésentation - Initiatives - CECOSDA - OIF - Fact Checking.pptx
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptx
 
Cours de Management des Systèmes d'information
Cours de Management des Systèmes d'informationCours de Management des Systèmes d'information
Cours de Management des Systèmes d'information
 
Bernard Réquichot.pptx Peintre français
Bernard Réquichot.pptx   Peintre françaisBernard Réquichot.pptx   Peintre français
Bernard Réquichot.pptx Peintre français
 
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...
 
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdf
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdfBibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdf
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdf
 
Bibdoc 2024 - Ecologie du livre et creation de badge.pdf
Bibdoc 2024 - Ecologie du livre et creation de badge.pdfBibdoc 2024 - Ecologie du livre et creation de badge.pdf
Bibdoc 2024 - Ecologie du livre et creation de badge.pdf
 

Les TIC et l'art : l'Accessibilité numérique

  • 1. Accessibilité numérique Premiers pas Les TICs et l’art – 6 décembre 2011 Magali Oualid Expert AccessiWeb en évaluation 1
  • 2. Sommaire Présentation générale de l'accessibilité numérique ............................................................................................................. 3 Définition .......................................................................................................................................................................... 3 Les différents handicaps et les solutions associées .......................................................................................................... 3 Handicaps visuels .......................................................................................................................................................... 3 Handicaps auditifs......................................................................................................................................................... 3 Handicaps moteurs ....................................................................................................................................................... 3 Handicaps cognitifs ....................................................................................................................................................... 4 Tous les autres utilisateurs ............................................................................................................................................... 4 Ce qu'il faut retenir ........................................................................................................................................................... 4 Les moyens de mise en œuvre de l'accessibilité numerique ............................................................................................ 4 Les recommandations internationales ......................................................................................................................... 4 Les initiatives nationales ............................................................................................................................................... 5 Le cadre légal français ................................................................................................................................................... 5 Les personnes concernées ............................................................................................................................................ 6 Le calendrier de mise en œuvre ................................................................................................................................... 6 Le périmètre de mise en œuvre sur un site web .............................................................................................................. 7 Mise en œuvre : les critères incontournables ...................................................................................................................... 8 Sur un site web ................................................................................................................................................................. 8 Les images ..................................................................................................................................................................... 9 Les couleurs .................................................................................................................................................................. 9 Les contenus multimedia ............................................................................................................................................ 10 Les tableaux ................................................................................................................................................................ 10 Les liens....................................................................................................................................................................... 11 Structuration et présentation de l'information .......................................................................................................... 11 L'éditorial .................................................................................................................................................................... 12 Navigation et consultation .......................................................................................................................................... 12 Sur les documents mis en téléchargement..................................................................................................................... 13 L'accessibilité des PDF................................................................................................................................................. 13 Les documents Word .................................................................................................................................................. 14 2
  • 3. PRÉSENTATION GÉNÉRALE DE L'ACCESSIBILITÉ NUMÉRIQUE Un mot d’introduction : pourquoi l’accessibilité numérique est-elle devenue un enjeu important aujourd’hui ? - Développement du web dans tous les domaines de la vie sociale et professionnelle - L’accessibilité numérique, dont l’objectif est de rendre les contenus numériques consultables et utilisables par tous : - Est un facteur important de l’insertion sociale et professionnelle pour tous - Par la prise en compte de toutes les situations (handicaps, environnement technique, cultures/langues…) - Et bénéficie en retour aux producteurs des contenus eux-mêmes (élargissement de leur audience et de leur visibilité) DÉFINITION L'accessibilité numérique a pour objectif l'accès à l’information pour tous, quels que soient : - Les capacités physiques de l’utilisateur - Les capacités intellectuelles de l’utilisateur - Le matériel ou les logiciels utilisés - Le type de terminal utilisé - La qualité du réseau utilisé La loi de 2005 s’intéresse particulièrement aux personnes handicapées, et par ailleurs, l’accessibilité du web s’est développée au départ grâce à la pression des associations de personnes malvoyantes et non voyantes. Nous allons donc passer en revue des différents handicaps pour mieux comprendre le contexte. LES DIFFÉRENTS HANDICAPS ET LES SOLUTIONS ASSOCIÉES HANDICAPS VISUELS De la malvoyance à la cécité. Problèmes rencontrés : - Images et objets multimédias - Liens - Tableaux et cadres - Utilisation de la couleur, contrastes - Utilisation de la souris Outils : - Configuration du navigateur - Loupes d’écran - Synthèse vocale - Plage braille HANDICAPS AUDITIFS Différents niveaux de surdité, donc de capacité de lecture. Problèmes rencontrés : - Informations sonores - Informations textuelles Outils - Transcriptions spécifiques - Vidéos en langue des signes HANDICAPS MOTEURS 3
  • 4. Contrôle musculaire, membre manquant, douleurs au mouvement. Problèmes rencontrés : - Utilisation du clavier et de la souris Outils - Clavier et souris adaptés - Logiciel de commande vocale - Trackball - Clavier virtuel HANDICAPS COGNITIFS Difficultés d’attention, de compréhension, de mémorisation, d’apprentissage. Problèmes rencontrés / Aide apportée par l’ergonomie du site - Navigation incohérente - Pages longues, Syntaxe compliquée - Animations TOUS LES AUTRES UTILISATEURS 1. L’étudiant sur un poste de l’université dont il n’est pas administrateur : impossible d’installer un module complémentaire si besoin : flash, adobe reader… 2. L’élève ou le parent en milieu rural qui ne dispose pas chez lui d’une liaison ADSL : Difficulté pour télécharger contenus multimedias ou fichiers volumineux (cf academie en ligne.fr) 3. Le citoyen qui utilise une borne internet à sa mairie : taille de l’écran, aucune possibilité d’installer un module supplémentaire si besoin 4. Une personne ne parlant pas notre langue : besoin de traduction du site (niveau d’accessibilité élevé) 5. Un utilisateur qui navigue sur son mobile… : les images, vidéos, fichiers à télécharger ralentissent la navigation ; la résolution d’écran doit aussi être prise en compte. CE QU'IL FAUT RETENIR L’accessibilité du web adresse tous les handicaps Et pas seulement le handicap visuel Au-delà, l’accessibilité concerne tous les utilisateurs par la prise en compte de tout type de configuration, matériel, réseau, logiciel Un site accessible est par ailleurs - plus facile à maintenir et à faire évoluer parce que structuré et robuste - plus facile à utiliser par tous par la prise en compte de tous les contextes d’utilisation - mieux référencé (libellés de liens clairs et explicites, utilisation des balises de titre , etc) LES MOYENS DE MISE EN ŒUVRE DE L'ACCESSIBILITÉ NUMERIQUE LES RECOMMANDATIONS INTERNATIONALES En 1996 : Web Accessibility Initiative lancée par le W3C (World Wide Web Consortium) - Normes pour les outils de production de contenus - Normes pour les contenus eux-mêmes (WCAG) - Normes pour les outils de consultation des contenus (navigateurs) C’est la combinaison de l’ensemble de ces normes qui garantit l’accessibilité. Exemples : Outils de production : 4
  • 5. critère : prévoir un champ pour saisir l’alternative de l’image insérée dans le contenu Contenus : critère : insérer une alternative textuelle pertinente pour toute image insérée dans le contenu (pertinente signifie transcription de l’information apportée par l’image ; si pas d’information, codage spécifique prévu) Outils de consultation : critère : interpréter correctement l’alternative de l’image (si la valeur correspond au codage d’une image de décoration, le navigateur ignorera l’alternative). En tant que producteurs de contenus, nous sommes concernés par les normes relatives aux contenus. Trois niveaux de conformité sont distingués : A (bronze pour AW) : ce qui doit être fait AA (argent pour AW) : ce qui devrait être fait AAA (or pour AW) : ce qui pourrait être fait Exemples de critères : - Alternative textuelle pertinente sur les images : relève de la responsabilité des contributeurs - Libellés de liens explicites hors contexte : relève de la responsabilité des contributeurs - Code source conforme au modèle déclaré en entête du code (standards du web) : relève de la responsabilité des développeurs - Navigation cohérente, avec menu et fil d’ariane par ex : relève de la responsabilité des graphistes - Codage des tableaux pour pouvoir relier chaque cellule à son entête de colonne : relève de la responsabilité des développeur et contributeur LES INITIATIVES NATIONALES L’Association Braillenet vise à encourager le développement d’Internet au service des personnes handicapées, dans les domaines de l’information, de l’éducation et de la culture. A ces différents titres, elle a lancé de nombreuses initiatives : - Accessiweb : centre de ressources et de recherche sur l’accessibilité du web - Définition d’un référentiel basé sur les recommandations internationales - un guide d’utilisation, un label de certification pour les sites web, - un grand nombre de formations spécialisées - La bibliothèque Hélène : + de 7.000 ouvrages numériques accessibles aux personnes déficientes visuelles - L’institut de l’accessibilité numérique : - Créé par l’Université Pierre et Marie Curie, l’Institut National de recherche en informatique et en automatique et Universcience et l’association BrailleNet - vocation de coordonner les initiatives et les compétences mobilisées pour assurer un accès égal à tous à l’information - il intervient dans quatre domaines principaux : • la recherche et développement • les enseignements • la certification de conformité aux standards internationaux • la veille permanente en matière de bonnes pratiques LE CADRE LÉGAL FRANÇAIS - Le cadre juridique 5
  • 6. - La loi 2005-102 du 11 février 2005 pour l’égalité des droits et des chances, la participation et la citoyenneté des personnes handicapées (article 47) - Décret d’application : 14 mai 2009 (publié le 16/05/09) - Référentiel RGAA paru le 01/10/2009 - Le cadre institutionnel - La DGME : élaboration du référentiel - Le CIH : mise en œuvre et accompagnement Il est à noter que ce dispositif ne prévoit pour toute sanction que l'inscription du site non conforme sur une liste (non effective à ce jour). LES PERSONNES CONCERNÉES LES PUBLICS - Administrés ; les types de contenus concernés sont les : - Sites internets institutionnels - Toute interface web destinée au public - Tout document numérique mis en ligne - Personnels les types de contenus concernés sont les : - Sites intranets - Toute interface web utilisée dans le cadre du travail - Tout document numérique mis en ligne sur les intranets et applications web LES RESPONSABLES MISE EN OEUVRE - L’équipe projet - Décideurs - Chef de projet - développeurs - Les contributeurs - Webmestres - Producteurs de documents mis en ligne - Les organismes de formation - Obligation de formation prévue par le décret LES BENEFICIAIRES - Les internautes et intranautes - Accès à toute l’information - L’administration émettrice - Qualité de service - Portabilité sur tout type de réseau - Élargissement de son audience, meilleur référencement - Facilité de maintenance LE CALENDRIER DE MISE EN ŒUVRE - Délais généraux - 2 ans pour les sites existants >> 15/05/2011 - Applicabilité immédiate pour tout nouveau site, nouveau contenu - Dans le cadre d’un projet - Prise en compte dès le lancement 6
  • 7. - Prise en compte à chaque étape du projet - Au quotidien - Responsabilité du maintien de l’accessibilité : les contributeurs de site et producteurs de documents numériques LE PÉRIMÈTRE DE MISE EN ŒUVRE SUR UN SITE WEB Le périmètre de l’accessibilité d’un projet web englobe à la fois le site, les outils et les personnes intervenant à différents titres sur le projet. ère 1 zone du périmètre : Le site web Ce terme désigne les pages destinées aux utilisateurs (internautes), sur lesquelles les contenus doivent être accessibles à tous quelle que soit la manière de naviguer sur Internet, ainsi que tous les fluxs qu’il propose : • courriels, • syndications de contenus • fichiers à télécharger • échanges avec les réseaux sociaux • services en ligne tels que les inscriptions aux concours, ou le suivi de son dossier administratif (enseignants) Il s’agit de la première zone à laquelle on pense lorsque l’on évoque l’accessibilité d’un site. ème 2 zone du périmètre : Les outils de publication et d’administration L’outil de publication doit permettre aux contributeurs de mettre en œuvre l’accessibilité lorsqu’ils créent des contenus à publier sur le site : - alternative textuelle des images : un champ doit être disponible lors de l’insertion de l’image dans un article pour saisir cette alternative - titre des liens : certains liens nécessitent de donner des informations complémentaires à leur libellé, par exemple : - qu’il s’agit d’un fichier à télécharger de tel format, tel poids, - ou qu’il s’agit d’un lien externe qui s’ouvrira en nouvelle fenêtre - Dans ce cas, l’outil de publication doit permettre de renseigner un attribut spécifique du lien permettant de donner cette information - changements de langue par rapport à la langue du site - structuration du texte : l’outil doit permettre l’insertion de niveaux de titres - Etc ème 3 zone du périmètre : L’équipe projet Constituée de La maîtrise d’ouvrage : l’administration, l’entreprise qui commande le site (ou sa refonte) et la maîtrise d’œuvre : les équipes techniques internes, le(s) prestataire(s) d’intégration/développement/graphique Intervient dans la mise en œuvre de l’accessibilité : de la conception du site (expression du besoin par la maîtrise d’ouvrage) à sa réalisation par la maîtrise d’œuvre (développeurs, graphistes, intégrateurs - choix des outils, intégration dans les développements…) et ensuite pour la maintenance du site. Ces acteurs sont inclus dans le périmètre de l’accessibilité du site au titre des compétences concrètes qu’ils doivent avoir. ème 4 zone du périmètre : Les contributeurs : 7
  • 8. 3 types de contributeurs (au sens producteurs de contenus) peuvent être distingués : Les contributeurs directs Ce sont ceux qui travaillent dans l’outil de publication : ils font partie du périmètre à prendre en compte dans le cadre du projet en tant que destinataires des actions d’accompagnement liées à l’accessibilité. Les contributeurs indirects internes Le contenus ne sont pas seulement produits dans l’outil de publication : les fichiers en téléchargement par exemple proviennent souvent de contributeurs indirects du site (mais internes à l’organisation). Ils seront eux-aussi destinataires d’actions d’accompagnement liées à l’objectif d’accessibilité du site. Les contributeurs indirects externes Ces fichiers peuvent aussi être fournis par des contributeurs externes à la structure (prestataire, sur commande), mais ces contributeurs externes fournissent le plus souvent les contenus multimédias (vidéos, animations flash…) : les services qui les gèrent, qui passent les commandes, doivent savoir quoi exiger en termes d’accessibilité et ces prestataires doivent s’y conformer. A ce titre, ils entrent dans le périmètre de l’accessibilité du site à prendre en compte par l’équipe projet. En synthèse : L’accessibilité ne s’arrête pas aux outils de gestion du site il faut tenir compte aussi des outils de développement, et des process de création de contenus hors outil de gestion du site La mise en œuvre de l’accessibilité ne concerne pas que les « webmestres » mais aussi : l’équipe technique, les contributeurs directs, les contributeurs indirects internes ou externes MISE EN ŒUVRE : LES CRITÈRES INCONTOURNABLES SUR UN SITE WEB Les thématiques abordées sont les suivantes : - Les images - Les couleurs - Le multimédia - Les tableaux - Les liens - Les éléments obligatoires - La structuration de l’information - La présentation de l’information - Les formulaires - La navigation - La consultation Pour chacune des thématiques abordées, seuls les critères à la charge des contributeurs seront abordés. (donc toutes les thématiques ne sont pas vues) Ex : images : toute image doit avoir une alternative textuelle - développeur/éditeur d’outil de publication : doit prévoir le champ de saisie - contributeur : doit renseigner le alt de façon pertinente - éditeur de navigateur : doit prévoir l’interprétation correcte de la valeur saisie 8
  • 9. Par ailleurs, seuls les critères de niveau A seront pris en compte (bronze, la présentation s’appuyant sur le référentiel Accessiweb plutôt que le RGAA). LES IMAGES • Principe – Toute image porteuse d’information • Texte • Liens • Chiffres • Information complémentaire au texte – doit avoir une alternative textuelle • Attribut html alt – Cette alternative doit être pertinente • Restitution de l’information portée par l’image Utilisateur concerné : - utilisateur de synthèse vocale (personne non voyante) - utilisateur d’un navigateur textuel (personne présentant un handicap cognitif ou moteur ; les images ne s’affichent pas) - utilisateur disposant d’une liaison bas débit ou naviguant sur un téléphone portable (désactivation des images pour rendre la navigation plus fluide) Image texte : à utiliser seulement si le style du texte ne peut pas être restitué par une feuille de style (police inexistante, logo…) Image lien : la destination du lien est une information de navigation Image avec des chiffres : n° de téléphone, statistiques, chiffres clés Information complémentaire : ex, photo de l’arrivée d’une course, qui montre qui est le gagnant (à condition que ce ne soit pas dit dans le texte de l’article associé à l’image) Mise en œuvre par les contributeurs : - le champ « alt » doit être systématiquement renseigné - pour être pertinente, la valeur saisit doit être conforme aux règles suivantes : o image décorative : valeur = "" (la synthèse vocale ne lira rien, on parle de alt vide) o image texte : valeur = le texte de l’image o image lien : valeur = destination du lien + information complémentaire si besoin (ex : ouverture en nouvelle fenêtre, cf « Les liens ») o si l’image lien est en doublon avec un libellé de lien « en clair », le mieux est de poser un seul lien sur le tout (libellé + image) - la valeur de l’alternative doit être la plus concise possible (80 caractères, exceptionnellement plus longue) LES COULEURS • Principes : – la couleur ne doit pas être utilisée seule pour donner une information ; – un contraste suffisant doit exister entre les couleurs du texte et du fond. Utilisateur concerné : - utilisateur mal voyant - utilisateur ne distinguant pas les couleurs Mise en œuvre par les contributeurs : Site web : les couleurs sont gérées uniquement par la charte graphique du site 9
  • 10. Ne pas utiliser la couleur seule pour mettre en avant une partie du texte d’un contenu (associer par ex du gras [mais pas de souligné]) Texte de petite taille : le contraste minimum entre le texte et le fond doit être de 4,5 Texte de grande taille (150% min de la taille du texte par défaut, ou 120% gras) : le contraste minimum doit être de 3 LES CONTENUS MULTIMEDIA • Principe : tout contenu multimedia (vidéo, son, animation) doit avoir si nécessaire – une transcription textuelle, – des sous-titres synchronisés pertinents – une audio description pertinente. – Et le contrôle de leur consultation doit être possible (arrêt, pause, reprise). Utilisateur concerné : - utilisateur présentant des déficiences auditives et/ou visuelles - utilisateur ne disposant pas du logiciel nécessaire - utilisateur disposant d’une liaison bas débit (téléchargement ou consultation impossible ou très difficile) Mise en œuvre par les contributeurs : - Animations flash : o si l’animation contient du texte, elle doit avoir une alternative textuelle : o soit un lien vers un fichier à télécharger (format accessible : txt, pdf accessible) o soit un lien vers une page web o le lien de l’alternative doit être associé de manière évidente à l’animation o dans tous les cas, une animation flash doit pouvoir être contrôlée : arrêt, pause, reprise - Vidéos : chaque vidéo doit être accompagnée à minima : o d’une transcription textuelle (transcription des discours/dialogues, description des actions…) o de sous-titres synchronisés o En général, le contrôle de la consultation d’une vidéo est implémenté dans les lecteurs utilisés. LES TABLEAUX • Principe : associer à chaque tableau les informations nécessaires à leur lecture ou leur interprétation par les aides techniques ou par un navigateur ayant une configuration spécifique : – Titre – Résumé – Relations entre les cellules et les entêtes de lignes et de colonnes Utilisateur concerné : - utilisateur de synthèse vocale (personne non voyante) - utilisateur de navigateur textuel (personne présentant un handicap cognitif ou moteur) - utilisateur disposant de feuilles de styles spécifiques Mise en œuvre par les contributeurs : Tableaux de données : il faut renseigner les éléments suivants dans les propriétés du tableau : • résumé du tableau, concis et pertinent : à renseigner dans les propriétés avancées • titre du tableau, concis et pertinent = champ « légende du tableau » [balise caption dans le code html] • éléments html permettant d’établir les relations entre chaque cellule et les entêtes de colonnes et de lignes [th, header, id] (voir diapo suivante) • sens de lecture du tableau 10
  • 11. Tableaux de mise en forme : sont déconseillés (sinon, il faut garantir que l’information sera restituée correctement en cas de linéarisation du tableau) LES LIENS • Principes : – Donner des intitulés de liens explicites (hors contexte) • et le moins long possible – Informer l’utilisateur sur l’ouverture éventuelle du lien en nouvelle fenêtre Utilisateur concerné : - utilisateur de synthèse vocale (personne non voyante) - utilisateur présentant un handicap moteur - Ces deux types d’utilisateur ont la possibilité d’afficher la liste des liens de la page dans une nouvelle fenêtre pour une navigation plus rapide. Mise en œuvre : Libellé du lien : • concis (auparavant, limité à 80 caractères, plus de limite aujourd’hui mais concision attendue) • Explicite : devait être explicite hors contexte en V1 ; aujourd’hui, le contexte peut être pris en compte (titre précédent, title du lien, élément précédent de l’énumération…) Titre du lien (info bulle) : • ne doit être renseigné que s’il est nécessaire d’ajouter une information complémentaire au libellé du lien ; ex : ouverture en nouvelle fenêtre, description du fichier à télécharger (format, taille, poids) • doit contenir le libellé du lien + les informations complémentaires (parce que les synthèses vocales liront le champ le plus long entre le libellé et le titre du lien, mais pas les deux) Sur une même page, deux liens avec le même libellé doivent conduire vers la même page >> il faut éviter les liens « en savoir plus », « cliquez ici »… STRUCTURATION ET PRÉSENTATION DE L'INFORMATION • Principes : – Utiliser des titres pour structurer un contenu – Respecter la hiérarchie des titres – Baliser correctement les sigles et les listes – Ne pas justifier le texte – Séparer la forme et le fond (CSS) Utilisateur concerné : - tout internaute - utilisateur de synthèse vocale ou de plage braille (personne non voyante) - Utilisateur présentant un handicap cognitif Titres : - Les titres permettent une prise de connaissance rapide du contenu de la page - Sauter un niveau de titre (pour une raison de mise en forme par ex) rend la structuration de la page incohérente - Le libellé du titre doit permettre une compréhension immédiate de l’information qu’il coiffe Sigles : - La balise acronyme doit être utilisée pour les sigles qui peuvent être lus comme un mot - La balise abréviation doit être utilisée pour les sigles qui sont lus lettre à lettre 11
  • 12. - La première occurrence sur une page doit avoir un attribut « title » donnant son libellé complet Listes - Les listes à puces et les listes numérotées doivent être balisées avec les bons éléments html (ul, ol, li) - Pour les listes de définition : dl, li (à ne pas utiliser pour faire de la mise en forme) La séparation de la forme et du fond est gérée par l’utilisation de CSS >> pas de mise en forme dans les contenus eux- mêmes. Cela permet à l’utilisateur d’appliquer éventuellement la feuille de style adaptée à son handicap L'ÉDITORIAL • Principes : – Les changements de langue doivent être indiqués – Le texte doit être rédigé dans un langage clair et compréhensible par tous Utilisateur concerné : - tout internaute - utilisateur de synthèse vocale ou de plage braille (personne non voyante). Mise en œuvre par les contributeurs : - Les changements de langue par rapport à la langue du site (indiquée dans le code source) doivent être indiqués (attribut html « lang ») La fonction doit être présente dans l’éditeur de texte ou bien il faut pouvoir accéder au code source du contenu pour ajouter la balise. - pas de « syntaxe cryptique » , langage clair et compréhensible par tous ou alternative textuelle à un texte contenant du « jargon » (langage pro spécifique) NAVIGATION ET CONSULTATION • Principes : – Les ouvertures en nouvelle fenêtre doivent être annoncées – La destination des liens doit être explicite – Les documents en téléchargement doivent être dans un format accessible – Les informations relatives au document à télécharger doivent être fournies Utilisateur concerné : - Tout utilisateur - Utilisateur de synthèse vocale (manip différente pour un retour arrière quand l’ouverture est en nouvelle fenêtre par ex) - Utilisateur disposant d’une liaison bas débit (ne voudra pas télécharger un document trop volumineux ou devra prévoir du temps pour cela) Mise en œuvre par les contributeurs : Ouverture en nouvelle fenêtre (liens) : l’information doit être donnée soit dans le libellé du lien soit dans son « titre » (title ) lequel doit contenir le libellé du lien + nouvelle fenêtre Destination du lien : le libellé du lien doit être explicite hors contexte – cf thématique liens Docs en téléchargement : - Les formats accessibles par défaut sont : HTML, txt - Les formats pouvant être rendus accessibles sont : PDF, word ou assimilé (open office) [cf diapo suivante] - Informations à fournir dans le title du lien de téléchargement : libellé du document (= libellé du lien), format, nb de pages, poids, modalité d’ouverture NB : il est conseillé d’ouvrir le document en nouvelle fenêtre pour éviter qu’en le fermant, l’utilisateur quitte le site 12
  • 13. SUR LES DOCUMENTS MIS EN TÉLÉCHARGEMENT L'ACCESSIBILITÉ DES PDF • Principes : – La langue du document est spécifiée – Les éléments non textuels ont une alternative textuelle – Le texte est structuré – Les liens sont actifs et accessibles – Les formulaires, tableaux et listes sont accessibles – Le texte peut faire l’objet d’une recherche ou d’une sélection – L’ordre de lecture est clair – Une aide à la navigation est disponible – L’interdiction de copier le texte ne doit pas être activée • Mise en œuvre Langue : menu Fichier/propriétés du document/avancées Alternatives textuelles : il faut d’abord baliser le document, puis sur chaque balise image, insérer un texte de remplacement (cf thématique images) NB : on ne balise pas les images non porteuses d’information !!! >> pour baliser : options avancées/accessibilité/ajouter des balises au document >> sur un document déjà balisé, gestion des balises avec : affichage/panneaux de navigation/balises/propriétés Structuration du texte : - Balisage du texte pour insérer des niveaux de titre Liens : libellés concis et explicites hors contextes, title si besoin + hypertexte activé (Options avancées/liens/créer à partir des urls) Formulaires : - Champs de saisie actifs - Descriptions des champs - Ordre de tabulation défini pour naviguer de champ en champ - Balisage complet du formulaire >> menu formulaire, utiliser les options d’accessibilité sur chaque item du formulaire (le menu nous fait basculer dans Adobe Designer >> pas le temps de tout passer en revue aujourd’hui ; cf le document d’Adobe http://www.adobe.com/fr/accessibility/ ) Tableaux de données : Utiliser les propriétés des balises pour déclarer les entêtes de colonnes et de lignes et les cellules du tableau Listes : Utiliser les propriétés des balises pour déclarer les listes et les articles de listes Texte sélectionnable : - Les documents scannés mis en pdf ne sont pas accessibles >> le texte doit être rendu sélectionnable (ce qui permet aussi d’y faire une recherche de mots) - Acrobat pro permet de convertir du texte scanné en texte sélectionnable : menu Document/reconnaître du texte par OCR (= reconnaissance de caractères) Ordre de lecture : (logique et simple) - Il faut d’abord baliser le document - Le panneau de gestion des balises dispose d’un onglet ordre qui permet de définir l’ordre de lecture dans chaque page Aide à la navigation : insertion de signets (bookmarks) 13
  • 14. - Il faut avoir balisé et structuré le texte - Menu Affichage/panneaux de navigation/signets >> utiliser le menu options pour créer et gérer les signets L’option de sécurité interdisant de copier le texte doit être inactive : - Parce que certaines aides techniques copient le texte pour pouvoir le lire - Par défaut, cette option est inactive Menu Fichier/propriétés du document/protection du document/modifier les options (quand « protection » est activée) LES DOCUMENTS WORD • Principes : – La langue du document est spécifiée – Les éléments non textuels ont une alternative textuelle – Le texte est structuré – Les liens sont actifs et accessibles – Les formulaires, tableaux et listes sont accessibles – Une aide à la navigation est disponible • Mise en œuvre Langue : Outils/langue/langue… Alternative aux images : Clic droit sur l’image ou menu Format/image (après l’avoir sélectionnée) Onglet « web », renseigner le champ « texte de remplacement » Structuration du texte : Utilisation des styles de titres pour hiérarchiser le texte Liens : Libellé concis et explicite hors contexte Lien hypertexte activé Formulaires : Renseigner systématiquement le champ « texte d’aide » dans les propriétés de chaque champ du formulaire Structurer le texte du formulaire par l’utilisation de styles de titres Tableaux : - Les tableaux créés dans word ne sont pas accessibles (le code html produit n’est pas « propre ») >> pour faire un word accessible, il ne doit pas contenir de tableau Listes : Les formats de liste disponibles dans word ne produisent pas de code accessible mais leur lecture par une synthèse vocale reste possible Aide à la navigation : - Insérer un sommaire automatique (il faut avoir appliqué des styles de titre auparavant) - Utiliser des ancres si besoin avec des libellés de signets explicites Un PDF généré à partir d’un word accessible sera lui-même largement accessible, voire totalement (s’il n’y a pas de tableaux). 14