Utilisation des emojis dans HTML

Les emojis sont des caractères venant du jeu de caractères UTF-8 :  

Qu'est-ce que l'emoji ?

Les emojis sont similaires à des images ou des icônes, mais ce ne sont pas des images ou des icônes.

Ils sont des lettres (caractères) venant du jeu de caractères UTF-8 (Unicode).

Astuce :UTF-8 couvre presque tous les caractères et symboles du monde.

Attribut charset HTML

Pour afficher correctement une page HTML, le navigateur Web doit savoir quel jeu de caractères est utilisé dans la page.

C'est dans <meta> Spécifié dans l'étiquette :

<meta charset="UTF-8">

Astuce :Si elle n'est pas spécifiée, UTF-8 est le jeu de caractères par défaut dans HTML.

Caractères UTF-8

Beaucoup de caractères UTF-8 ne peuvent pas être saisis au clavier, mais ils peuvent toujours être affichés en utilisant des nombres (appelés numéros d'entité) :

  • A est 65
  • B est 66
  • C est 67

Exemple

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<p>J'ai affiché A B C</p>
<p>J'ai affiché A B C</p>
</body>
</html>

Essayer par vous-même

Exemple d'explication

<meta charset="UTF-8"> L'élément définit le jeu de caractères.

Les caractères A, B, C sont affichés par les nombres 65, 66 et 67.

Pour que le navigateur sache que vous affichez des caractères, vous devez commencer par &# et terminer par ; (point-virgule) l'entité numérique.

Caractères Emoji

Les emojis sont également des caractères provenant des lettres UTF-8 :

  •  est 128516
  •  est 128525
  •  est 128151

Exemple

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>Mon premier Emoji</h1>
<p>😀</p>
</body>
</html>

Essayer par vous-même

Les emojis sont des caractères, donc ils peuvent être copiés, affichés et redimensionnés comme n'importe quel autre caractère HTML.

Exemple

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>Émoticônes agrandies</h1>
<p style="font-size:48px">
😊 😍 ☀️ 🎉
</p>
</body>
</html>

Essayer par vous-même

Certains emojis dans UTF-8

Emoji Valeur
😖 😕
😔 😓
😒 😑
😐 😏
😎 😍
😌 😋
😊 😉
😈 😇
😆 😅
😄 😍
☀️ 😉

Pour une liste complète, veuillez consulter notre manuel de référence des emojis HTML.