Accueil

Traduction

Tutoriel HTML - sommaire

Tutoriel HTML5 - recherche

L'auteur : Patrick Darcheville

Vous pouvez me contacter via Facebook pour questions & suggestions : Page Facebook relative à mon site

HTML : insérer des caractères spéciaux et symboles

Sachez que c'est possible !

Il faut parfois insérer entre deux mots un espace insécable afin d'éviter un éventuel saut de ligne regrettable. HTML propose une solution : l'entité HTML.
Une entité HTML est une chaine qui commence par & et se termine par ;

Les symboles

Symboles Code clavier Code ISO Entité HTML Description
Alt+1 ☺   Visage blanc souriant
Alt+2 ☻   Visage noir souriant
Alt+3 ♥ ♥ Cœur noir
Alt+4 ♦ ♦ Carreau noir
Alt+5 ♣ ♣ Trèfle noir
Alt+6 ♠ ♠ Pique noir
Alt+7 • • Gros point médian
Alt+8 ◘   Point noir-au-blanc
Alt+9 ○   Cercle blanc
Alt+10 ◙   Cercle noir-au-blanc
Alt+11 ♂   Signe male
Alt+12 ♀   Signe femelle
Alt+13 ♪   Note croche
Alt+14 ♫   Deux croche ramées
Alt+15 ☼   Soleil blanc avec rayons
Alt+16 ►   Pointeur noir vers droite
Alt+176 ░   Ombre légère
Alt+177 ▒   Ombre moyenne
Alt+178 ▓   Ombre foncée
Alt+179 │    
Alt+180 ┤    
Alt+183 ↕    
Alt+185 ╣    
Alt+186 ║    
Alt+187 ╗    
Alt+188 ╝    
Alt+191 ┐    
Alt+192 └    
Alt+193 ┴    
Alt+194 ┬    
Alt+195 ├    
Alt+196 ─    
Alt+197 ┼    
Alt+200 ╚    
Alt+17 ◄   Pointeur noir vers gauche
Alt+18 ↕   Flèche haut et bas
Alt+19 ‼   Double point d'exclamation
Alt+20 ¶ ¶ Pied de mouche
§ Alt+21 § § Paragraphe
Alt+22 ▬    
Alt+23 ↨   Flèche haut- bas sur base
Alt+24 ↑ ↑ Flèche vers le haut
Alt+25 ↓ ↓ Flèche vers le bas
Alt+26 → → Flèche vers la droite
Alt+27 ← ← Flèche vers la gauche
Alt+28 ∟    
Alt+29 ↔ ↔ Flèche bilatérale gauche-droite
Alt+30 ▲   Triangle noir pointant vers le haut
Alt+31 ▼   Triangle noir pointant vers le bas
  ◊ ◊ Losange
Alt+201 ╔    
Alt+202 ╩    
Alt+203 ╦    
Alt+204 ╠    
Alt+205 ═    
Alt+206 ╬    
Alt+217 ┘    
Alt+218 ┌    
Alt+219 █    
Alt+220 ▄    
Alt+223 ▀    
Alt+254 ■    

Différentes techniques pour insérer des caractères spéciaux dans une page

Soit vous tapez le code clavier, soit le code ISO soit une entité HYML (si elle existe).

Produire le code clavier

j'ai composé successivement au clavier : ALT+064 ALT+0167 ALT+0174 ALT+0188 ALT+0189 :
Et j'ai obtenu : @ § © ¼ ½

Produire les codes ISO

Comme les codes HTML, les codes ISO commencent par & (et commercial) et se terminent par ; (point virgule) mais entre les deux ce n'est pas nom d'entité mais un code ISO qui commence par un # et est suivi d'un nombre (jusqu'à 4 chiffres).

J'ai saisi les codes ISO suivants : #945 #914 #947 #915 #948 #916 #917 #950 encadrés par & et ;
Et j'ai obtenu des lettres grecques majuscules et minuscules : α Β γ Γ δ Δ Ε ζ

Les codes ISO sont très utiles pour afficher les lettres de l'alphabet phonétique international.

ɐɑɒɓɔɕɖɗ

Dans le tableau ci-dessus quelques lettres de l'alphabet phonétique international : code ISO de 592 à 599.

Ci-dessous extrait de l'alphabet phonétique international (limité aux phonèmes en français).

Utiliser les entités HTML

Il est facile de retenir les codes correspondants avec des procédés mnémotechniques.

Le code HTML correspondant

Astuces

Les solutions précédentes présentent un inconvénient : il faut connaitre les codes ou avoir sous les yeux un document qui les indique.
Tous les traitements de texte proposent une commande pour insérer les caractères spéciaux.
Ainsi sous Libre Office Writer il suffit de produire : insertion/caractères spéciaux/sélectionner le caractère / touche "Insérer".
Ensuite faites un copier-coller vers une page web ouverte avec un éditeur tel NotePad.

Code ISO des lettres de l'alphabet phonétique international

Espace insécable

Le navigateur peut produire un saut de ligne indésirable entre deux mots composés ou entre la dernière lettre de la phrase et le symbole de ponctuation double (donc précédé d'un espace).
Ainsi il n'est pas souhaitable qu'un numéro de téléphone s'affiche sur deux lignes ; même remarque pour une montant monétaire. Il faut aussi éviter un saut de ligne devant les symboles de ponctuation double ( ! ; , :)?
On crée un espace insécable avec l'entité HTML   ("non breakable space").

Exemple : la somme due est 1 000 000 €
Le code HTML correspond : ... la somme due est : 1 000 000 €

Vous pouvez aussi utiliser le code ISO   OU  .
Exemple : mon téléphone est 06 51 06 51 59
Le code HTML correspondant : ... mon téléphone est 06 51 06 51 59