📚 Symboles et caractères spéciaux

Dans le dernier niveau, vous avez remarqué que nous avons utilisé un caractère spécial pour afficher le symbole de "copyright".

En HTML, certains caractères ont une signification particulière et ne peuvent pas être affichés directement. Pour les afficher, on utilise des entités HTML - des codes spéciaux qui représentent ces caractères.

Pourquoi avons-nous besoin de caractères spéciaux?

Certains caractères sont réservés par HTML:

• < et > délimitent les balises
• & introduit les entités
• ` délimite les attributs

D'autres caractères sont difficiles à taper ou invisibles:

• Espaces insécables
• Symboles spéciaux

Syntaxe des entités HTML

Les entités HTML commencent par & et se terminent par ;:

Caractères fréquents à connaître

Caractères réservés HTML

Caractère	Entité	Code numérique	Usage
<	&lt;	&#60;	Inférieur à
>	&gt;	&#62;	Supérieur à
&	&amp;	&#38;	Esperluette
"	&quot;	&#34;	Guillemets
'	&apos;	&#39;	Apostrophe

Espaces spéciaux

Caractère	Entité	Description
Espace insécable	 	Espace qui ne se casse pas

Caractères typographiques

Caractère	Entité	Description
©	©	Copyright
®	®	Marque déposée
™	™	Trademark
€	€	Euro

Liste exhaustive des symboles

Introduction aux Caractères Spéciaux en HTML

Qu'est-ce qu'un caractère spécial ?

En HTML, certains caractères ont une signification particulière et ne peuvent pas être affichés directement. Pour les afficher, on utilise des entités HTML - des codes spéciaux qui représentent ces caractères.

Pourquoi en avons-nous besoin ?

Certains caractères sont réservés par HTML :

• < et > délimitent les balises
• & introduit les entités
• " délimite les attributs

D'autres caractères sont difficiles à taper ou invisibles :

• Espaces insécables
• Caractères accentués
• Symboles spéciaux

Syntaxe des entités HTML

Les entités HTML commencent par & et se terminent par ; :

&nom_entite;
<!-- ou -->
&#numero;

Caractères essentiels à connaître

Caractères réservés HTML

Caractère	Entité	Code numérique	Usage
<	&lt;	&#60;	Inférieur à
>	&gt;	&#62;	Supérieur à
&	&amp;	&#38;	Esperluette
"	&quot;	&#34;	Guillemets
'	&apos;	&#39;	Apostrophe

Espaces spéciaux

Caractère	Entité	Description
Espace insécable	 	Espace qui ne se casse pas
Espace fine	 	Espace très mince

Caractères typographiques

Caractère	Entité	Description
©	©	Copyright
®	®	Marque déposée
™	™	Trademark
€	€	Euro
£	£	Livre sterling

Exemples pratiques

Afficher du code HTML dans une page

<!-- INCORRECT - ne s'affichera pas -->
<p>Utilisez la balise <h1> pour les titres</p>

<!-- CORRECT -->
<p>Utilisez la balise &lt;h1&gt; pour les titres</p>

Texte avec symboles

<p>Prix : 29&euro; &copy; 2024 MonSite&trade;</p>
<p>Espacement&nbsp;insécable entre&nbsp;ces&nbsp;mots</p>

Caractères accentués (optionnel)

<p>Caf&eacute; - &agrave; bient&ocirc;t !</p>
<!-- Mais avec UTF-8, on peut écrire directement : -->
<p>Café - à bientôt !</p>

Bonnes pratiques

1. Utilisez UTF-8 - La plupart des caractères peuvent être tapés directement
2. Entités obligatoires - Toujours utiliser pour <, >, & dans le contenu
3. Espaces insécables -   pour éviter les coupures de ligne indésirables
4. Lisibilité - Préférez les noms aux codes numériques quand possible

Cas d'usage fréquents

Afficher du code :

<p>Pour créer un lien : &lt;a href="url"&gt;texte&lt;/a&gt;</p>

Prix et monnaies :

<p>Promotion : 15&euro; au lieu de 20&euro;</p>

Éviter les coupures :

<p>Appelez le 01&nbsp;23&nbsp;45&nbsp;67&nbsp;89</p>
<p>M.&nbsp;Dupont</p>

Les caractères spéciaux sont essentiels pour afficher correctement du contenu HTML et créer des pages web professionnelles !