seo 影響？ HTML Living Standard とは書き方 html5 違い対応ブラウザまとめ

2022年7月5日
2022年6月7日
seo
google, SEO, web制作, 初心者向け, ノウハウ, webデザイン

HTML 標準仕様となった HTML Living Standard とは何か？HTML Living Standard 書き方や html5 との違い比較そして、HTML Living Standard 対応ブラウザなどをまとめていきます。

HTML Living Standardとは、Apple Mozilla Operaの開発者によって設立されたWHATWGが決めたHTMLの仕様のことを指していて、2022年には、HTML5が廃止されたことで、HTMLの標準仕様となっています。

当然ですが、HTML Living Standardの標準仕様でHTMLをマークアップすることは、結果的に、SEO対策において、プラスになってきます。

しかし、あまり、話題に上らない、HTMLの仕様であるHTML Living Standard。

HTML Living Standard ってなに？
HTML Living Standardの書き方は？
HTML Living Standardで対応するブラウザは何？

といった部分を中心にHTML Living Standardについて、情報をまとめていきます。

この記事では、HTML Living Standardについての基礎知識を高めていただき、SEO集客効果を高めていきたい方向けの記事です。HTML Living Standardの知見が少ないweb担当者、ECサイトのオーナー、web制作会社、webディレクター向けの記事になってきます。

1 HTML Living Standard とは
2 HTML Living Standard 書き方
- 2.1 そもそも HTMLとは
- 2.2 HTML Living Standard 宣言
3 HTML Living Standard html5 違い
4 HTML Living Standard 対応ブラウザ
5 HTML Living Standard とは解説動画
6 まとめ HTML Living Standard 書き方基礎把握でマークアップスキルを向上
7 おすすめ SEO対策関連記事

HTML Living Standard とは

HTML Living Standard 公式ホームページ
 https://html.spec.whatwg.org/multipage/

参考）HTML Living Standard 日本語訳
 https://momdo.github.io/html/

HTML Living Standard とは、Apple や Mozilla や Opera の開発者が作った団体 WHATWG が決めた HTML の仕様のことを指します。

もともと、HTMLは、W3Cという団体が、HTML5 や HTML 5.1 といったバージョンを元に、標準仕様を策定していて、それがスタンダードになりそうでした。しかし、WHATWGの勢いの影響か、それとも、W3Cが、HTML5を廃止したことが影響か、2022年現在では、W3C による HTML の仕様策定は中止になりました。その結果、HTML Living Standard が HTML の標準仕様になりました。

W3C と WHATWG はもともと、HTML5を共同で仕様策定していたんですけどね。分裂したんですよね。

そのときに、Microsoft は W3C をベースとし続けましたが、Google Chrome や Mozilla Firefox、そして Apple Safari は HTML Living Standard に準じることになりました。
その結果、HTML Living Standard が、HTMLの標準仕様となっています。ちなみに、Microsoft の Edge も、2022年では、HTML Living Standard を採用しています。

ちなみに、上述のWHATWGが公開しているGithubもご紹介します。

WHATWG Github
https://github.com/whatwg/html

ライセンスなども記載がありますね。

HTML Living Standard 書き方

参考）HTML 文書の書き方 — Writing HTML documents
https://triple-underscore.github.io/HTML-writing-ja.html

HTML Living Standard 書き方について、解説していきます。といっても、１つ１つ紹介してもなんですので、かいつまみます。

そもそも HTMLとは

HTMLとは、ホームページを作るためのレイアウトをメインとしたプログラム言語です。

基本、HTMLはホームページの構成と、文章や画像などの配置を定義するためのものです。いわゆる、webデザイン、ページの装飾は、CSSが担当します。

HTML Living Standard 宣言

では、続いて、HTML Living Standardの宣言について。

文書型宣言（DOCTYPE）は、ブラウザを標準モードにする目的で使うだけなので、シンプルになっていて

html5形式なら

<!DOCTYPE html>

だけですみます。

XHTMLでも、シンプルにかけます。

html 要素も

<html lang=”ja”>

で済みます。

基本はとってもシンプルなんですよ！

HTML Living Standard html5 違い

ところで、HTML Living Standard と html5 違いって、どんな内容なのでしょうか？

実は、HTML Living Standard と HTML5 にあまり違いはありません。

HTML Living Standard と HTML5 を比較すると、一部のタグの扱いが違うだけです。

