携帯サイト制作のメモ。

shin2 — Wed, 29 Jul 2009 13:12:04 +0000

携帯サイトを制作したい時のメモ。個人的には比較的新しい機種に絞ったとしても、3キャリア共通で1つのファイルですませたい。
共通で作るには、CHTMLベースに各キャリアの共通部分のみのhtmlを使って簡単に書くこともできるが、最近じゃXHTML + CSSにするのが良いみたいだ。
CSSはauとSoftBankは外部cssに対応しているけど…Docomoが非対応なのでインラインで書くことになる。（Docomoも2009年5月モデルからは対応してるとか…）

1．XML宣言

2．DOCTYPE宣言

■Docomo 推奨

■au 推奨

■SoftBank 推奨

■W3C勧告 XHTML Basic
cssは外部スタイルシートのみに限定しているみたい。Docomoでアウトだ。

■XHTML 1.0 Transitional
PCで使うタイプ。これでいけるっぽい？

■XHTML Mobile Profile 1.0
とりあえずこれがベスト？

色々書き方があるけど、3キャリア共通で考えると「XHTML 1.0 Transitional」か「XHTML Mobile Profile 1.0」になるっぽい。
「XHTML Basic」に「XHTML Mobile Profile 1.0」を統合した「XHTML Basic1.1」というのもあるみたいだけど、現時点ではまだまだ。今後各キャリアの対応に期待らしい。

3．MIMEタイプ

ただ、これだとauやSoftBankの機種では比較的新しいモノしか対応していないみたいだ。「application/xhtml+xml」が必須なのは、DocomoのFOMAなので、その辺り気を使いたい場合には、phpでキャリアを判定してDocomoでは「application/xhtml+xml」それ以外のau・SoftBankでは「text/html」を返すようにする。

■.htaccessの設定
「ウェブサーバ側でHTTPヘッダの出力」をするために以下を記述。
これはDocomoのiモードでXHTMLを表示させるために必要。

AddType application/xhtml+xml .html

iモードはDOCTYPE宣言が正しく行われていること。MIMEタイプが「application/xhtml+xml」であること。そして「ウェブサーバ側でHTTPヘッダの出力」がされないとXHTMLとしてを表示しない。

phpを使って判定とかする場合は.htaccessは以下を記述。

AddType application/x-httpd-php .html //拡張子htmlでphpを動くように

htmlファイル内の1番先頭で以下をと記述。（動くかどうか未確認）


header("Content-type: application/xhtml+xml");
echo ''."\n";
?>

htmlでphpを記述できるようになるなら、DOCTYPEとかもキャリアごと分ければいいような気もしてきた…。
拡張子が.phpのままでよければ、.phpファイル内のheader()関数だけで、htaccessの設定はいらなそうだ。

phpを使うとかちょっと細かくなってきてしまったが、とりあえずこの辺を抑さえておけばOKかな。本格的に取りかかるときにshibaさんの「携帯サイトを作ろう！　-ちょっと詳しいモバイルサイトの作り方-」を参考にするか、「携帯サイトコーディング&デザイン」を買うかしよう…。

【参考にしたサイト】

ちょっと気になることは、phpを使うときはファイルの文字コードはShift_JISなのか？

MujuuLog » Mobile

携帯サイト制作のメモ。