ケータイで見やすいブログデザインについてちょっと考えてみた

以下「おれはおまえのパパじゃない – ブログデザインの好みについてちょっといわしてもらいます」を読んで思ったことを書いています。

上記エントリの主張を要約すると、「（ブログやニュースサイトの）XHTML構成上、本文→サイドバーの順で記述するべき」ということになると思いますが、大賛成であります（マウスのホイールボタンは個人的に使わないのでスルーしてます。ごめんなさいm(_ _)m）。

ケータイ画面にだらだらと続くメニュー(ITMediaをケータイで表示) わたしもよくケータイからPC用に作られたであろうウェブサイトを見ることがあるのですが、本文を読みたいのに画面に表示されるのは長々としたメニュー。こうした状況によく出くわすのは、ケータイ用の自動変換プログラム（mt4iとかwp-keitaiとか）を用意していないレンタルブログ（ココログとか。 Typepadのテンプレートに因りますけど）やITMediaなどのニュースサイトです。たとえばケータイではてブを利用して、個々のエントリに移動する時に移動先がPC用サイトだとこうなります。うざったいことこの上ありません。

ケータイ用の変換プログラムを用意すればいいじゃないか、とか、ケータイ用のサイトを作ればいいじゃないか、とか、ケータイのフルブラウザで見ればいいじゃないか、といった意見もあると思うんですが、ケータイもPCも一つのHTMLファイルで済むのがスマートだし、ローコストではないかと思います。フルブラウザもいいけれど、電波は有限だし、ケータイのCPUも貧弱でレンダリングも遅いし…と考えるとプレーンなテキストで必要十分な情報を得ることのほうがケータイにはあっているのかもと思います。

そう考えると、ブログをデザインする上でテンプレートのXHTML構成を「ヘッダ→エントリ本文→サイドバー（メニュー含む）」という順番にしておけば、PCから見てもグッド、ケータイから見てもいきなり本文が読めてグッドな構成になります。SEO的にもこのほうが望ましいと聞いたことがありますし。

欲を言えば、メニューリンクに使うような画像もHTMLにimgタグを記述するのではなくて、テキストをCSSで置換してくれるとうれしい。CSSを解釈しないケータイは画像を読み込まず軽いテキストで済むからです（画像置換には異論もあるでしょうが…）。本文の画像はimgタグで OK←本文を理解するのに必要なことが多いためです。

ケータイで見やすいブログデザインまとめ：
XHTML構成は本文→メニュー/サイドバーとする。
メニューに使う画像はCSSで画像置換する。

ケータイがCSSのmedia属性handheldに対応してくれれば、handheldに対してサイドバー部分をhiddenしちゃう、とかっていう方法も取れると思うんですけどね。ま、今作成者側でできることをしましょうってことで。