recherche
UTF-8 en HTMLSep 04, 2024 pm 04:39 PM
htmlhtml5HTML TutorialHTML PropertiesHTML tags

UTF-8 est défini comme l'encodage de caractères par défaut pour HTML5 utilisé pour afficher parfaitement une page HTML. Il encourage les développeurs Web à utiliser UTF-8 car il couvre tous les caractères et symboles de l'entité qui utilise un octet et fonctionne bien dans tous les navigateurs. Format de transformation Unicode – 8 bits est une méthode qui convertit les caractères saisis en code lisible par machine. L'attribut charset est utilisé pour effectuer un encodage de caractères pour le HTML.

Syntaxe de UTF-8 en HTML

Spécification du codage des caractères UTF-8 dans le fichier le tag est donné comme :

<meta charset="UTF-8">

Ici, la méta donne des données sur le document HTML mais est lisible par machine. Et leurs éléments spécifient un mot-clé, la dernière modification, etc. Cette balise méta contient le jeu de caractères, qui informe le navigateur Web lors de l'accès à la page.

Le codage est la façon dont les nombres donnés sont convertis en nombres binaires, ce qu'une machine a compris. Ici, chaque caractère est composé respectivement d'un ou plusieurs octets.

Comment fonctionne UTF-8 en HTML ?

  • Le caractère d'encodage le plus populaire est ASCII ; à mesure qu'Internet s'est développé à l'échelle mondiale, le seul latin pris en charge n'est pas efficace ; c'est pourquoi une industrie a opté pour Unicode comme la meilleure option. UTF-8 est le codage pour Unicode, qui attribue une valeur unique appelée point de code pour tous les caractères et emojis. Ce système de codage résout le problème dans l'espace ASCII et est considéré comme un codage dominant pour le W3C. Et il a recommandé que tous les messages électroniques puissent être créés en utilisant UTF-8. Cela vérifie si la page se déclare explicitement comme UTF-8 en utilisant une balise méta au début du document. Le bit significatif de l'UTF-8 est défini comme 8,16, 24 ou 32 bits car ils sont codés sur un à quatre octets. UTF-8 est considéré comme une norme mondiale pour les applications existantes car il comprend davantage d'applications. Cet encodage permet d'encoder du texte et de transférer des données. L’encodage UTF-8 est préférable sur la plupart des sites Web. Cette norme couvre tous les caractères, symboles, ponctuations partout dans le monde.
  • UTF-8 traite une plage 0-127 comme code ASCII et plus tard jusqu'à 192 comme touches Maj. Et les caractères suivants, 224-239, doivent être décalés doublement. Par conséquent, on parle de codage de variables multi-octets.
  • Unicode attribue un code unique à chaque caractère d'un langage humain. Le jeu de caractères (regroupant tous les caractères disponibles dans un jeu spécifique) peut être remplacé à l'aide de l'attribut lang. Cet Unicode se traduit en binaire et vice-versa. Cela évite les résultats inattendus lors des demandes de soumission de formulaire. UTF-8 doit être pris en compte lorsque nous constatons que les pages Web accusent un retard excessif en termes d'espace. Stockage du texte UTF-8 dans un binaire pendant que char devient binaire, varchar s'affiche en VARBINARY en SQL.

A titre d'exemple, prenons le texte Salut, EDUCBA !

L'encodage des caractères UTF-8 est indiqué ci-dessous :

01001000 01101001 00101100 01100101 01000100 01010101 01000011 01000010 01000001 00100001

Qui se convertit en une structure binaire lisible par machine.

Importance clé d'utiliser UTF-8

  • Il est volontairement compatible avec la norme d'encodage ASCII.
  • Ce codage HTML préféré utilise moins d'espace et prend en charge de nombreuses langues.
  • Cela profite au référencement. Supposons que vous utilisiez deux standards, cela conduit à un problème de décodage qui impacte à tort le référencement. Cela signifie que nous devons implémenter correctement le personnage pour aider les efforts de référencement.

Ensuite, nous verrons en quoi la représentation Unicode est importante lors de l'intégration des langues étrangères dans le contenu.

