{"id":2802,"date":"2024-03-07T10:27:06","date_gmt":"2024-03-07T15:27:06","guid":{"rendered":"https:\/\/accessibility.ecampusontario.ca\/accessibilite\/bonnes-pratiques\/decrire-les-images-a-laide-du-texte\/"},"modified":"2024-03-21T10:46:52","modified_gmt":"2024-03-21T14:46:52","slug":"texte-de-remplacement","status":"publish","type":"page","link":"https:\/\/accessibility.ecampusontario.ca\/fr\/accessibilite\/bonnes-pratiques\/texte-de-remplacement\/","title":{"rendered":"D\u00e9crire les images \u00e0 l&rsquo;aide du texte"},"content":{"rendered":"<p>[et_pb_section fb_built=\u00a0\u00bb1&Prime; fullwidth=\u00a0\u00bbon\u00a0\u00bb module_class=\u00a0\u00bbec-content\u00a0\u00bb _builder_version=\u00a0\u00bb4.23.4&Prime; _module_preset=\u00a0\u00bbdefault\u00a0\u00bb background_color=\u00a0\u00bbRGBA(255,255,255,0)\u00a0\u00bb global_colors_info=\u00a0\u00bb{}\u00a0\u00bb][et_pb_fullwidth_code _builder_version=\u00a0\u00bb4.23.4&Prime; _module_preset=\u00a0\u00bbdefault\u00a0\u00bb hover_enabled=\u00a0\u00bb0&Prime; global_colors_info=\u00a0\u00bb{}\u00a0\u00bb sticky_enabled=\u00a0\u00bb0&Prime;]<\/p>\n<div class=\"ec-banner-main\"><!-- [et_pb_line_break_holder] -->  <\/p>\n<div class=\"ec-banner-content\"><!-- [et_pb_line_break_holder] -->    <\/p>\n<h1>D\u00e9crire les images \u00e0 l\u2019aide du texte<\/h1>\n<p><!-- [et_pb_line_break_holder] -->    <pee>R\u00e9digez des descriptions textuelles alternatives pour les images de votre contenu num\u00e9rique.<\/pee><!-- [et_pb_line_break_holder] -->  <\/div>\n<p><!-- [et_pb_line_break_holder] -->  <\/p>\n<div class=\"ec-banner-img\"><!-- [et_pb_line_break_holder] -->    <img decoding=\"async\" alt=\"\" src=\"\/wp-content\/uploads\/2024\/02\/best-practices-describe-images.jpg\"><!-- [et_pb_line_break_holder] -->  <\/div>\n<p><!-- [et_pb_line_break_holder] --><\/div>\n<p><!-- [et_pb_line_break_holder] --><\/p>\n<div class=\"ec-breadcrumbs\"><\/div>\n<p><!-- [et_pb_line_break_holder] --><\/p>\n<div class=\"ec-heading-row\"><!-- [et_pb_line_break_holder] -->  <\/p>\n<h2>Texte de remplacement<\/h2>\n<p><!-- [et_pb_line_break_holder] --><\/div>\n<p><!-- [et_pb_line_break_holder] --><\/p>\n<div class=\"ec-row\"><!-- [et_pb_line_break_holder] -->  <\/p>\n<div class=\"ec-col ec-col-1w\"><!-- [et_pb_line_break_holder] -->    <\/p>\n<div class=\"ec-callout ec-callout-right\"><!-- [et_pb_line_break_holder] -->      <\/p>\n<h3>R\u00e9f\u00e9rence WCAG associ\u00e9e<\/h3>\n<p><!-- [et_pb_line_break_holder] -->      <pee><a class=\"ec-external-link\" href=\"https:\/\/www.w3.org\/Translations\/WCAG21-fr\/#text-alternatives\">Crit\u00e8re de r\u00e9ussite WCAG 2.1 1.1.1 Contenu non textuel<\/a><\/pee><!-- [et_pb_line_break_holder] -->    <\/div>\n<p><!-- [et_pb_line_break_holder] -->    <pee>Pour rendre vos documents accessibles \u00e0 tous, vous devez proposer du texte de remplacement au contenu non textuel. Le texte de remplacement est un mot descriptif appliqu\u00e9 \u00e0 des informations visuelles, telles que des images, des graphiques et des diagrammes. Il est particuli\u00e8rement utile pour les personnes qui ne sont pas en mesure de voir les informations visuelles et qui comptent sur la technologie de lecteur d\u2019\u00e9cran pour que le contenu leur soit lu. Le texte de remplacement est int\u00e9gr\u00e9 et g\u00e9n\u00e9ralement masqu\u00e9; lorsqu\u2019une application de lecteur d\u2019\u00e9cran rencontre une image, elle lit le texte de remplacement qui y est attach\u00e9.<\/pee><!-- [et_pb_line_break_holder] -->    <pee>Lorsque vous utilisez MS <span lang=\"en\">Word<\/span> ou MS <span lang=\"en\">PowerPoint<\/span>, vous pouvez ajouter un texte de remplacement aux images en cliquant avec le bouton droit sur l\u2019image et en choisissant <strong>\u00ab&nbsp;Afficher le texte de remplacement&nbsp;\u00bb<\/strong>.<\/pee><!-- [et_pb_line_break_holder] -->    <pee>L\u2019exemple suivant montre la bo\u00eete de dialogue qui appara\u00eet lorsque vous cliquez avec le bouton droit et choisissez <strong>\u00ab&nbsp;Afficher le texte de remplacement&nbsp;\u00bb<\/strong>. Dans cet exemple, nous avons saisi la description suivante dans la zone de saisie&nbsp;: Femme tenant une canne et traversant une rue avec un chien d\u2019assistance.<\/pee><!-- [et_pb_line_break_holder] -->    <pee class=\"text-center\"><img decoding=\"async\" class=\"ec-img-shadow\" src=\"\/wp-content\/uploads\/2024\/03\/best-practices-alt-text-fr-1.png\" alt=\"La bo\u00eete de dialogue Microsoft Word pour le texte de remplacement.\"\/><\/pee><!-- [et_pb_line_break_holder] -->    <pee>La plupart des autres outils, y compris les syst\u00e8mes de messagerie \u00e9lectronique, ont \u00e9galement des outils int\u00e9gr\u00e9s pour ajouter du texte descriptif.<\/pee><!-- [et_pb_line_break_holder] -->    <pee>De nombreuses applications, y compris les applications Microsoft, g\u00e9n\u00e8rent automatiquement des descriptions d\u2019une image. Ne vous fiez pas \u00e0 ces descriptions car elles sont souvent de mauvaise qualit\u00e9. Bien que la technologie s\u2019am\u00e9liore dans la reconnaissance de ce qu\u2019une image repr\u00e9sente, elle ne peut pas comprendre ce qu\u2019une image signifie dans le contexte de la page globale. Une feuille d\u2019\u00e9rable peut repr\u00e9senter le Canada ou simplement illustrer la feuille d\u2019un arbre. Les auteurs doivent fournir un texte de remplacement qui repr\u00e9sente le contenu et la fonction de leurs images.<\/pee><!-- [et_pb_line_break_holder] -->    <pee>Le texte de remplacement devrait \u00eatre&nbsp;:<\/pee><!-- [et_pb_line_break_holder] -->    <\/p>\n<ul><!-- [et_pb_line_break_holder] -->      <\/p>\n<li>\u00eatre pr\u00e9cis et \u00e9quivalent dans la repr\u00e9sentation du contenu et de la fonction;<\/li>\n<p><!-- [et_pb_line_break_holder] -->      <\/p>\n<li>\u00eatre succinct&nbsp;: le contenu et la fonction, le cas \u00e9ch\u00e9ant, doivent \u00eatre pr\u00e9sent\u00e9s de la mani\u00e8re la plus succincte possible, sans sacrifier la pr\u00e9cision. En r\u00e8gle g\u00e9n\u00e9rale, seuls quelques mots sont n\u00e9cessaires, m\u00eame si rarement une ou deux phrases courtes peuvent \u00eatre appropri\u00e9es;<\/li>\n<p><!-- [et_pb_line_break_holder] -->      <\/p>\n<li>ne pas \u00eatre redondant ni fournir les m\u00eames informations que le texte \u00e0 c\u00f4t\u00e9 de l\u2019image sur la page ou la diapositive; et<\/li>\n<p><!-- [et_pb_line_break_holder] -->      <\/p>\n<li>ne pas inclure d\u2019expressions telles que \u00ab&nbsp;image de\u2026&nbsp;\u00bb ou \u00ab&nbsp;graphique de\u2026&nbsp;\u00bb, etc. Cela serait redondant puisque les lecteurs d\u2019\u00e9cran annoncent d\u00e9j\u00e0 \u00ab&nbsp;graphique&nbsp;\u00bb avec le texte de remplacement. Si le fait qu\u2019une image soit une photographie ou une illustration, etc. constitue un contenu important, il peut \u00eatre utile de l\u2019inclure dans un texte de remplacement.<\/li>\n<p><!-- [et_pb_line_break_holder] -->    <\/ul>\n<p><!-- [et_pb_line_break_holder] -->  <\/div>\n<p><!-- [et_pb_line_break_holder] --><\/div>\n<p><!-- [et_pb_line_break_holder] --><\/p>\n<div class=\"ec-heading-row\"><!-- [et_pb_line_break_holder] -->  <\/p>\n<h2>\u00c9viter les images de texte<\/h2>\n<p><!-- [et_pb_line_break_holder] --><\/div>\n<p><!-- [et_pb_line_break_holder] --><\/p>\n<div class=\"ec-row\"><!-- [et_pb_line_break_holder] -->  <\/p>\n<div class=\"ec-col ec-col-1w\"><!-- [et_pb_line_break_holder] -->    <\/p>\n<div class=\"ec-callout ec-callout-right\"><!-- [et_pb_line_break_holder] -->      <\/p>\n<h3>R\u00e9f\u00e9rence WCAG associ\u00e9e<\/h3>\n<p><!-- [et_pb_line_break_holder] -->      <pee><a class=\"ec-external-link\" href=\"https:\/\/www.w3.org\/Translations\/WCAG21-fr\/#images-of-text-no-exception\">WCAG 2.1 Crit\u00e8re de r\u00e9ussite 1.4.9 Images de texte (sans exception)<\/a><\/pee><!-- [et_pb_line_break_holder] -->    <\/div>\n<p><!-- [et_pb_line_break_holder] -->    <pee>Les images de texte peuvent se d\u00e9former ou se pixeliser lorsqu\u2019elles sont redimensionn\u00e9es, ce qui pose probl\u00e8me pour les utilisateurs malvoyants et les utilisateurs d\u2019appareils mobiles. Lorsque des images de texte sont requises, l\u2019alternative textuelle doit contenir exactement le m\u00eame texte que celui contenu dans l\u2019image.<\/pee><!-- [et_pb_line_break_holder] -->    <pee>Les images ne doivent pas contenir de texte informatif, sauf s\u2019il s\u2019agit d\u2019une partie essentielle de l\u2019image. Par exemple, le texte qui fait partie d\u2019une marque ou d\u2019un logo est essentiel, mais une image contenant un paragraphe d\u2019informations sous un organigramme n\u2019est pas essentielle car elle peut \u00eatre recadr\u00e9e de l\u2019image et saisie sur la page \u00e0 la place.<\/pee><!-- [et_pb_line_break_holder] -->  <\/div>\n<p><!-- [et_pb_line_break_holder] --><\/div>\n<p><!-- [et_pb_line_break_holder] --><\/p>\n<div class=\"ec-heading-row\"><!-- [et_pb_line_break_holder] -->  <\/p>\n<h2>Images d\u00e9corative<\/h2>\n<p><!-- [et_pb_line_break_holder] --><\/div>\n<p><!-- [et_pb_line_break_holder] --><\/p>\n<div class=\"ec-row\"><!-- [et_pb_line_break_holder] -->  <\/p>\n<div class=\"ec-col ec-col-1w\"><!-- [et_pb_line_break_holder] -->    <\/p>\n<div class=\"ec-callout ec-callout-right\"><!-- [et_pb_line_break_holder] -->      <\/p>\n<h3>R\u00e9f\u00e9rence WCAG associ\u00e9e<\/h3>\n<p><!-- [et_pb_line_break_holder] -->      <pee><a class=\"ec-external-link\" href=\"https:\/\/www.w3.org\/Translations\/WCAG21-fr\/#non-text-content\">WCAG 2.1 Crit\u00e8re de r\u00e9ussite 1.1.1 Contenu non textuel<\/a><\/pee><!-- [et_pb_line_break_holder] -->    <\/div>\n<p><!-- [et_pb_line_break_holder] -->    <pee>Une image \u00ab&nbsp;d\u00e9corative&nbsp;\u00bb est une image qui ne pr\u00e9sente pas d\u2019informations importantes sur le contenu ou la fonction. Elle est peut-\u00eatre utilis\u00e9e uniquement pour la mise en page ou \u00e0 des fins non informatives. Par exemple, une ligne d\u00e9corative qui divise une page&nbsp;: bien que l\u2019image indique une s\u00e9paration entre les sections du document, elle ne fait que renforcer visuellement une structure d\u00e9j\u00e0 pr\u00e9sent\u00e9e en texte.<\/pee><!-- [et_pb_line_break_holder] -->    <pee>Lorsque qu\u2019on d\u00e9cide si une image doit \u00eatre d\u00e9corative, on se demande&nbsp;: Si l\u2019image \u00e9tait supprim\u00e9e, des informations importantes seraient-elles perdues ? Souvent, nous ajoutons des images pour rendre un document plus attrayant visuellement. R\u00e9diger un texte de remplacement descriptif pour des images de ce type force les utilisateurs de lecteurs d\u2019\u00e9cran \u00e0 \u00e9couter ce qui pourrait \u00eatre des descriptions sans signification, redondantes, verbeuses qui ralentissent leur progression dans le document. Les utilisateurs de lecteurs d\u2019\u00e9cran peuvent devenir frustr\u00e9s et avoir l\u2019impression que leur temps est gaspill\u00e9.<\/pee><!-- [et_pb_line_break_holder] -->    <pee>Dans MS <span lang=\"en\">Word<\/span> ou <span lang=\"en\">PowerPoint<\/span>, faites un clic droit sur l\u2019image et choisissez \u00ab&nbsp;Afficher le texte de remplacement&nbsp;\u00bb pour trouver une case \u00e0 cocher intitul\u00e9e \u00ab&nbsp;Marquer comme d\u00e9coratif&nbsp;\u00bb. S\u00e9lectionnez la case \u00e0 cocher si vous souhaitez que l\u2019image n\u2019apparaisse pas aux lecteurs d\u2019\u00e9cran.<\/pee><!-- [et_pb_line_break_holder] -->    <pee>Visitez le site <a class=\"ec-external-link\" href=\"https:\/\/webaim.org\/techniques\/alttext\/\"><span lang=\"en\">WebAIM&nbsp;: Alternative Text<\/span><span class=\"visually-hidden\"> (Offert en anglais seulement)<\/span><\/a> pour d\u2019autres exemples et descriptions des approches appropri\u00e9es pour le texte de remplacement. <span aria-hidden=\"true\">(Offert en anglais seulement)<\/span><\/pee><!-- [et_pb_line_break_holder] -->  <\/div>\n<p><!-- [et_pb_line_break_holder] --><\/div>\n<p>[\/et_pb_fullwidth_code][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1059,"featured_media":0,"parent":2768,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-2802","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/accessibility.ecampusontario.ca\/fr\/wp-json\/wp\/v2\/pages\/2802","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/accessibility.ecampusontario.ca\/fr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/accessibility.ecampusontario.ca\/fr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/accessibility.ecampusontario.ca\/fr\/wp-json\/wp\/v2\/users\/1059"}],"replies":[{"embeddable":true,"href":"https:\/\/accessibility.ecampusontario.ca\/fr\/wp-json\/wp\/v2\/comments?post=2802"}],"version-history":[{"count":12,"href":"https:\/\/accessibility.ecampusontario.ca\/fr\/wp-json\/wp\/v2\/pages\/2802\/revisions"}],"predecessor-version":[{"id":3302,"href":"https:\/\/accessibility.ecampusontario.ca\/fr\/wp-json\/wp\/v2\/pages\/2802\/revisions\/3302"}],"up":[{"embeddable":true,"href":"https:\/\/accessibility.ecampusontario.ca\/fr\/wp-json\/wp\/v2\/pages\/2768"}],"wp:attachment":[{"href":"https:\/\/accessibility.ecampusontario.ca\/fr\/wp-json\/wp\/v2\/media?parent=2802"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}