web-dev-qa-db-fra.com

Affichage de symboles Unicode en HTML

Je veux simplement afficher les symboles de graduation (✔) et de croix () dans une page HTML, mais cela se présente sous la forme d'une boîte ou d'un goop -, ce qui est évidemment lié au codage.

J'ai défini la balise meta pour afficher utf-8 mais, de toute évidence, quelque chose me manque.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

Edit/Solution: D'après des commentaires, en utilisant FireBug, j'ai trouvé que les en-têtes transmis par ma page étaient en fait "Content-Type: text/html" et non UTF-8. L'examen du format de fichier à l'aide de Notepad ++ a montré que mon fichier était au format "UTF-8 sans nomenclature". En changeant cela en UTF-8, les symboles s'affichent désormais correctement ... mais Firebug semble toujours indiquer le même type de contenu.

htmlunicode
85
Peter Craig

Vous devez vous assurer que les en-têtes du serveur HTTP sont corrects.

En particulier, l'en-tête:

Content-Type: text/html; charset=utf-8

devrait être présent.

La balise META est ignorée par les navigateurs si l'en-tête HTTP est présent.

Assurez-vous également que votre fichier est bien codé au format UTF-8 avant de le servir. Vérifiez/essayez les solutions suivantes:

  • Assurez-vous que votre éditeur le sauvegarde au format UTF-8.
  • Assurez-vous que votre FTP ou tout programme de transfert de fichier ne gâche pas le fichier.
  • Essayez avec des entités codées HTML, comme &#uuu;.
  • Pour être vraiment sûr, hexdump le fichier et regarder comme le caractère, pour le ✔, ce devrait être E2 9C 94.

Remarque: Si vous utilisez un caractère Unicode pour lequel votre système ne peut pas trouver un glyphe (aucune police avec ce caractère), votre navigateur devrait afficher un point d'interrogation ou un symbole de type bloc. Mais si vous voyez plusieurs caractères romains comme vous, cela dénote un problème d’encodage.

51
Nicolas Goy

Je sais qu'une réponse a déjà été acceptée, mais je voulais souligner quelques points.

Définir les paramètres content-type Et charset est évidemment une bonne pratique. Il est préférable de le faire sur le serveur, car cela garantit la cohérence de votre application.

Cependant, j'utiliserais UTF-8 Uniquement lorsque la langue de mon application utilise beaucoup de caractères disponibles uniquement dans le jeu de caractères UTF-8. Si vous souhaitez afficher un caractère ou un symbole Unicode dans l'un des cas, vous pouvez le faire sans modifier le charset de votre page.

HTML les moteurs de rendu ont toujours été en mesure d'afficher des symboles qui ne font pas partie du jeu de caractères d'encodage de la page, tant que vous le mentionnez dans sa numeric character reference (NCR). Cela semble bizarre mais c'est vrai.

Ainsi, même si votre html a un en-tête indiquant qu’il a un encodage de ansi ou l’un des jeux de caractères iso, vous pouvez afficher une coche en utilisant son caractère HTML. référence, en décimal - # 10003; ou en hex - # x2713;

Il est donc un peu difficile de comprendre pourquoi vous êtes confronté à ce problème sur vos pages. Pouvez-vous vérifier si la valeur NCR est correcte, c’est une bonne référence http://www.fileformat.info/info/unicode/char/2713/index.htm

15
Akshay

Assurez-vous de bien enregistrer le fichier au format UTF-8, sinon utilisez des entités HTML (&#nnn;) pour les caractères spéciaux.

5
Guffa

Contrairement à ce que propose Nicolas, la balise meta n’est pas ignorée par les navigateurs. Cependant, le Content-Type L’en-tête HTTP a toujours la priorité sur la présence d’une balise meta dans le document.

Veillez donc à envoyer le bon codage via l’en-tête HTTP ou à ne pas envoyer cet en-tête HTTP du tout (non recommandé). La balise meta est principalement une option de secours pour les documents locaux qui ne sont pas envoyés via le trafic HTTP.

L’utilisation d’entités HTML doit également être considérée comme une solution de contournement - c’est la solution idéale. Configurer correctement le serveur Web évite beaucoup de problèmes.

5
Konrad Rudolph

Je pense que ceci est un problème de fichier, vous avez simplement enregistré votre fichier en codage sur 1 octet comme en latin-1. Google dans votre éditeur et comment définir les fichiers à utf-8.

Je me demande pourquoi certains éditeurs n’utilisent pas par défaut utf-8.

0
Kugel