HTML Living Standard 追加要素

以下の２つが、追加要素です。

<hgroup>：見出しのグループ化
<slot>：スロット

HTML Living Standard 廃止

HTML Living Standard で廃止された要素も、2つです。

<rb>：操作メニューの項目
<rtc>：操作メニューの項目

HTML Living Standard 追加属性

HTML Living Standard 追加属性は、いろいろあります。

aタグに対して、ping が追加されていて、pingの送信先を指定できます。

imgタグに対しては、decodingといって、画像のデコード方式を指定できるようになりました。

またloadingという属性で、画像の読み込みのタイミングを指定できるようになります。

videoタグには、playsinlineという属性がついて、インライン配信できるようになりましたね。インライン配信できると、ページ速度にも影響するので、GoogleのPageSpeed Insightでも、点数が上がりやすくなります。

HTML Living Standard 対応ブラウザ

HTML Living Standardの対応ブラウザは、2022年5月30日現在、

Google Chrome
Mozilla Firefox
Apple Safari
Opera
Microsoft Edge

になります。

MicrosoftのEdgeは、後発ですが、基本的には、HTML Living Standard 対応を宣言しているので、HTML Living Standard がHTMLの標準規格と理解しておきましょう。

HTML Living Standard とは解説動画

HTML Living Standard について、解説している動画をご紹介します。

実は、HTML Living Standardについて解説しているYoutube動画は、日本語だと、少ないです。おそらく、Youtubeの場合、ユーザーの興味関心が高いコンテンツを中心として、動画が作られるからだと思います。HTML Living Standardは、HTMLの仕様なので、「HTMLは稼げない」という観点から、動画を作る人が少ないのだと思います。

そもそも、HTML Living Standardの仕様の話は地味ですからね。とはいえ、HTML Living Standardについて解説している動画を見つけましたので、ご紹介していきます。

この動画なら、定義だけでなく、HTML Living Standard と html5 とのマークアップの違いなども、実際に、マークアップをしている方の声を聴きながら、理解を深めることが可能です。動画内で、html5との比較で、廃止されているタグなどについても、解説されています。HTML Living Standardとはなどの最新、ITのノウハウ系動画なので、ぜひ1度視聴してみてください。

もちろん、新しく定義されたHTMLタグについても会話がされています。HTML Living Standardって、新しいHTML技術なんだな～ということが痛感される方もいるのではないでしょうか？

実際、新しいHTML技術だと、利用する機会が少ない！というケースもあるかもしれませんが、タグの使い方１つで、今までできなかったレイアウトや、コンテンツの導入の時短がはかれます。

「HTML Living Standardとは」のYoutube動画は、約14分程度の動画になっています。ちょっと長いな～と思うかもしれませんが、HTML Living Standardとは、どんなものなのか？どんなタグが増えているのか？その定義は、どういうようなのか？といった点を理解するにもいい動画です。

まとめ HTML Living Standard 書き方基礎把握でマークアップスキルを向上

HTML Living Standardとは、といった観点から、まとめていきました。HTML Living Standard 書き方や、対応ブラウザなどの基礎知識の習得には役立つ記事だと思います。

HTML Living Standard 書き方を理解して、コーディング、マークアップしていくことで、より、HTMLの標準仕様にそったホームページ構築が可能です。

また、逆の発想で、HTMLにおいて、誤ったタグを使うことで、表示がされなかったり、変なHTML構造にすることで、Googleなどの検索エンジンのbotが理解してくれなくなる可能性も出てきます。

こうなると、クローラーによるコンテンツ理解が止まり、結果的に、Googleに評価されにくくなり、検索ランキングでの上位表示がされにくくなります。

そもそも、表示が崩れていれば、UIとかUXとか、そういう話になるまでもなく、ユーザービリティの低いホームページとなり、集客はおろか、CVもされなくなるでしょう。

場合によっては、ホームページ全体のSEOのパフォーマンスに悪影響が与えかねないのですね。なので、HTML Living Standardは重要なのです。

HTML Living Standardの基礎知識、スキルを高めて、マークアップのきちんとできたホームページ制作をしていきましょうね。

weebly 使い方まとめデザインのおしゃれな無料ホームページ制作ツール

seo 影響？ HTML Living Standard とは書き方 html5 違い対応ブラウザまとめ

HTML Living Standard とは