iPhoneからのアクセスが12.22%もあったのでMeityのメッセージ画面をiPhoneブラウザに最適化しました

2010/6/1 12:13

Meityのアクセス解析を見てみるとiPhoneとiPod touchからのアクセスが全体の12.22%も占めていたので、ひとまずメッセージ画面からiPhone対応することにしました。

↑ こんな感じ。

↑ コメントはできます。

「Twitterへの投稿フォーム」の部分は現在未対応です。JavaScriptでonkeyupイベントを使ってたのですが、onkeyupはどうもiPhoneがサポートしてないということで実装するなら別の方法をとらないといけないようで・・・。

今回のiPhone対応は単純にユーザーエージェントを見てCSSをiPhone用に切り替えるという方法を採用しました。

テンプレート(HTML)そのものをiPhone用に作ってもいいのですが、テンプレートが増えると明らかにメンテコストが上がってしまうし、実際iPhone用のCSSを用意して試してみたら意外と大丈夫だったので。

参考にしたのは「iPhone向けサイト構築基礎文法最速マスター – EC studio デザインブログ」あたり。viewportとリキッドレイアウトをおさえておけばよさげです。

というわけで徐々に他の画面も必要なところはiPhone対応していきます。

# ちなみに、MeityのIE6からのアクセスは全体の約2.45%でした。総数にするとあまり無視できない数字ですが、割合で見るとiPhoneからのアクセスはIE6の約5倍あるということで、さすがTwitter連携サービスだとIE6よりiPhoneを意識しないといけないな、と思った次第です。

# ちなみに梅酒.inのようなサイトだと、IE6からのアクセスはまだ20%くらいあります。

Webエンジニアやってます。最近はドットインストールの開発がお仕事です。その傍ら、個人で Meity や電車遅延なう、梅酒.in、 #グラドル自画撮り部の部室といったネットサービスを開発・運営してます。梅酒と草野球とリアル脱出ゲームが好きです。