home *** CD-ROM | disk | FTP | other *** search
/ PC World 2005 May / PCWorld_2005-05_cd.bin / komunikace / amaya / amaya-WinXP-9.1.exe / doc / html / ImageMaps.html.fr < prev    next >
Extensible Markup Language  |  2005-02-15  |  8KB  |  171 lines
  1. <?xml version="1.0" encoding="iso-8859-1"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  3.        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
  5. <head>
  6.   <title>Images et Zones actives</title>
  7.   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  8.   <meta name="GENERATOR" content="amaya 9.0.1, see http://www.w3.org/Amaya/"
  9.   />
  10.   <link href="style.css" rel="stylesheet" type="text/css" />
  11. </head>
  12.  
  13. <body xml:lang="fr" lang="fr">
  14.  
  15. <table border="0" summary="toc">
  16.   <tbody>
  17.     <tr>
  18.       <td><p><img alt="W3C" src="../images/w3c_home" /> <img alt="Amaya"
  19.         src="../images/amaya.gif" /></p>
  20.       </td>
  21.       <td><p><a href="Tables.html.fr" accesskey="p"><img alt="previous"
  22.         src="../images/left.gif" /></a> <a href="Manual.html.fr"
  23.         accesskey="t"><img alt="top" src="../images/up.gif" /></a> <a
  24.         href="Math.html.fr" accesskey="n"><img alt="next"
  25.         src="../images/right.gif" /></a></p>
  26.       </td>
  27.     </tr>
  28.   </tbody>
  29. </table>
  30.  
  31. <div id="Client-sid">
  32. <h2><a name="L1013">Images et Zones actives</a></h2>
  33.  
  34. <h3><a name="Adding">Ajouter une image</a></h3>
  35.  
  36. <p>Pour insΘrer une image, choisissez l'entrΘe <strong>Image</strong> depuis
  37. le menu <strong>XHTML</strong> ou cliquez sur le bouton <img alt="Image "
  38. src="../images/Image.gif" longdesc="longdesc.htm" /> (ou encore utilisez le
  39. raccourci clavier control-h, control-i pour Unix). Ceci fait apparaεtre une
  40. boεte de dialogue qui vous permet de rentrer le nom du fichier et le <a
  41. href="#Alternative">texte de remplacement</a> ('ALT' texte) de l'image
  42. dΘsirΘe. Si vous souhaitez fournir une longue description (par exemple si
  43. votre image prΘsente une information complexe) vous devriez la faire dans un
  44. document sΘparΘ et la relier en donnant l'URI comme un descripteur long
  45. (<strong>longdesc</strong>), Θgalement disponible dans le menu
  46. <strong>Attributs</strong>.</p>
  47.  
  48. <p>Pour faciliter la recherche d'un fichier image vous pouvez entrer une
  49. valeur de <strong>filtre</strong>, et utiliser le bouton
  50. <strong>filtre</strong>. Ainsi le dialogue listera seulement les fichiers qui
  51. correspondent α votre critΦre.</p>
  52.  
  53. <h3>Remplacer une image</h3>
  54.  
  55. <p>Pour remplacer une image sΘlectionnez cette image en draguant sur l'image
  56. avec la souris. ProcΘdez alors comme pour l'ajout d'une image (voir
  57. ci-dessus). Lorsqu'une image (et seulement une image) est entiΦrement
  58. sΘlectionnΘe, la boεte de dialogue des images effectue le remplacement de
  59. l'image sΘlectionnΘe au lieu d'insΘrer une nouvelle image.</p>
  60.  
  61. <h3><a name="Alternative">Texte de remplacement et descriptions
  62. longues</a></h3>
  63.  
  64. <p>Pour les ΘlΘments comme les images (et autres objets multimΘdia) vous
  65. devez fournir un texte de remplacement. Celui ci sera prΘsentΘ, comme α
  66. l'habitude, α la place de l'image par un navigateur avec un systΦme de sortie
  67. vocale, ou une visualisation en Braille (utilisΘ par de nombreux aveugles).
  68. Il est Θgalement courant que les utilisateurs ayant des connections de
  69. mauvaise qualitΘ demandent la vue alternΘe, o∙ le texte est transmis beaucoup
  70. plus vite que les images.</p>
  71.  
  72. <p>Le texte de remplacement devrait remplacer l'image en fonction. Par
  73. exemple, si l'image est utilisΘe pour fournir une ic⌠ne de lien (c'est le cas
  74. de l'ic⌠ne du W3C en haut de cette page) ainsi le titre de la page rΘfΘrencΘe
  75. serait un bon texte de remplacement.</p>
  76.  
  77. <p>Il existe des cas o∙ une image n'est utilisΘe pour un effet visuel, et
  78. n'apporte aucune information supplΘmentaire α la page. Dans ce cas, il est
  79. appropriΘ d'utiliser un blanc de remplacement car il faut toujours un texte
  80. de substitution - entrez deux guillemets comme alternative (eg. alt="").</p>
  81.  
  82. <p>Dans les cas o∙ l'image transporte une information importante qui n'est
  83. pas disponible depuis le texte du document, vous devez fournir une
  84. description de l'information. L'option <strong>longdesc</strong> du menu
  85. <strong>Attributs</strong> vous permet de relier une description (qui est un
  86. URI - un document sΘparΘ, ou une partie nommΘe du document courant) α une
  87. image.</p>
  88.  
  89. <p>Afin de donner une idΘe de comment une page sans les images doit Ωtre
  90. prΘsentΘe, Amaya fournit une option <strong>Montrer la vue alternΘe</strong>
  91. dans le menu <strong>Vues</strong>. Dans le cas d'un navigateur oral, la <a
  92. href="Views.html.fr#Alternate">vue alternΘe</a> pourrait Ωtre simplement lue
  93. α voix haute. Sans des textes de remplacement pour les images, de nombreuses
  94. pages deviendraient difficiles voire impossibles α naviguer, et les
  95. utilisateurs seraient condamnΘs α trouver "leur chemin dans le noir".</p>
  96.  
  97. <h3><a name="Using">Utiliser des zones actives</a></h3>
  98.  
  99. <p><strong>Amaya</strong> vous donne la possibilitΘ d'utiliser des zones
  100. actives :</p>
  101. <ul>
  102.   <li>Pour activer une zone dans un plan, double-cliquez sur la zone avec le
  103.     bouton gauche de la souris. L'URI attachΘ α cette zone est alors
  104.   importΘ.</li>
  105.   <li>Pour visualiser les zones existantes, choisissez <strong>Montrer les
  106.     zones actives</strong> du menu <strong>Vues</strong>.</li>
  107. </ul>
  108.  
  109. <h3><a name="Creating">CrΘer des zones actives</a></h3>
  110.  
  111. <p>Pour crΘer une nouvelle zone active, insΘrez une image α l'intΘrieur du
  112. document, et dΘfinissez les zones comme des liens.</p>
  113.  
  114. <p>Pour crΘer une zone dans une image, sΘlectionnez l'image ou une zone
  115. existante de cette image. Ensuite, choisissez une des options
  116. <strong>Rectangle</strong>, <strong>Cercle</strong>,
  117. <strong>Polygone</strong> depuis le sous-menu <strong>Zone active</strong> du
  118. menu <strong>XHTML</strong>, suivant la forme de la nouvelle zone que vous
  119. souhaitez crΘer. L'option <strong>Montrer les zones actives</strong> du menu
  120. <strong>Vues</strong> tracera le contour de chaque zone active existante sur
  121. une image.</p>
  122. <ul>
  123.   <li>Pour crΘer une zone rectangulaire ou circulaire, vous devez tout
  124.     d'abord sΘlectionner la position du coin en cliquant avec le bouton
  125.     gauche de la souris. Laissez le bouton appuyΘ et dΘplacez la souris
  126.     jusqu'α la position du coin opposΘ, puis lΓchez le bouton. La zone est
  127.     maintenant dΘfinie.</li>
  128.   <li>Pour un polygone, entrez chaque point en cliquant la position
  129.     correspondante avec le bouton gauche de la souris. Pour indiquer le
  130.     dernier point, cliquez avec le bouton du milieu.</li>
  131. </ul>
  132.  
  133. <p>Quand la zone a ΘtΘ dΘfinie, vous devez fournir <a href="#Alternative">le
  134. texte de remplacement</a> dans la boεte de dialogue qui apparaεt et entrer la
  135. cible du lien associΘe α cette zone. SΘlectionnez uniquement la cible (ou
  136. entrer son URI si elle n'est pas visualisΘe), de la mΩme maniΦre que pour <a
  137. href="Links.html.fr#L245">crΘer des liens</a>.</p>
  138.  
  139. <h3>DΘplacer des zones actives<strong></strong></h3>
  140.  
  141. <p>Quand une zone a ΘtΘ dΘfinie, vous pouvez la dΘplacer :</p>
  142. <ul>
  143.   <li><p>Par manipulation directe - en combinant la <strong>touche
  144.     Control</strong> et le <strong>bouton gauche</strong> de la souris dans
  145.     la zone active, vous pourrez dΘplacer cette zone.</p>
  146.   </li>
  147.   <li><p>En Θditant l'attribut <strong>coords</strong> de la zone dans la vue
  148.     structure.</p>
  149.   </li>
  150. </ul>
  151.  
  152. <h3><a name="L1171">Redimensionner des zones actives</a></h3>
  153. <ul>
  154.   <li>Par manipulation directe - en combinant la <strong>touche
  155.     Control</strong> et le <strong>bouton du milieu</strong> ou le
  156.     <strong>bouton droit</strong> de la souris α l'intΘrieur de la zone
  157.     active, vous pourrez redimensionner cette zone.</li>
  158.   <li>En Θditant l'attribut <strong>coords</strong> de la zone dans la vue.
  159.     <p></p>
  160.   </li>
  161. </ul>
  162. </div>
  163.  
  164. <p><a href="Tables.html.fr#Editing"><img alt="previous"
  165. src="../images/left.gif" /></a> <a href="Manual.html.fr"><img alt="top"
  166. src="../images/up.gif" /></a> <a href="Math.html.fr#Math"><img alt="next"
  167. src="../images/right.gif" /></a></p>
  168. <hr />
  169. </body>
  170. </html>
  171.