Exemples d'UTF-8 en HTML

Vous trouverez ci-dessous les exemples d'UTF-8 en HTML :

Exemple n°1

Exemple simple avec le contenu du paragraphe.

Code :

nouveau.html



<meta charset="UTF-8">
Page Title



!مرحبا بالعالم

你叫什么名字?

This is Chinese Language.

This is the code demonstrating encoding Process

Explication :

  • La capture d'écran ci-dessous montre le contenu affiché en chinois ainsi qu'en anglais. En effet, lorsque le code HTML ci-dessus est exécuté dans un navigateur moderne, il fait normalement référence à Unicode.

Sortie :

UTF-8 en HTML

Exemple n°2

Utilisation des boutons pour le texte de saisie.

Code :

lang.html



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


Selection list Checkbox:
RadioButton1:
RadioButton2:
Give Input Login Id:
Password:
Designation

Software Engineer

Data Analyst

Web Developer

Senior Analyst

Explication :

  • La capture d'écran ci-dessous montre le contenu d'entrée affiché en chinois ainsi qu'en anglais. En effet, lorsque le code HTML ci-dessus est exécuté dans un navigateur moderne, il fait normalement référence à Unicode.

Sortie :

UTF-8 en HTML

Exemple #3

Code utilisant un contenu en langue étrangère.

Code :

mett.html



<title>
HTML UTF-8 Charset
</title>
<meta name="keywords" charset="UTF-8" content="Meta Tags, Metadata">


<h1 id="Hi-Instructor">Hi Instructor!</h1>
<h2>
This is my formal e-mail for the joining.
</h2>
<h3 id="Hola-me-llamo-Juan">Hola, me llamo Juan </h3>
<b>Mucho gusto </b>

Explication :

  • Le code ci-dessus utilise la langue espagnole pour vérifier la compatibilité dans le navigateur Web.

Sortie :

UTF-8 en HTML

Example #4

Using JavaScript.

Code:

name.js



<meta charset="utf-8">
<title>UTF-8 Charset</title>
<style>
span {
color: blue;
}
span.name {
color: red;
font-weight: bolder;
}
</style>
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>


<div>
<span>Thomas,</span>
<span>John Betson,</span>
<span>Valli Tromson</span>
</div>
<div>
<span>आभरणा,</span>
<span>आचुथान,</span>
<span>अभिनंध</span>
</div>
<script>
$( "div span:first-child" )
.css( "text-decoration", "Underline" )
.hover(function() {
$( this ).addClass( "name" );
});
</script>

Explanation:

  • The above code uses functions to class the respective class. Before that, we have declared metadata for the encoding process. Here we have assigned an element with another language. Unfortunately, ASCII doesn’t have compatibility to access. Therefore, we have declared UTF-8 to support the type.

Output:

UTF-8 en HTML

Conclusion

So that’s all about the encoding of UTF-8 in HTML. We have gone through Unicode and encodes in the HTML briefly and the implementation of HTML and JavaScript. In this emerging software world, the character sets are not made so feasible; therefore, there comes character encoding schemes to be done with the HTML and other programming languages. Therefore, it is said that it is best to use UTF-8 everywhere where it doesn’t need any conversions encoding.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
HTML超文本标记语言--超在那里?(文档分析)HTML超文本标记语言--超在那里?(文档分析)Aug 02, 2022 pm 06:04 PM

本篇文章带大家了解一下HTML(超文本标记语言),介绍一下HTML的本质,HTML文档的结构、HTML文档的基本标签和图像标签、列表、表格标签、媒体元素、表单,希望对大家有所帮助!

html和css算编程语言吗html和css算编程语言吗Sep 21, 2022 pm 04:09 PM

不算。html是一种用来告知浏览器如何组织页面的标记语言,而CSS是一种用来表现HTML或XML等文件样式的样式设计语言;html和css不具备很强的逻辑性和流程控制功能,缺乏灵活性,且html和css不能按照人类的设计对一件工作进行重复的循环,直至得到让人类满意的答案。

