« Accessibilite numerique-Structurer l information textuelle-evaluation » : différence entre les versions

Contenu supprimé Contenu ajouté
Aucun résumé des modifications
Cned-PA (discussion | contributions)
Aucun résumé des modifications
Ligne 12 :
__NOTOC__
 
===ImagesAuto-évaluation===
Prévoir l’alternative textuelle d’une image
====Mise en situation====
Voici un portrait de Beethoven, un grand musicien du XVIIIe siècle, tel qu’il est affiché dans une page web.
[[File:Activite6.1 Beethoven.png.jpg|Activite6.1 Beethoven]]
 
 
====Question 1====
<quiz shuffle="none" display="simple">
{ Parmi les éléments textuels suivants, quels sont ceux qui requièrent une attention particulière de votre part lors de la rédaction, afin de les rendre accessible ?
{ Quelle alternative textuelle proposez-vous pour cette image ? <br>''Rappel : L'alternative textuelle est le texte, court et concis, qui sera lu, en l'absence d'image.''
|| a) la notion de soustitre, c’est-à-dire de titre secondaire accolé à un titre principal, n’existe pas sur le Web et n’a donc pas à être sémantiquement marquée. Il ne s’agit pas d’un titre devant apparaître dans la table des matières.<br>
|| Réponse : On ne peut pas savoir quelle est l’alternative à cette image… TOUT DÉPEND DU CONTEXTE !<br><br>Il y a de forte chance que l’alternative que vous venez de rédiger soit inadaptée, car tout dépend du contexte :
b) titre intermédiaire, secondaire, annonçant une partie ou un paragraphe d'un article, l’intertitre est bien un titre web constituant une porte d’entrée dans le texte, et doit donc être sémantiquement marqué comme tel.
insérée dans un article parlant de musique, il s’agira de présenter le musicien, par exemple « Beethoven, grand musicien du XVIIIe siècle », tandis qu’insérée dans un article parlant de beaux-arts, il s’agira de parler de l’œuvre, par exemple « Huile sur toile de de Joseph Karl Stieler de 1820 », etc.<br><br>Il est absolument indispensable de considérer le contexte et les conditions d'utilisation d'une image pour choisir son texte alternatif. À quoi sert cette image ? Que veut-elle dire ici ?
}
| type="{}" }
- sous-titre
{ Champ libre _50 }
- chapeau
</quiz>
- paragraphe
+ intertitre
+ citation
+ liste verticale
+ acronyme
- exergue
- notes de bas de page
 
{ Combien de niveaux de titre peut-on utiliser sur le Web ?
====Question 2====
|| réponse b<br><br>Il existe 6 niveaux de titre, pas un de plus.
Voici donc cette même image, avec un peu de contexte :<br><br>
}
[[File:Activite6.1 Beethoven.png.jpg|Activite6.1 Beethoven]]<br>
- a) autant que l’on souhaite : sur le Web, pas de limite !
''Compositeur hors pair, Ludwig van Beethoven a marqué l’histoire de la musique. S’affranchissant des règles classiques, et malgré sa terrible surdité, il ouvrit de nouvelles perspectives dans la composition musicale et jeta les bases du romantisme.''
+ b) 6, pas davantage
<br><br>
- c) 3, au-delà c’est trop profond
<quiz shuffle="none" display="simple">
{ Quel serait le texte alternatif le plus approprié pour cet exemple ?
|| a) Il est inutile de préciser qu’il s’agit d’une image, car le code de la page le signifie déjà et la synthèse vocale sait extraire cette information.<br>
b) L’alternative doit être précise et équivalente au contenu et aux fonctions de l'image. Ici, les dates de vie et mort de Beethoven, indiquées dans l’alternative, constituent une information supplémentaire, non véhiculée par l’image et non présente dans le texte, si bien que les non-voyants auront davantage d’information que les voyants.<br>
c) Lorsque l’attribut alt est laissé vide, l’image est ignorée, ce qui ne constitue pas ici une perte d’information. <br>
d) Cette alternative est la plus adaptée dans ce contexte. }
- a) « Image de Beethoven »
- b) « Ludwig van Beethoven (1770-1827) »
+ c) Un attribut alt vide (alt="") suffirait.
+ d) « Beethoven »
</quiz>
 
