【HTML入門】#04. 文字コードと文字化け対策

チャンネル名:CreatorQuest
◆概要(引用)
本気で学ぶHTML入門講座4回目は、
文字コードと文字化け対策について学習しましょう。

■目次
・概要と目標 0:20
・文字化けの原因 0:38
・文字コードの指定方法 4:43
・文字コードを指定してみよう 9:55
・練習問題 13:09
・解答 13:50
・まとめ 14:57

■文字化けの原因
コンピュータは文字を数値で管理しています。
その数値の事を文字コードと言います。
また、その数値と文字の対応関係の事を
文字エンコーディングと言います。
ただし、文字エンコーディングの事を
文字コードという人も多くます。
従って、CreatorQuestでも、文字エンコーディングの事を
文字コードと呼んでいます。

文字化けは、テキストエディターの文字コードと
ブラウザの文字コードが異なると発生します。
従って、HTMLでテキストエディタの文字コードを指定することで、
解決できます。

■文字コードの指定方法
文字コードの指定は、meta要素を使います。
meta要素はhead要素に配置するメタ情報を指定する要素です。
メタ情報には以下のようなものがあります。
・文字コード
・紹介文
・キーワード
・SNSの情報
などがあります。
基本的には画面に表示されない要素ですが、
ブラウザや検索エンジンがこのメタ情報を使います。

文字コードを指定する場合は、charset属性で指定します。

■演習
meta要素を使って、文字コードを指定する
練習をしてみましょう。

・meta charset=”UTF-8″

○テキストエディタ:ATOM
https://atom.io/

○ブラウザ:Google Chrome
https://www.google.co.jp/chrome/browser/desktop/

■HTML入門講座のHTMLのバージョン
基本的には、HTML 5に対応したレッスンです。
ただし、HTML5.1、XHTML1.0、HTML4.01
に対する補足説明も出来る限り行います。

■本気で学ぶ!HTML入門講座
https://www.youtube.com/playlist?list=PLxmhLTDswFUwaX8i9hAf1Pspo–GswmD1

素材
・CV:さとうささら(CeVIO)
http://cevio.jp/
・CV:タカハシ(CeVIO)
http://cevio.jp/
・BGM:甘茶の音楽工房

コメント

タイトルとURLをコピーしました