携帯サイトを作ろう! -ちょっと詳しいモバイルサイトの作り方-
XHTML+CSSで一歩進んだモバイルサイトを作るテクニックを幅広く紹介☆
このエントリーを含むはてなブックマーク このエントリーをブックマークに追加
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。


このエントリーを含むはてなブックマーク このエントリーをブックマークに追加
前回の記事でHTMLの冒頭で宣言するDOCTYPEの違いについて触れたのと、
携帯の機種によってDOCTYPEを自動出力するようなプログラム(関数)
を作ろうかなって思ったので、ここで今一度覚え書き程度にまとめてみます。

3回にわたって各キャリア別に書いていきます。
まずはドコモから。

○iモードHTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD Compact HTML 1.0 Draft//EN">

通称:Compact HTML(CHTML)。W3Cで正式な勧告がなされている。
以前、携帯メーカー各社がこの「Compact HTML」をW3Cに逆提案したいきさつがある。

現在バージョンは7.0まであり、バージョンアップを重ねるごとに
ドコモの新機能に対応した形でリリースされる。基本的にはHTMLと同様。
このDOCTYPEは省略可能か公式サイトには明言されていませんが、
省略しても動作はするようです。

○iモードXHTML(バージョン共通)

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.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" />...

基本はこの共通系で動作しますが、通常はiモードXHTMLのバージョンによってDOCTYPEが用意されているので、そちらに合わせた方が良いでしょう。

バージョンによるDOCTYPEは以下。

iモードXHTML1.0

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/1.0) 1.0//EN" "i-xhtml_4ja_10.dtd">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />...


iモードXHTML1.1

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/1.1) 1.0//EN" "i-xhtml_4ja_10.dtd">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />...


iモードXHTML2.0

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.0) 1.0//EN" "i-xhtml_4ja_10.dtd">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />...


iモードXHTML2.1

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.1) 1.0//EN" "i-xhtml_4ja_10.dtd">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />...


たぶん分かると思いますが、iモードXHTMLの場合は、
DOCTYPEの以下の部分がバージョンに合わせて変わるだけです。

<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.1) 1.0//EN" "i-xhtml_4ja_10.dtd">


文字コードはiモードXHTMLの場合に限り、UTF-8も可能です。
この場合は、「Shift_JIS」を「UTF-8」に変えて、HTMLをUTF-8で保存し直せばOKでしょう。

ただし、3キャリア対応サイトを作るなら、Shift_JISにするほうが良いです。
これは前の記事でふれました。

なお、iモードXHTMLのDOCTYPEは省略不可。これは前回の記事で詳しく解説しました。
DOCTYPEを省略したり、記述を間違うと、ブラウザがXHTMLモードにならないので、
いじらない方が無難です。





管理者にだけ表示を許可する


CHTML
細かいことですが、CHTMLはW3Cの勧告ではありません。
仕様のための草案でもなく、討論のためのノート(Note)です。文書のステータスに書かれています。

2008-05-10 ez-web | URL | 2008/05/10/Sat 16:29 [EDIT]
docomoに対するDOCTYPEについての記事ということで一言
cHTMLに関して問題はありませんが、xhtmlでサイトを作成する場合↓

iモードXHTMLのドコモによるDOCTYPE(例えば1.0の場合)

<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/1.0) 1.0//EN" "i-xhtml_4ja_10.dtd">

↑と記述するようにありますが、i-modeにおいてこのDOCTYPEの所在は不明です。(他バージョンも同じ)

いわゆるドコモの傲慢さの表れで、i-modeのDOCTYPEは、ドコモ携帯ブラウザにおいて、XHTMLファイルであるということを解釈させるためのものであると考えたほうが無難です。はっきりいってこんなものDOCTYPEとはよべません。参照するURIにDTDデータが置かれていないのですから…。

私たち製作者の立場としては、携帯サイト構築に記述するDOCTYPE宣言は、XHTML Basic、もしくは、WAP2.0に準拠するDOCTYPEを選ぶべきです。

現在i-modeXHTMLのDOCTYPEでサイトを製作していると、後々サイト自体を全修正しなければいけない日がくるでしょう…。

なぜなら、単にXHTMLとドコモ携帯が理解してくれているだけで、XHTMLコード記述が、XHTML BasicやWAP2.0に準拠している保証はまったくないからです。(携帯から閲覧できるなら、XHTML1.0transithonalをクリアできている程度と考えてください。)

