おおたおおた
2015/02/23

HTMLの主なバージョンを見極めるポイント

この記事は約4分で読めます。

HTMLの主なバージョンを見極めるポイント

初級カスタマイズ

webサイトがどのバージョンのHTMLで作成されているのか?
一番簡単に見極めるられる方法は、ページ上で右クリック、「ページのソースを表示」を選択。
ページ一番上に <!DOCTYPE… と書かれた記述(DOCTYPE宣言)を見ることでバージョンの確認ができます。

DOCTYPE宣言

●HTML4.01
・<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
・<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
・<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN” “http://www.w3.org/TR/html4/frameset.dtd”>
のどれか。

●XHTML1.0
・<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
・<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
・<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
のいずれか。

●HTML5
<!DOCTYPE html>

 

ちなみにこのDOCTYPE宣言を省略してしまうと、ブラウザがどのバージョンで作成されているか認識できず、
自分のブラウザでは上手く表示されていても、他の人のブラウザではちゃんと表示されない事もあります。

2014年に、「W3C」というWebで使われる技術の標準化を行っている団体が「HTML5」を正式勧告しています。
IE9以降及び、その他の主要ブラウザもHTML5の機能に対応しています。
IE8以下の対応を迫られる場合を除き、「HTML5」で記述するようにしましょう。

では記述内容としてはどのような違いがあるのでしょうか?

HTML4.01

・DOCTYPE宣言が必須
・<HTML>、<HEAD>、<BODY>の開始・終了タグを省略可能。
・要素の大文字と小文字は区別されない。(<br>も<BR>も同じ)

XHTML1.0

・要素は小文字でなければならない。
・タグの省略はできない
・属性値は全て” ”引用符で囲む。
・空要素タグは全て /> で閉じる。(<br />など)

HTML5

HTML5は人間にもコンピューターにも馴染みやすくするという目的があります。
文章構造においては、例えばそれまでは<div id=”footer”>としていたのが、<footer>として記述することで
ウェブブラウザにも検索エンジンにも、構造を認識してもらえるようになりました。
その他にも<section>、<article>、<aside>、<header>、<nav>などがあります。

HTML5には追加された要素や、変更、削除された要素があります。

主にcssで代用できる「font」「center」や、
ユーザビリティに悪影響を及ぼす「frame」など削除されています。

追加されたものもたくさんあります。
例えばフォームで使われる<input>タグ。
<input type=”tel”>や<input type=”e-mail”>など、タイプ指定できるものが増えています。

削除・追加されたものについては検索すると一覧が掲載されているサイトがあります。
ご参照下さい。

http://www.htmq.com/html5/002.shtml

HTMLの主なバージョンを見極めるポイント
おおた イラストレーター / フロントエンジニア

リトルトゥースです。

一覧へ戻る

私たちについて

私たち『Camarade(カマラード)』はクリエイター目線で
総合的な情報を発信するWebメディアとして
PhotoShopやillustratorの活用方法や、WordPressなどのCMSの
カスタマイズ方法など幅広い情報をお届けしていきます。
同時にSOHOやフリーランスのパートナーを募集しております。