2012年07月24日 category : Web tags :

まだまだ現役!XHTMLのHTMLからの変更点と種類のまとめ

このエントリーをはてなブックマークに追加

dtd

HTMLからXHTMLへ移行する際の変更点と、各DTD宣言(文書型宣言)について紹介します。

WordPressを使うとブログを比較的容易にカスタマイズすることが可能ですが、自分の変更したいようにブログをカスタマイズしたりブログの見かけ(デザイン)を変更しようとするとある程度のXHTMLやCSSの知識が必要となってきます。

HTML5で書かれたサイト(当ブログもHTML5を採用しています)が増えてきましたがまだまだXHTML+CSSで書かれたサイトも現役バリバリで稼働していまのでHTMLからXHTMLへの変更点とその種類をまとめてみました。

01 . HTML、XHTML、CSS 読み方・意味

HTML(HyperText Markup Language)

SGMLから派生。論理構造(骨組み)を記載するマークアップ言語。HTML4.0よりHTMLファイル内に記述されていた見栄えの要素(色、文字サイズ、背景色など)はCSSを使うように変更。HTML4.1では移行Ver.として3つの文書タイプが用意されている。

XHTML(Extensible HyperText Markup Language)

HTML1.0をベースにXMLに準拠させたマークアップ言語。最初のXHTML1.0では移行Ver.として3つの文書タイプがある。Extensibleの意味は「拡張、伸ばせる、伸張性の」

CSS(Cascadeing Style Sheets)

色、背景色、文字サイズ、レイアウトなどの見栄え要素を記述する。Cascadingの意味は「連鎖的に繋がる・斜面滑降」。

02 . HTML→XHTMLの変更点 Web標準とは

XHTMLとは各Webブラウザごとに独自拡張を持つHTMLをXMLに適合するように定義し直したマークアップ言語です。 Web技術の標準化を目的とする団体W3C(World Wide Web Consortium)により規格化されています。

HTML→XHTMLとなり一部の要素・属性が非推奨となっているほか、記述方法もルール化されています。W3C最初の勧告となるXHTML1.0は移行Ver.の色が強く非推奨の要素も使える文書タイプなど3種類用意されています。

XHTML1.1では、XHTML1.0で非推奨とされていた要素・属性のうち廃止されているものもあり非推奨の要素、属性の扱いを意識したマークアップが必要となります。

03 . HTML→XHTMLの主だった変更点

・xml宣言を行う
・html要素にxmlns属性を指定する
・大文字、小文字の区別あり。
・要素、属性は小文字で記載する <BODY> → <body>
・空要素は />で終わる <br> →<br />
・liなど終了タブを省略しない。対で使用すること
・ファイル内の位置指定はname属性からid属性に変更。XHTML1.0では併用 <a name=”XXX” id=”XXX”>
・属性値はダブルクォーテーションでくくること width=xxx → width=”xxx”
・特殊文字はコードで入力 & → &amp;
・属性名の省略禁止 属性名と属性値が同じでも省略できない

04 . HTML、XHTML 文書型宣言 DTD宣言

DTD(Document Type Definition)文書型宣言

HTMLにてマークアップを行う際に、どのタイプの文書構造で書いていくのかを宣言する必要があります。ここでは種類だけ記載します。必要に応じたDTDを使用しましょう。

HTML4.01

・HTML4.01 Strict DTD
・HTML4.01 Transitional DTD
・HTML4.01 Frameset DTD

XHTML1.0

・XHTML1.0 Strict DTD
・XHTML1.0 Transitional DTD
・XHTML1.0 Frameset DTD

HTML4.01/XHTML1.0 とも移行Ver.として3つの文書タイプが用意されています。Strictは非推奨の要素・属性の使用不可、フレームの使用不可などの制限があります。

Transitionalは移行しやすいタイプで非推奨の要素・属性の使用も可能です。但しフレームの使用は不可となっています。

Framesetは非推奨の要素・属性の使用可能、さらにフレームの使用も可能となっています。

XHTML1.1

・XHTML1.1 DTD

XHTML1.0は移行バージョンとしての扱いであったため3タイプ用意されていましたが、XHTML1.1では1つのみとなりました。移行後のDTD(文書型宣言)ということで非推奨の要素・属性は未定義となっており使用不可です。

他に携帯端末や家電向けに用意されたXHTML Basic 1.1 DTDがあります。

05 . まとめ

このようにDTDタイプの種類、非推奨要素の使用可否など色々用意されていますが、文書構造と見栄え要素はしっかり分け、HTMLファイル(またはXHTMLファイル)とCSSファイルにしましょうというのは共通しています。

DTDの種類によって非推奨の要素などがありますので、マークアップを行うサイトの状況に合わせて文書型宣言を選択してください。XHTMLでは指定がなければStrict(厳格な)よりTransitional(移行型)を使ったほうが制限は少ないです。

文書構造(HTMLやXHTML)と装飾(CSS)の書き方も覚えていくとブログに対し、より自由なカスタマイズが可能になってきます。書いた実装がすぐに確認しやすいのもWEBの特徴のひとつだと思います。積極的にいろいろ試してみましょう:)

HOME >>  Web > まだまだ現役!XHTMLのHTMLからの変更点と種類のまとめ