本来XHTMLはストリクトで書くべきなのです。トランジショナルはあくまで以前のタグを補完するためにあるものであって。

名無しさんの投稿
>>モバイル・プロファイル 1.0やXHTML 1.0 ストリクトは使えないのでしょうか?

に関して返事します。

使えないのでしょうか?ではなく、それが正しいのです。しかし、モバイル・プロファイル(WAP2.0、WML)などの場合、内部style属性が使えるため、HTML1.0ストリクトより優先する場合がありますが、これも間違いです。

モバイルプロファイルを選ぶ利点は、内部style属性しか使えないがドコモを含めた、3キャリア一括ファイルとできることだけで、XHTML1.0ストリクトを選んだ場合の利点と比べると、劣ります。

以下、XHTML1.0ストリクトの利点
①XHTML1.0ストリクトをクリアしたことによるブラウザによる閲覧保証。
②携帯サイト、PCサイトの検索エンジンインデックス両立。
(サイトマップ、pingなどの作成時、ファイル名とマークアッププロトコルの変更のみで作成できる。振り分けはPHP、.htacceceなどでするとよいでしょう)
③各拡張DTDのベースプロファイルなので独自拡張(独自解釈)に振り回されない。
④内部style属性にももちろん対応。
他、何点かあげられますが、話しが難しくなるので。

結論で何が言いたかったかといいますと、たとえドコモが大部分を占める日本においても、現在からW3Cの動向に注目し、サイト製作者はそれに準拠するべきということです。

なぜなら大企業ドコモといえど、WEBのルールを決めるW3Cに対してどうにもできないのですから…。

おまけ↓

>>携帯サイトを作る上で、階層は何階層までが良いというのは
あるのでしょうか??

まったく関係ありません。階層がどれだけ深くともリンクがあれば問題ありません。要はあなたのサイト自体のコンテンツの中身です。そんなことを意識してサイトを製作すれば、ユーザーにとってわかりにくいサイトができあがってしまうのがオチです。あなた自身も管理しにくくなるでしょう。

検索エンジン対策のつもりかもしれませんが、検索エンジンのスパイダーはそんなことをまったく気にもとめていません。いわゆる迷信です。

考えてみてください。なぜWEB上にはHTML、PHPなどのさまざまなコードがあるのでしょう?それはコンピュータが解釈できるようにするためです。上部階層であろうとリンクがないと見つけもできませんし、どれだけ埋もれた階層でもリンクがあれば発見します。

あなたのその心配は、人の目からみた場合です。

通行人 | URL | 2008/02/23/Sat 20:38 [EDIT]
モバイル・プロファイル 1.0やXHTML 1.0 ストリクト
確かに、ご指摘の通り、モバイル・プロファイルなどについて言及しておりませんでした。申し訳ありません。今後の記事で触れられればと思います。
シバ犬@管理人 | URL | 2007/10/21/Sun 20:42 [EDIT]
Re : 携帯サイトの階層について
書き込みありがとうございます。

>ワールドバカボンさん
階層は自由に設定されてよいと思います。ただし、モバイルに限らず検索エンジン対策という意味では、階層はなるべく浅くした方が、インデックス化される傾向にあるので、そのようにされたほうが良いでしょう。
また、更新性を考えても、あまり階層が深いと、ファイルの管理も大変になるので、3階層程度まで押さえておいた方が分かりやすくしていいと思います。
さらに、携帯サイトのURLは覚えやすさ、打ちやすさの点から短い方が好まれる傾向にあるので、そういう意味ではブックマークの観点からも階層は浅いほうが良いと思われます。
シバ犬@管理人 | URL | 2007/10/21/Sun 20:40 [EDIT]
携帯サイトの階層について
初めまして。携帯サイト製作初心者です。
携帯サイトを作る上で、階層は何階層までが良いというのは
あるのでしょうか??

もしよろしければ、教えてください。よろしくお願いします。
ワールドバカボン | URL | 2007/10/09/Tue 15:23 [EDIT]
モバイル・プロファイル 1.0やXHTML 1.0 ストリクトは使えないのでしょうか?
| URL | 2007/10/02/Tue 17:52 [EDIT]




Copyright © 携帯サイトを作ろう! -ちょっと詳しいモバイルサイトの作り方-. all rights reserved.

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。