Ecrire le HTML | A Propos | FAQ | Alumni | Kudos | Références | Tags | Leçons | précédent | suivant |

10. Caractères Spéciaux

Comment dites-vous ...

>>>Æ ñ Þóßÿ ?

NOTE : Si les caractères ci-dessus ne s'affichent pas avec différents accents ou marques diacritiques, cela veut dire que votre navigateur web ne supporte pas le jeu de caractères ISO. Peut-être voulez-vous alors sauter cette leçon.

Objectifs

Après cette leçon, vous pourrez :

Utiliser les codes HTML pour que les caractères accentués du jeu ISO Latin 1 s'affichent avec les accents.
Utiliser les symboles < et > quand vous en avez besoin dans un document.
Ajouter des espaces supplémentaires entre les mots et les lettres dans un document.

Leçon

Note : Si vous n'avez pas le document de la leçon précédente, téléchargez une copie maintenant.

Les Accents

Vous pouvez parfois avoir besoin d'utiliser des caractères spéciaux dans un document HTML, accents ou marques diacritiques. Ceux connus en tant que codes ISO. Ces caractères spéciaux sont écrits en HTML comme suit :


   &xxxx;

où XXXX est le nom du code pour le caractère spécial. Pour créer le caractère spécial pour le umlaut Allemand, (ü), nous devons utiliser le code HTML suivant :


   &uuml;

Par exemple, dans la section Terminologie de notre leçon Volcan, nous voulons ajouter l'explication d'un terme technique utilisé pour décrire un type particulier de coulée volcanique. Ce terme français, nuee ardente, signifie "nuage incandescent". Afin de l'orthographier correctement, nous devons utiliser un accent "aigu" pour que le mot s'écrive nuée ardente. Dans ce cas, nous remplaçons le premier e de nuee par le code HTML du "e" accent aigu, é :


     nu&eacute;e ardente

Pour les références de ces codes, consultez la liste des caractères spéciaux ISO.

Maintenant, nous allons ajouter une phrase avec une lettre accentuée dans notre document HTML :

Ouvrez le fichier HTML, index.html dans votre éditeur de texte.
Sous la liste de termes de la section Terminologie des Volcans, tapez le texte suivant :
```
  Le terme <I>nu&eacute;e ardente</I> fut 
  utilisé pour la première fois par La Croix (1904)
  dans sa description de la coulée volcanique qu'il observa en 1902 lors 
  de l'éruption de la Montagne Pel&eacute;e, un volcan célèbre
  toujours en activité à la Martinique.
```
NOTE : Nous avons ajoutÈ les accents aigus pour deux "e" dans cette phrase. Cela peut paraître étrange pour certains ! Vérifiez bien que vous remplaçez la lettre par le code qui affiche la même lettre avec l'accent.
Sauvegardez et Rechargez le fichier HTML.

Séquences d'Echappement HTML

Le code HTML pour les lettres accentuées est un exemple d'une classe générale de tags appelés séquences d'échappement. En tapant du code HTML jusqu'ici, vous vous êtes peut-être demandé comment faire quand vous devez utiliser les signes < (plus petit que) ou > (plus grand que) ? Ces deux caractères, plus le & (et commercial) ont une signification spéciale en HTML et ne peuvent pas être utilisés comme tels. A leur place, utilisez les séquences d'échappement suivantes :


   &lt; (Less Than) pour <
   &gt;  (Greater Than) pour > 
   &amp; (AMPersand) pour &

Maintenant, ajoutons un de ces symboles à notre leçon Volcan. Dans le chapitre précédent, nous avons créé une table listant plusieurs volcans ainsi que le volume de matière qui s'en était échappé. Disons qu'une des valeurs (500-600) pour Long Valley n'est pas très précise (ces valeurs sont d'ailleurs souvent des estimations), et nous voudrions modifier l'entrée pour afficher >450 & <700. Pour cela :

Ouvrez le fichier HTML, index.html dans votre éditeur de texte.
Sous le titre Volumes de Quelques Eruptions Volcaniques Célèbres, trouvez la ligne correspondant à Long Valley dans notre table :
```
  Long Valley, Californie     préhistorique        500 - 600
```
et changez-là en :
```
  Long Valley, Californie     préhistorique       &gt;450 &amp; &lt;700
```
NOTE : Bien que nous utilisions les séquences d'échappement à l'intérieur d'un texte préformaté, notez comment un navigateur web interprète et affiche correctement les caractères spéciaux. Les séquences d'échappement peuvent donc être utilisées dans n'importe quelle partie d'un document HTML, y compris les titres et les ancres.
Sauvegardez et Rechargez le fichier HTML.

Espaces Supplémentaires

