昨年の暮れから取り組んでいた、SSK Worldのスマートフォン用ページ。ページのスタイルそのものは11月の段階でほぼ完成していて、あとはどのようにしてスマートフォン用ページに適切なユーザーを誘導するのか?という問題が残っていました。
もう少し具体的に言うなら、普通のPCからのアクセスか、スマートフォンからのアクセスかを判定したい…ということになるんですが、このためにはHTTP_USER_AGENTという環境変数を参照します。ブラウザーがWebページをWWWから取得するときにヘッダー情報として送られてくる、どんな環境で閲覧しているのかを示す文字列で、ブラウザーの種類やOSなどの情報を知ることができます。
もちろん、PHPからもHTTP_USER_AGENTの情報は取得可能で、あとは特定の文字列とのマッチング…例えば「Android」「iPhone」などが含まれているかどうか…で、スマートフォンからのアクセスは判別できる可能性が高くなります。もっとも、HTTP_USER_AGENTはあくまでもクライアント側が自らを「どう名乗っているか」に過ぎないもので、いくらでも詐称は可能なんですが。
文字列関数も強力なPHPですから、その気になればかなり凝った判別プログラムも書けるはずなんですが、日々激動のこの業界で、常に最先端を追いかけるのも大変です。ここは、既存のプログラムを活用させてもらうことにしました。
Mobile DetectというPHPクラスライブラリが公開されています。これを組み込むと、数行の実にシンプルな手順で、相手の環境がスマートフォンか、あるいはタブレットかを判別することができます。jQuery Mobileがスマホ用Webページのデザインを劇的に簡単にしたのと同じように、私たちWebデザイナー(と呼ぶのはあまりに大げさすぎますが)の労力を軽減してくれます。しかも、やろうと思えばさらにマニアックな機種判別もできるようにしてあるようです。
試験的に、個々のブログ記事のページのみに、Mobile Detectによる自動振り分けを仕掛けてみました。TwitterやFacebook、mixiなどでSSK Worldへのリンクをクリックすると、普通のPCからのアクセスなら従来のPC用ページが、スマートフォンからならスマートフォン用ページが自動的に表示されるはずです。
とりあえず、これで私のTwitterアカウントやBOBなどからSSK Worldに流れてくるスマホユーザーの環境はずいぶん改善するはずですが、この単純かつ強引な自動振り分けは、どうもベストの方法ではないような気がします。もう少しいろいろな状況を想定しながら、プログラムをきめ細かくしてみたいところです。
また、トップページなどでは、自動振り分けとはもう少し違う方法で、環境の自動判別を活用するべきのような気がします。これについても、引き続き情報を収集して、ベストな方法を考えてみたいと思っています。
「BOB」でこの記事をチェック!
コメントを残す