emoji.php — Tout sur les emoji

🔧 Outils rapides — copier / analyser / tester

100% navigateur

Texte / Emoji à analyser

Astuce : certains emoji sont une séquence de plusieurs caractères (ZWJ, VS16, etc.).

Résultat (infos & codepoints)

Test « emoji style » (VS16) — Variation Selector-16

Exemple classique : ☀ (texte) vs ☀️ (emoji) via U+FE0F.

Aperçu : ☀ (clique les boutons)

Test ZWJ — Zero Width Joiner (composition)

Les emoji « complexes » sont assemblés par ZWJ (U+200D). Sans support, les composants s'affichent séparément.

🎨 Mini mur d'emoji — clique pour copier

Si tu vois des □ ou des emoji « découpés », c'est un manque de support de police/OS ou une version Unicode trop ancienne.

📖 Théorie : c'est quoi un emoji, exactement ?

Unicode · Polices · Rendu

Un « emoji » n'est pas une image en soi : c'est un caractère Unicode (ou une séquence de caractères) que ton OS / application rend via une police (Apple Color Emoji, Segoe UI Emoji, Noto Color Emoji…).

Unicode assigne des points de code (ex: 😀 = U+1F600).
Le rendu dépend de : l'OS, la police, l'app (WhatsApp, Chrome, iOS…), et parfois des paramètres.
Certains symboles existent en « texte » (noir&blanc) et en « emoji couleur » : on force le rendu avec VS16 (U+FE0F).
Beaucoup d'emoji modernes sont composés avec ZWJ (U+200D) pour créer une « ligature emoji ».

⚠️ Le même emoji peut avoir des styles très différents selon plateforme (ex: 😂). Éviter les emoji pour une information « critique » si l'ambiguïté est dangereuse.

Emoji simple : 😀 Emoji + variation : ❤️ = ❤ + U+FE0F Séquence ZWJ : 👩‍💻 = 👩 + ZWJ + 💻 Drapeau : 🇨🇭 = 2 regional indicators

🧩 Composition : VS16, ZWJ, keycap, « tag sequences »

Séquences

1) VS16 (U+FE0F) — demander le rendu emoji

Certains caractères (ex: ☀ ♥ ★ ◼ ▶ ✈) ont un rendu texte possible.
U+FE0F (VARIATION SELECTOR-16) indique « préférer le style emoji ».
U+FE0E (VARIATION SELECTOR-15) indique « préférer le style texte ».

2) ZWJ (U+200D) — assembler plusieurs emoji

ZWJ = « colle » des éléments pour former un pictogramme unique si supporté.
Ex: 👨‍👩‍👧‍👦 ou 👩‍❤️‍👨 ou 👩‍💻 (selon séquences).
Si non supporté, tu peux voir les composants : 👨 👩 👧 👦 séparés (ou □).

3) Keycap

Les touches type 1️⃣ sont des séquences combinant chiffre + variation + « combining enclosing keycap ».
Ex: 1️⃣ n'est pas un seul point de code « simple ».

4) « Tag sequences » (rare)

Certaines séquences utilisent des tags Unicode (ex: drapeaux de subdivisions).
Support très variable selon plateformes.

👋 Variantes : tons de peau, genre, métiers

Modificateurs

Les tons de peau se font via des modificateurs Fitzpatrick (U+1F3FB à U+1F3FF) appliqués à certains emoji « personnes/mains ».

Ex: 👋 + 🏽 → 👋🏽
Genre/neutralité : souvent via séquences ZWJ (ex: 👩‍💻, 👨‍💻, 🧑‍💻)
Les familles/relations : presque toujours des séquences ZWJ.
Attention : toutes les combinaisons ne sont pas supportées partout.

⚠️ Mélanger « skin tone » et certains emoji peut changer la segmentation : pour du parsing, traiter les emoji comme des grapheme clusters, pas comme des char simples.

🚩 Drapeaux : comment ça marche

Regional indicators

Les drapeaux de pays (🇫🇷, 🇯🇵, 🇨🇭…) sont une paire de lettres « regional indicator symbols ».
Ex: 🇨🇭 = 🇨 (U+1F1E8) + 🇭 (U+1F1ED) → « CH ».
Support : variable pour certains drapeaux (territoires, subdivisions).
Les drapeaux « thématiques » (🏳️‍🌈) utilisent souvent ZWJ + VS16.

Si un drapeau ne s'affiche pas : l'OS/app ne supporte probablement pas la séquence, ou le fournisseur d'emoji l'a désactivée.

📱 Compatibilité : pourquoi ça change selon les appareils ?

iOS · Android · Windows · Web

Chaque plateforme a sa police et ses dessins — styles différents.
Les nouvelles versions Unicode ajoutent des emoji : un OS ancien peut afficher □.
Les navigateurs rendent via l'OS (souvent), mais certaines apps (ex: Twitter/X autrefois) rendaient via leurs propres glyphes.
Les séquences ZWJ/VS16 peuvent être traitées différemment selon moteurs.

Pour un produit sérieux : tester sur au moins iOS récent, Android récent, Windows, macOS, et navigateur mobile.

✅ Bonnes pratiques (UX, accessibilité, dev)

Pratique

UX

Éviter les emoji comme seule information (ex: statut critique). Toujours mettre un texte.
Attention au ton : certains emoji changent de sens culturellement.
Limiter en UI dense : trop d'emoji réduit la lisibilité.

Accessibilité

Les lecteurs d'écran annoncent des descriptions. Une suite d'emoji peut devenir très verbeuse.
Pour des icônes décoratives : ajouter aria-hidden="true" ou fournir un label si l'emoji porte du sens.

Dev / données

En base de données : utiliser UTF-8 complet (souvent utf8mb4 côté MySQL).
Pour couper une chaîne : éviter substr (risque de casser une séquence). Utiliser un découpage « grapheme » si possible.
Le « compte » d'emoji != nombre de points de code : une famille peut être 7+ codepoints.

Astuce web : pour afficher certains symboles en mode emoji, ajouter VS16 (U+FE0F) quand c'est approprié.

❓ FAQ

Questions fréquentes

Pourquoi je vois des □ ? Emoji non supporté par ta police/OS (ou version Unicode trop ancienne).
Pourquoi ☀ et ☀️ ne se ressemblent pas ? Présence/absence de VS16 (U+FE0F), et rendu variable selon plateforme.
Pourquoi un emoji prend « plusieurs caractères » ? Parce qu'il peut être une séquence (ZWJ, tons de peau, keycap, drapeaux).
Est-ce que les emoji sont « standardisés » graphiquement ? Non : Unicode standardise surtout le caractère et son intention, pas le dessin exact.

Note : cette page résume le fonctionnement général. Les détails exacts (listes d'emoji, compatibilité par version) évoluent avec Unicode et les OS.