各キャリア別と3キャリア共通で使えるDOCTYPE宣言をまとめてみた

2009.11.18 2014.05.24

Hacks

最近ちょいちょい、モバイルサイトのコーディングネタを書いてますが、何よりも最初に書いておかなければならんだろ! というDOCTYPE宣言に関してまとめ忘れていたので、いまさらまとめてみたいと思います。

ただ、基本的にモバイルサイトに適したDOCTYPE宣言ってのは、きちんと明示されていないのが現状なんですよね。いつになったら･･･ってのはあるんですが、取り敢えず、まずは各キャリアが策定しているDOCTYPE宣言からまとめます。

因みに、以下のDOCTYPE宣言は全てXHTMLに対応した3G機種のみを対象としているので、そこんとこは注意してください。

3キャリアそれぞれのDOCTYPE宣言

docomo

※バージョンによって若干異なります。下記はiモードXHTML2.3の場合。

<?xml version="1.0" encording="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.3) 1.0//EN" "i-xhtml_4ja_10.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" />

特にdocomoで注意をしておきたいのが、コンテンツMIMEタイプの指定です。

<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />

この記述を必ず入れることを忘れないようにしないといけません。

また、サーバ送出のHTTPヘッダーも「application/xhtml+xml」が出力される必要があります。これは.htaccessさえ用意すれば大丈夫です。書き方は後述。

au

<?xml version="1.0" encording="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//OPENWAVE//DTD XHTML 1.0//EN" "http://www.openwave.com/DTD/xhtml-basic.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />

Softbank

<?xml version="1.0" encording="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//JPHONE//DTD XHTML Basic 1.0 Plus//EN" "xhtml-basic10-plus.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />

とまぁ、こんな感じになっています。

iモードXHTMLはバージョンが上がると、それに合わせて若干の修正がありますが、基本的には上に挙げた2.3のまんまでも構わないかなと思います。

3キャリア共通にするときのDOCTYPE宣言

本来ならば、プログラム側で各キャリアに合わせてDOCTYPE宣言を入れ替えるようにするなどしたほうが無難なわけですが、そうも行かない場合も往々にしてあります。

実際、ケータイ対応のブログサービスではhtml編集が出来ても、DOCTYPE宣言をキャリアに合わせて吐き出すことは出来ません。
以前リリースしたMT4i3.0.8 X1も今のところそういう仕様にしてないんですよね。

じゃあ3キャリア共通でDOCTYPE宣言するならどうするの? となるわけですが、汎用的に作るなら”XHTML 1.0 Transitional“か”XHTML Mobile Profile 1.0“のどちらか。

これについては多くのモバイルサイト経験者が、このどちらかを選択しているっていうのもありますが、もうひとつのDOCTYPE宣言であるXHTML Basicはstyle属性が使えなくなってしまうので除外せざるをえない感じ。

docomoの場合インラインCSSで記述する必要があるので、必然的に選択のしようがないんですよね。。個人的には”XHTML 1.0 Transitional”を多用しています。

XHTML 1.0 Transitional

<?xml version="1.0" encording="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3c.org/TR/xhtml1/DTD/xhtml1-transitional.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" />

XHTML Mobile Profile 1.0

<?xml version="1.0" encording="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//WAPFOLUM//DTD XHTML Mobile 1.0//EN" "http://www.wapfolum.org/DTD/xhtml-mobile10.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />

一応こんな感じです。

ただ、最前提として3キャリア共通のモバイルサイトにおける最適なコーディングが出来る必要があるのは言うまでもありません。

docomoにおけるサーバ送出のための.htaccess

ちょっと上述してますが、docomoでXHTMLを動作させる条件として、サーバが送出するHTTPヘッダーが「application/xhtml+xml」を出力しないといけないわけです。
方法としてはサーバのコントロールパネルなどでMIMEタイプを設定ってのもあるんですが、まぁなんのこっちゃかわからんなんていう場合は.htaccessをモバイルサイトを公開するディレクトリ直下に設置する方が早いんじゃないでしょうかね。

で、その記述が以下の通り。

AddType application/xhtml+xml .htm .html

そんなわけで、以上のようになります。

正解がないと言えばないのがDOCTYPE宣言なので、あくまでもこれは一例だと考えておいてください。多分ほとんどはこのやり方のはずですけどね。