Comme vous avez pu le voir, un navigateur web ignore tous les espaces en trop dans vos fichiers HTML. Pourtant, par moments, vous pouvez vouloir introduire plus d'un espace. Quand ? Certains écrivains aiment avoir deux espaces après le point à la fin d'une phrase. Et si vous vouliez présenter chaque paragraphe avec un retrait de la première phrase ? Ou espacer entre elles les lettres d'un mot ?

Le code HTML pour ajouter un caractère blanc (espace) est appelé "espace insécable" (Non-Breaking SPace) :

  &nbsp;

Voici quelques exemples de l'utilisation de l'espace insécable :

HTML Résultat

Deux espaces sont utilisés pour étaler les lettres d'un mot

<b><tt>
F &nbsp; R &nbsp; O &nbsp; M &nbsp; 
A &nbsp; G &nbsp; E
</tt></b>

F R O M A G E

HTML Result

Deux espaces sont utilisés pour indenter la première phrase de chaque paragraphe

&nbsp; &nbsp; Quand Sir Longhorn
mourut tragiquement, personne ne resta pour perpétuer
sa tradition. 
Il y eut beaucoup de tristesse 
dans le pays. 
Et plus de fromage.
<p>
&nbsp; &nbsp; Puis la jeune génie
Sheila Colby découvrit l'ingrédient
manquant. Et une fois de plus, le fromage 
abonda.

Quand Sir Longhorn mourut tragiquement, personne ne resta pour perpétuer sa tradition. Il y eut beaucoup de tristesse dans le pays. Et plus de fromage.

Puis la jeune génie Sheila Colby découvrit l'ingrédient manquant. Et une fois de plus, le fromage abonda.

HTML Result

Un espace supplémentaire est ajouté après la fin de chaque phrase.

&nbsp; &nbsp; Quand Sir Longhorn
mourut tragiquement, personne ne resta pour
perpétuer sa tradition. &nbsp; 
Il y eut beaucoup de tristesse  
dans le pays. &nbsp; 
Et plus de fromage.
<p>
&nbsp; &nbsp; Puis la jeune génie
Sheila Colby découvrit l'ingrédient
manquant. &nbsp; Et une fois de plus, le fromage 
abonda.

Quand Sir Longhorn mourut tragiquement, personne ne resta pour perpétuer sa tradition. Il y eut beaucoup de tristesse dans le pays. Et plus de fromage.

Puis la jeune génie Sheila Colby découvrit l'ingrédient manquant. Et une fois de plus, le fromage abonda.

Vous voudrez peut-être expérimenter différentes façons d'utiliser l'espace insécable. Pour le moment, nous n'allons pas modifier nos documents HTML, mais vous pouvez, si vous le souhaitez, ajouter le code pour indenter la première phrase de tous les paragraphes en utilisant deux fois le code de l'espace supplémentaire.

Pour plus d'informations sur l'indentation de paragraphes, consultez les Trucs Stupides d'Indentations HTML de Jim Barchuck.

Vérifiez Votre Travail

Comparez votre document avec un exemple du document-type. Si votre page web est différente de l'exemple, vérifiez le texte que vous avez tapé dans l'éditeur de texte. Assurez-vous que vous avez correctement entouré les séquences d'échappement avec les caractères & et ;.

Informations Supplémentaires

Voici quelques autres caractères spéciaux dont vous pourriez avoir besoin :

Nom	HTML	Résultat
Copyright Marque déposée Cent Signe des Degrés double plus petit que micro Point en milieu de ligne Négation, ligne continue Paragraphe Plus/Moins Livre Britannique double plus grand que Section Yen	© ® ¢ ° « µ · ¬ ¶ ± £ » § ¥	© ® ¢ ° « µ · ¬ ¶ ± £ » § ¥

Consultez également la très complète liste des caractères spéciaux de WebMonkey.

Révision

Revoyons les grandes lignes de cette leçon :

En HTML, quel est le moyen correct d'afficher un umlaut Allemand (ü)?
Que se passe-t-il si vous n'utilisez pas les séquences d'échappement pour < et > ?
Pourquoi auriez-vous besoin d'une séquence d'échappement spéciale pour le caractère & ?
Comment indenter des paragraphes ?

Travail Indépendant

Dans votre propre document HTML, ajoutez un mot étranger qui nécessite un accent spécial ou une expression mathématique utilisant les symboles < ou >. Ou bien ajoutez des espaces supplémentaires pour indenter vos paragraphes.

A Suivre....

Créez une bibliographie à l'aide d'une liste descriptive.

ALLER A.... | Index des Leçons | précédent : "Texte Préformatté" | suivant : "Listes de Définition" |

Ecrire le HTML : Leçon 10 : Caractères Spéciaux
©1994-2003 Maricopa Center for Learning and Instruction (MCLI)
Maricopa Community Colleges

La 'net connection (en anglais) à MCLI est Alan Levine
Suggestions en Français à Bernard Bensoussan

URL: http://www.mcli.dist.maricopa.edu/tut/tut10.html