携帯サイトの不具合とUTF-8とCompact HTML

2008年9月22日(月) 01:38 | 日記

当サイト「フォーキー★カーニバル」は、パソコンと携帯で異なるトップページが表示されるように作っています。
いずれも同じアドレスでアクセスできるのですが、携帯の場合のみ、携帯用のトップページに転送する仕組みです。専門的なことを言うと、サーバー内の「.htaccess」というファイルに、特定のユーザーエージェントからのアクセスを別のアドレスに転送するように記述しています。
もちろん、「アメーバ」や「goo」など大半のブログサービスでは最初から携帯用ページが用意されていますので、普通にブログを書いている人は、こんなややこしい設定は必要ありません。というか、そもそも設定できません。
というわけで今日の日記は、僕と同じくレンタルサーバーにMovable Typeを自分でインストールしている人、あるいは個人的に携帯用サイトを制作している人のみに向けた、ちょっと専門的な内容となります。あしからずご了承くださいませ。

さて、当サイトの「不具合」についてですが。
僕が使っている携帯は、ソフトバンクの822SHという機種です。
先日、携帯のソフトウェアのアップデートをしました。すると、これまで普通に表示されていたページが全く表示されなかったり、文字化けを起こすようになりました。
そのページとは、携帯サイトのトップの最下段にある「過去の日記/カレンダー」「過去の日記/タイトル一覧」および「著者プロフィール」です。
同じページをパソコンでアクセスすると正しく表示されるのに、僕の携帯だと「過去の日記」の2ページは画面が真っ白になり、「著者プロフィール」は文字化けして表示されました。
一方でそれ以外のページ、たとえばトップページや個別記事のページは、正常に表示されました。

一部のページだけ表示されないのは、いったい何が原因なのか。考えられる原因を、ひとつずつつぶしていきます。

考えられる原因その1、文字コード。
携帯サイトの表示には、MT4iというプログラムを利用させていただいています。このプログラムによって表示される動的ページの文字コードはShift-JISです。
ところが、「過去の日記」ページはMT4iとは無関係の、Movable Typeによって生成された静的ページであり、文字コードはUTF-8です。
試しに、このページの文字コードをShift-JISに変えてみたところ、正常に表示されました。しかし、これでは何も解決したことになりません。これのためだけにMovable Typeのページ生成をUTF-8からShift-JISに変えるのは非現実的です。
また、「著者プロフィール」はMT4iともMovable Typeとも無関係な、手作業で作ったページです。UTF-8で文字化けしていたページを、Shift-JISに変換して表示させたら、普通に表示されました。このページはShift-JISで作っても何の差し支えもないので、解決です。

ところで僕の携帯は、本来ならUTF-8のページも問題なく表示されます。試しにUTF-8で書かれたパソコン用の記事ページを表示してみたところ、問題ありませんでした。
だから「過去の日記」ページも、文字コードをShift-JISにしなくても、正しく表示される方法があるはずなんですよね。

考えられる原因その2、メタタグ。
携帯用に作ったのに携帯で表示されない「過去の日記」ページと、パソコン用に作ったのに携帯でも表示できる記事ページのソースを見比べて、原因を探ります。
両者が異なる部分として、まず気になったのがDOCTYPE宣言。
パソコン用のページはXHTML1.0で書いているので、冒頭に次のような記述をしています。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

そして、携帯用のページはモバイルサイト向けのHTMLということで、Compact HTMLを採用していることを宣言。

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

MT4iの動的ページはこのDOCTYPEでも問題がないのですが、UTF-8で書かれた静的ページとは相性が悪いのかもしれないと考え、「HTML 4.01 Transitional」のDOCTYPEに変えてみました。
でも、だめでした。

次に目をつけたのが、以下の記述。

<meta name="CHTML" HTTP-EQUIV="content-type" CONTENT="text/html; charset=UTF-8">

MT4iのページにも「name="CHTML"」の記述はあったし、まさかこの行が携帯での表示に影響を与えることはないだろうと思いつつ、試しに「name="CHTML"」を削除してみたら…。
なんと、普通に表示されました。
せっかく親切に「このサイトはCompact HTMLで書かれていますよ」とメタタグで伝えているのに、親切があだになっていたなんて。
それにしても、こんなメタタグひとつでサイトが表示されなくなったことにはびっくりしました。

まあとにかく、原因が分かってよかったです。
結論としては、UTF-8で書かれたページのメタタグに「name="CHTML"」と記述すると、一部の携帯端末では正しく表示されない場合がありますよ、ということでいいんでしょうかね。文字コードがShift-JISであれば、CHTML宣言をしても問題なかったので。

コメントを投稿

※サーバーの状況によって、投稿完了まで時間がかかることがあります。
※投稿内容がすぐに反映されないことがありますが、ページを再読み込みするとコメントが表示されます。
※入力したURLは公開されますが、メールアドレスは公開されません(管理者に対してのみ通知されます)。