2. XHTMLでベースを作る
PC向けのウェブサイトであれば、記述には HTML4.01 や XHTML1.1 など、いくつかの言語が使えます。 文字コードも SHIFT-JIS や EUC-JP、UTF-8など、様々な規格が使えます。 しかし、携帯端末向けのウェブサイトだと、使える言語や文字コードには制限があります。
記述に使う言語は「 XHTML Mobile Profile 1.0 」
携帯サイトを作るための言語としては、以前は「CompactHTML」や「HDML」などいくつかの規格がありました。 これらは、3大キャリア各社で採用規格や仕様が異なるため、単一ページで3大キャリアすべてに対応させるのは困難です。 また、スタイルシートで装飾が記述できないなど、不便でもあります。
現在発売されている携帯端末では、3大キャリアとも「XHTML」を解釈できるので、XHTMLで記述するのが良いでしょう。 XHTMLにもいくつかの規格がありますが、この記事では「XHTML Mobile Profile 1.0」を使って記述することにします。
「XHTML Mobile Profile 1.0」であれば、3大キャリア共通のページを作成できます。 また、検索エンジンからも「携帯サイト」であると認識されます。
※携帯端末向けのXHTMLとしては「XHTML Basic」がありますが、docomoが必要とするスタイルシートの記述方法が「XHTML Basic」では使えません（詳しくは後述）。 従って、現状で3大キャリア共通のページを作るには、「XHTML Mobile Profile 1.0」が最も良いでしょう。
文字コードは SHIFT-JIS
文字コードは、「SHIFT-JIS」を採用します。理由は、SHIFT-JISしか読まない端末があるためです。 作成したページは、文字コードを「SHIFT-JIS」にして保存して下さい。
※端末によっては、UTF-8やEUC-JPなどの文字コードが読めるものもありますが、SHIFT-JISしか読めない端末も多いため、SHIFT-JISで作成しておくのが良いでしょう。
携帯サイトを作るXHTMLソース（枠組み）
「 XHTML Mobile Profile 1.0 」を使って、文字コード「 SHIFT-JIS 」で記述するXHTMLソースは、以下のようになります。
<?xml version="1.0" encoding="Shift_JIS" ?> <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="application/xhtml+xml ; charset=Shift_JIS" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta name="description" content="紹介文" /> <title>ページタイトル</title> </head> <body> （--- 本文領域 ---） </body> </html>
■1行目：<?xml version="1.0" encoding="Shift_JIS" ?>
XML宣言です。XHTMLで記述しているので最初にこの1行を書きます。 文字コードをSHIFT-JIS以外にした場合は、「encoding="Shift_JIS"」の部分を書き換えて下さい。 ただし、現状で携帯端末向けのサイトを作るならSHIFT-JISで作ることをお勧めします。（SHIFT-JISしか読まない機種があるため）
■2行目：<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML ～
「 XHTML Mobile Profile 1.0 」で記述していることを示すDOCTYPE宣言です。これはこのまま記述します。
■3行目：<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" ～
HTML要素と名前空間の記述です。これもこのまま記述します。
（コンテンツが日本語でない場合は「ja」の部分を修正する必要があります。）
■5行目：<meta http-equiv="Content-Type" content="application ～
MIMEタイプと文字コードを記述しています。XHTMLでは、MIMEタイプを「application/xhtml+xml」とする必要があります。 この記述は、特にdocomoの端末向けに必須です。 なお、文字コードをSHIFT-JIS以外にした場合は、「charset=Shift_JIS」の部分を書き換えます。
※docomoの端末向けには、このほか、HTTPヘッダでも正しいMIMEタイプを出力する必要があります。（次のページで解説）
■7行目：<meta name="description" content="紹介文" />
PC向けサイトと同じように、検索エンジン向けに紹介文を書いておきましょう。 必須ではありませんが、何か書いておくことをお勧めいたします。
■8行目：<title>ページタイトル</title>
タイトルは常時表示されない端末が多いですが、閲覧者がブックマークする際や、検索結果に表示される際などに使われます。 短く分かりやすいタイトルを付けておきましょう。
次に、ウェブサーバからMIMEタイプを出力する方法です。
【携帯サイトの作り方 第1回 目次】
1. はじめに・サンプル
2. XHTMLでベースを作る (このページ)
3. HTTPヘッダでMIMEタイプを出力
4. 使える装飾方法と使えない装飾方法
5. 文字色・背景色・文字サイズなどの装飾基本
6. マーキー(流れる文字)を作る
7. サイズに気をつけて画像を掲載する
8. リンク・ページ内リンクを作る
9. ソースのまとめ