web前端笔试题库之HTML篇web前端笔试题库之HTML篇Apr 21, 2022 am 11:56 AM

总结了一些web前端面试(笔试)题分享给大家,本篇文章就先给大家分享HTML部分的笔试题(附答案),大家可以自己做做,看看能答对几个!

HTML5中画布标签是什么HTML5中画布标签是什么May 18, 2022 pm 04:55 PM

HTML5中画布标签是“<canvas>”。canvas标签用于图形的绘制,它只是一个矩形的图形容器,绘制图形必须通过脚本(通常是JavaScript)来完成;开发者可利用多种js方法来在canvas中绘制路径、盒、圆、字符以及添加图像等。

总结HTML中a标签的使用方法及跳转方式总结HTML中a标签的使用方法及跳转方式Aug 05, 2022 am 09:18 AM

本文给大家总结介绍a标签使用方法和跳转方式,希望对大家有所帮助!

html5废弃了哪个列表标签html5废弃了哪个列表标签Jun 01, 2022 pm 06:32 PM

html5废弃了dir列表标签。dir标签被用来定义目录列表,一般和li标签配合使用,在dir标签对中通过li标签来设置列表项,语法“<dir><li>列表项值</li>...</dir>”。HTML5已经不支持dir,可使用ul标签取代。

html中document是什么html中document是什么Jun 17, 2022 pm 04:18 PM

在html中,document是文档对象的意思,代表浏览器窗口的文档;document对象是window对象的子对象,所以可通过“window.document”属性对其进行访问,每个载入浏览器的HTML文档都会成为Document对象。

html5支持boolean值属性吗html5支持boolean值属性吗Apr 22, 2022 pm 04:56 PM

html5支持boolean值属性;boolean值属性指是属性值为true或者false的属性,如input元素中的disabled属性,不使用该属性表示值为flase,不禁用元素,使用该属性可以不设置属性值表示值为true,禁用元素。

See all articles

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semainesBy尊渡假赌尊渡假赌尊渡假赌
Repo: Comment relancer ses coéquipiers
4 Il y a quelques semainesBy尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
4 Il y a quelques semainesBy尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

Listes Sec

Listes Sec

SecLists est le compagnon ultime du testeur de sécurité. Il s'agit d'une collection de différents types de listes fréquemment utilisées lors des évaluations de sécurité, le tout en un seul endroit. SecLists contribue à rendre les tests de sécurité plus efficaces et productifs en fournissant facilement toutes les listes dont un testeur de sécurité pourrait avoir besoin. Les types de listes incluent les noms d'utilisateur, les mots de passe, les URL, les charges utiles floues, les modèles de données sensibles, les shells Web, etc. Le testeur peut simplement extraire ce référentiel sur une nouvelle machine de test et il aura accès à tous les types de listes dont il a besoin.

Navigateur d'examen sécurisé

Navigateur d'examen sécurisé

Safe Exam Browser est un environnement de navigation sécurisé permettant de passer des examens en ligne en toute sécurité. Ce logiciel transforme n'importe quel ordinateur en poste de travail sécurisé. Il contrôle l'accès à n'importe quel utilitaire et empêche les étudiants d'utiliser des ressources non autorisées.

Version crackée d'EditPlus en chinois

Version crackée d'EditPlus en chinois

Petite taille, coloration syntaxique, ne prend pas en charge la fonction d'invite de code

mPDF

mPDF

mPDF est une bibliothèque PHP qui peut générer des fichiers PDF à partir de HTML encodé en UTF-8. L'auteur original, Ian Back, a écrit mPDF pour générer des fichiers PDF « à la volée » depuis son site Web et gérer différentes langues. Il est plus lent et produit des fichiers plus volumineux lors de l'utilisation de polices Unicode que les scripts originaux comme HTML2FPDF, mais prend en charge les styles CSS, etc. et présente de nombreuses améliorations. Prend en charge presque toutes les langues, y compris RTL (arabe et hébreu) ​​et CJK (chinois, japonais et coréen). Prend en charge les éléments imbriqués au niveau du bloc (tels que P, DIV),