{ Combien de styles de listes existe-t-il sur le Web ?
====Question 3====
|| réponse a<br><br>Il existe trois types de listes, mais bien plus de trois styles de listes.<br><br>Il ne faut pas confondre le style, qui régit l’apparence graphique, de façon non limitée, et la valeur sémantique, ici limitée à 3 types de listes.
Cette fois-ci, l’image est légendée :<br><br>
[[File:Activite6.1 Beethoven.png.jpg|Activite6.1 Beethoven]]<br>
''Compositeur hors pair, Ludwig van Beethoven a marqué l’histoire de la musique. S’affranchissant des règles classiques, et malgré sa terrible surdité, il ouvrit de nouvelles perspectives dans la composition musicale et jeta les bases du romantisme.''
<br><br>
<quiz shuffle="none" display="simple">
{ Quel serait le texte alternatif le plus approprié pour cet exemple ?
|| a) Cette alternative duplique la légende de l’image. L’alternative textuelle ne doit pas être redondante ou dupliquer le texte entourant l'image.<br>b) Dans ce cas, l’image n’est pas porteuse d’information, puisque celle-ci est dispensée par le texte proche. Une alternative vide suffit. L’image est alors ignorée.<br>c) C'est une précision totalement inutile généralement, et dans le cas d'une image porteuse de sens il est rarement utile de préciser qu'il est apporté par une image plutôt que par du texte.<br>
d) L’attribut alt est obligatoire ! L’omettre constitue une erreur de codage. Par contre, il peut être vide.
}
+ a) autant que l’on souhaite, c’est sans limite
- b) 3, pas davantage
- a) « Beethoven »
- c) 2 seulement : liste à puces et liste numérotées
+ b) Un attribut alt vide (alt="") suffirait.
- c) « Image »
- d) L'image n'a pas besoin d'un attribut alt.
</quiz>
 
{ Vous publiez une poésie de Lamartine. Quelle balise utilisez-vous pour la signaler :
====Question 4====
|| La bonne réponse est blockquote, car il s’agit d’un texte en plusieurs lignes : c’est bien une citation en bloc.
Cette fois-ci, l’image fait partie d’un lien, qui conduit à une biographie du célèbre compositeur :<br><br>
[[File:Activite6.1 Beethoven-lien.jpg.png|Activite6.1 Beethoven-lien]]<br>
'''Beethoven'''
<br><br>
<quiz shuffle="none" display="simple">
{ Quel serait le texte alternatif le plus approprié pour cet exemple ?
|| a) Cette alternative duplique la légende de l’image. L’alternative textuelle ne doit pas être redondante ou dupliquer le texte entourant l'image.<br>b) Ce choix est à proscrire. Une image-lien doit toujours avoir une alternative textuelle. Le logiciel de revue d'écran doit pouvoir annoncer quelque chose permettant d'identifier le lien.<br>c) Cette alternative n’est ni équivalente à l’image, ni précise sur la destination du lien. Sachez qu’un lien peut être lu hors contexte. Cet intitulé n’a aucun sens hors contexte : « En savoir plus »… sur quoi ?<br>d) Ici, l'image est le seul contenu du lien et rien d'autre n'indique sa fonction. L'attribut alt doit donc mentionner la destination du lien.
}
- a) poesie
+ b) blockquote
- a) « Beethoven »
- c) quote
- b) Un attribut alt vide (alt="") suffirait.
- d) q
- c) « En savoir plus »
+ d) « Article de Wikipédia sur Beethoven »
</quiz>