ホームページ >ウェブフロントエンド >htmlチュートリアル >HTML の UTF-8
HTML の UTF-8
- 王林オリジナル
- 2024-09-04 16:39:35493ブラウズ
UTF-8 は、HTML ページを完全に表示するために使用される HTML5 のデフォルトの文字エンコーディングとして定義されています。 UTF-8 は 1 バイトを使用するエンティティ内のすべての文字と記号をカバーし、すべてのブラウザで適切に動作するため、Web 開発者は UTF-8 を使用することをお勧めします。 Unicode 変換フォーマット – 8 ビットは、入力された文字を機械可読コードに変換する方法です。 charset 属性は、HTML の文字エンコーディングを実行するために使用されます。
HTML における UTF-8 の構文
内のUTF-8文字エンコーディングの指定タグは次のように指定されます:
<meta charset="UTF-8">
ここのメタは HTML ドキュメントに関するデータを提供しますが、機械可読です。そしてそれらの要素は、キーワード、最終更新日などを指定します。このメタ タグには、ページへのアクセス中に Web ブラウザーに伝える文字セットが含まれています。
エンコーディングとは、指定された数値を機械が理解できる 2 進数に変換する方法です。ここで、各文字はそれぞれ 1 つ以上のバイトで構成されます。
UTF-8 は HTML でどのように機能しますか?
- 最も一般的なエンコーディング文字は ASCII です。インターネットが世界的に成長するにつれて、唯一サポートされているラテン語は効率的ではありません。だからこそ、業界は最良の選択肢として Unicode に移行したのです。 UTF-8 は Unicode のエンコーディングであり、すべての文字と絵文字にコード ポイントと呼ばれる一意の値を割り当てます。このエンコード システムは ASCII 空間の問題を解決し、W3C の主要なエンコードであると考えられています。また、すべての電子メール メッセージは UTF-8 を使用して作成できるようにすることを推奨しました。これは、ドキュメントの先頭にあるメタ タグを使用して、ページが明示的に UTF-8 として宣言されているかどうかをチェックします。 UTF-8 の有効ビットは 1 ～ 4 バイトとしてエンコードされるため、8、16、24、または 32 ビットとして定義されます。 UTF-8 は、より多くのアプリケーションを理解できるため、既存のアプリケーションの世界標準とみなされます。このエンコーディングは、テキストのエンコードとデータの転送に役立ちます。ほとんどの Web サイトでは UTF-8 エンコーディングが最も適しています。この標準は、世界中のすべての文字、記号、句読点を対象としています。
- UTF-8 は、0 ～ 127 の範囲を ASCII コードとして扱い、それ以降は 192 までをシフト キーとして扱います。次の文字 224 ～ 239 は 2 回シフトする必要があります。したがって、これはマルチバイト変数エンコーディングと呼ばれます。
- Unicode は人間の言語のすべての文字に一意のコードを割り当てます。文字セット (使用可能なすべての文字を特定のセットにグループ化する) は、lang 属性を使用してオーバーライドできます。この Unicode はバイナリに変換され、その逆も同様です。これにより、フォーム送信アプリケーション中に予期しない結果が生じるのを防ぎます。 Web ページのスペースが過度に遅れていることがわかった場合は、UTF-8 を検討する必要があります。 UTF-8 テキストをバイナリに保存すると、char はバイナリになり、varchar は SQL の VARBINARY に表示されます。
例として、「Hi, EDUCBA!」というテキストを見てみましょう。
UTF-8 文字エンコーディングは次のように指定されます:
01001000 01101001 00101100 01100101 01000100 01010101 01000011 01000010 01000001 00100001
これは、機械可読なバイナリ構造に変換されます。
UTF-8 を使用する重要な点
- エンコード標準 ASCII と意図的に互換性があります。
- この推奨 HTML エンコーディングは、使用するスペースが少なく、多くの言語をサポートしています。
- これは SEO に利益をもたらします。 2 つの標準を使用すると、デコードの問題が発生し、SEO に悪影響を及ぼします。これは、SEO の取り組みを助けるためにキャラクターを正しく実装する必要があることを意味します。
次に、コンテンツで外国語を取り上げる際に、Unicode 表現がどのように重要であるかを見ていきます。
HTML における UTF-8 の例
HTML における UTF-8 の例を以下に示します。
例 #1
段落コンテンツを含む簡単な例。
コード:
新しい.html
<meta charset="UTF-8">Page Title !مرحبا بالعالم
你叫什么名字？
This is Chinese Language.
This is the code demonstrating encoding Process
説明:
- 以下のスクリーンショットは、英語と中国語で表示されたコンテンツを示しています。これは、上記の HTML コードが最新のブラウザーで実行される場合、通常は Unicode を参照するためです。
出力:
例 #2
テキスト入力にボタンを使用します。
コード:
lang.html
<!DOCTYPE HTML > <html> <head> <title>HTML sample -buttons</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body> <form action="addressing" method="post"> <fieldset> <legend>Selection list</legend> Checkbox: <input type="checkbox" name="King" value="one"><br> RadioButton1: <input type="radio" name="Queen" value="two"><br> RadioButton2: <input type="radio" name="Jack" value="three" checked="checked"><br> </fieldset> <fieldset> <legend>Give Input</legend> Login Id: <input type="text" name="Login name"><br> Password: <input type="password" name="Strong Password"><br> </fieldset> <fieldset> <legend>Designation</legend> <p><input type="checkbox" name=" Software Engineer"> Software Engineer</p> <p><input type="checkbox" name="Data Analyst"> Data Analyst</p> <p><input type="checkbox" name="Web Developer"> Web Developer</p> <p><input type="checkbox" name=" Senior Analyst"> Senior Analyst</p> </fieldset> <p><input type="submit" value="press"> <input type="reset"></p> </form> </body> </html>
説明:
- 以下のスクリーンショットは、英語と中国語で表示された入力コンテンツを示しています。これは、上記の HTML コードが最新のブラウザーで実行される場合、通常は Unicode を参照するためです。
出力:
例 #3
外国語コンテンツを使用したコード。
コード:
mett.html
<!DOCTYPE html> <html> <head> <title> HTML UTF-8 Charset </title> <meta name="keywords" charset="UTF-8" content="Meta Tags, Metadata" /> </head> <body style="text-align:left"> <H1>Hi Instructor!</H1> <h2> This is my formal e-mail for the joining. </h2> <h3>Hola, me llamo Juan </h3> <b>Mucho gusto </b> </body> </html>
説明:
- 上記のコードは、Web ブラウザーでの互換性をチェックするためにスペイン語を使用しています。
出力:
Example #4
Using JavaScript.
Code:
name.js
<!doctype html>
<html lang="en">
<head>
<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>
</head>
<body>
<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>
</body>
</html>
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:
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.
以上がHTML の UTF-8の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。