フリーランス WEBデザイナー 【キングサイト】
最近のウェブ制作技術
WordPress(ワードプレス)で記事のアップと同時にFacebookやTwitterに共有させることが出来る「Jetpack」プラグインの設定方法
ソーシャルネットサービス【SNS】情報・活用方法
WordPress(ワードプレス)で記事のアップと同時にFacebookやTwitterに共有させることが出来る「Jetpack」プラグインの設定方法
WordPress(ワードプレス)で親カテゴリーを指定して子カテゴリ一覧(カテゴリーリスト)を表示させる方法
ブログツール【CMS】情報とWEBコンテンツ技術
WordPress(ワードプレス)で親カテゴリーを指定して子カテゴリ一覧(カテゴリーリスト)を表示させる方法
Webデザイナーになる為の第一歩(初級)
WEB屋になる為の知識と技術
Webデザイナーになる為の第一歩(初級)
WordPress(ワードプレス)でカテゴリー編集画面に新しい項目と画像アップロード機能を追加する設定方法
ブログツール【CMS】情報とWEBコンテンツ技術
WordPress(ワードプレス)でカテゴリー編集画面に新しい項目と画像アップロード機能を追加する設定方法
WordPress(ワードプレス)でカテゴリー編集画面に新しい項目を追加する設定方法
ブログツール【CMS】情報とWEBコンテンツ技術
WordPress(ワードプレス)でカテゴリー編集画面に新しい項目を追加する設定方法
ウェブ制作カテゴリ
Facebookの投稿
ウェブ制作技術 SNS・ブログ
おすすめウェブサイト
ウェブ制作のご注文は全国対応

北海道 青森 岩手 秋田 宮城 山形 福島 東京 神奈川 埼玉県 千葉 茨城 群馬 栃木 愛知 静岡 三重 岐阜 新潟 長野 山梨 石川 富山 福井 大阪 京都 奈良 兵庫 滋賀 和歌山 岡山 広島 鳥取 山口 島根 愛媛 徳島 高知 香川 福岡 佐賀 長崎 大分 熊本 宮崎 鹿児島 沖縄

HTML5メタタグ部分のソースの書き方

21.12.12 00:56 | コメント(0)

HTML5メタタグ部分のソースの書き方

HTML5では、メタタグの宣言が結構省略されるようになりました。今後HTML5+CSS3はどんどん普及してくると思います。 まず、少しずつでも基礎を覚えていきましょう。
 1. DOCTYPE宣言
 2. html要素
 3. 文字コード
 4. 重要点!!
 5. HTML5メタタグ文字列

DOCTYPE宣言

HTML5では、今まで長かった「DOCTYPE宣言」の文字列がとても短くなりました。
HTML5の「DOCTYPE宣言」を記載する文字列をご説明させて頂きます。

【XHTML1.1の場合】
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
【HTML5の場合】
<!DOCTYPE html>

html要素

HTML5では、html要素の余計な言語を示す文字列やバージョンを示す文字列がなくなりスッキリしました。
HTML5の「html要素」を記載する文字列をご説明させて頂きます。

【XHTML1.1の場合】
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ja">
【HTML5の場合】
<html>

文字コード

HTML5では、今まで1行から3行ほどあった文字コードの表示方法が一気に短くなりました。
HTML5の「文字コード」を記載する文字列をご説明させて頂きます。

【XHTML1.1の場合】



【HTML5の場合】


重要点!!

今までのHTMLやXHTML1.1の場合はmeta要素の終了タグ「/」が必ず必要でしたが、HTML5になり終了タグ「/」を書かなくてもよくなりました。
HTML5では、終了タグ「/」を記載しても記載しなくてもどちらでも構いません。
<meta charset="utf-8">
でも
<meta charset="utf-8" />
でも構いません。

HTML5メタタグ文字列

ここまでの文字列を復習しHTML5の「メタタグ文字列」を記載する文字列をご説明させて頂きます。 【XHTML1.1の場合】
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>ページタイトル</title>
</head>
<body>
</body>
</html>
【HTML5の場合】
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ページタイトル</title>
</head>
<body>
</body>
</html>
以上がHTML5のメタタグの基本ベースです。
カテゴリ:HTML5, HTML5 + CSS3の基礎, WEB屋になる為の知識と技術
  • このエントリーをはてなブックマークに追加
  • Facebookでコメントする

    コメントする

    おすすめの記事

    PAGE TOP