この記事について：この記事は2007年5月に公開した物を再アップした物です。詳しくはこの記事を参照してください。
WordPressテーマの説明に入る前にブログで実践されるウェブ・デザインを知っておく必要があります。正直言って、WordPressテーマ をカスタマイズ、もしくは作成するにあたって重要なのはPHPよりも、XHTML+CSSでコーディングされたウェブ・スタンダードなサイトを作れるスキ ルです。（データベースからの結果を操作する、設定パネルを作る、等のよほど凝ったカスタマズでない限り。）
ここでは、WordPressテーマの構造を理解するのに必要な一般的なブログのレイアウトと、ウェブ・スタンダードとの関連性についてだけを簡単に解説します。XHTMLとCSSのスキルが足りないと感じている方は、ほかのサイトや書籍も参考にして下さい。
ブログ・デザインの定番
最 近は幾つか個性的なデザインも出てきましたが、まだまだ下の画面のようなデザインが一般的ではないでしょうか。ヘッダー（Header）とフッ ター（Footer）にサンドイッチされる形で、コンテンツ（Content）とサイドバー（Sidebar）があります。画面はWordPressの ディフォルト・テーマですが、ここではサイドバーが右に配置されています。テーマによっては、右側に表示されていたり、左右両方に表示されていたりしま す。
大抵の場合、これらの大きな「ブロック」は<div>...</div>で囲まれており、一目でそれと分かるID名（もしくはclass名）が振られています。例えば、上図にみられるようにdefaultテーマでは：
- <div id=”header”>…</div>
- <div id=”content”>…</div>
- <div id=”sidebar”>…</div>
- <div id=”footer”>…</div>
の４つです。更にこれらは<div id="page">...</div>として１つにまとめられています。普通よく目にするのはid="page"ではなくid="wrapper"、もしくはid="container"と言ったid名なのですが、役割は同じです。
構造と表現の分離
ほ とんどの（ほぼ全てと言っていいかも）ブログはXHTML+CSSでコーディングされており、WordPressも例外では有りません。構造部分は XHTMLで書かれ、「見た目」の部分はCSSによって制御されています。建物にたとえるならば、鉄筋コンクリートの骨組みはXHTML、壁紙や照明、家 具と言った装飾はCSS、と言った感じです。
先ほど「ブログ・デザインの定番」で出てきたWordPressのデフォルト・テー マもXHTML+CSSでコーディングされています。このテーマで使用されているCSSを一時的に無効にすると、下の図のように表示されます。上から順に ヘッダー、コンテンツ、サイドバー、フッターの順に書かれています。
ウェブ・スタンダード
この「構造と表現の分離」はウェブ・スタンダードの大きな柱の一つです。ウェ ブ・スタンダード（Web Standards）とは一種のガイドラインのようなもので、W3Cが策定と勧告を行っている規格に準拠した本来の正しい制作手法でウェブ・サイトを作ろ うと言う動きです。
もう１つウェブ・スタンダードの大きな概念として「構造を示すタグ付け」があります。これは表示方法を指定する為ではなく、文書中での役割を示す為にタグを使おう、と言う事です。例えば、<h1>～</h1>タグは文字のサイズを大きく見せる為ではなく、きちんと見出しとして使用する。強調する為に文字を太字にするのであれば、<b>～</b>ではなく、<strong>～</strong>を使用する。
このほかにも幾つか重要な要素（DOM、アクセシビリティ、セマンティック等など）がウェブ・スタンダードには有るのですが、ここでは省略します。
（メ モ：よくWeb Standardsは「Web標準」や「Webの標準規格」として訳される事が多いです。何か１つに決められまとめられた、つまり標準化された、規格だと 思われる方が多いようですが、そうではありません。「標準」は間違った訳ではないのですが、「Standards」は複数形であって、「１つ」ではないの です。「ガイドライン」又は「方向性を示す目印」とも言えるかもしれません。）
ウェブ・スタンダードとWordPressテーマ
ではなぜウェブ・スタンダードの事を書いたかと言うと、WordPressテーマの仕組みはウェブ・スタンダードに準拠したサイト製作が出来るように作られており、現にダウンロードできるテーマのほぼ全てはウェブ・スタンダードに（少なからず）準拠したものだからです。
もちろんテーマにはピンからキリまであり、ウェブ・スタンダードのお手本になれるような素晴らしいテーマもあれば、そうでないのもあります。しかし概ね、少なくとも僕自身が見てきた中では、最低限「構造と表現の分離」は実践されています。
状 況に応じた（動的な）表示や、WordPress本体との連携にはPHPを用いていますが、ブラウザ上で見える「見た目」に関する多くの部分はPHPでは なく、「XHTML+CSS」なのです。そして、海外では当たり前になってきている「ウェブ・スタンダード準拠」がどういう事か知っておいて損はしませ ん。「XHTML+CSS」と後述する「テンプレート・タグ」の２つが、テーマの見た目を自分好みにカスタマイズする上で最も重要な要素と言えると思いま す。