ラベル Web の投稿を表示しています。 すべての投稿を表示
ラベル Web の投稿を表示しています。 すべての投稿を表示

2013年1月13日日曜日

PCとスマートフォン用サイトを切替える方法

一番簡単な方法はmod_rewriteモジュールでUserAgent情報をみて.htaccessでアクセス制御をする方法、UserAgentでAndorid, iPhone, iPod, Windows Phone などの判別が可能。


<IfModule mod_rewrite.c>
 RewriteEngine On
 RewriteCond %{HTTP_USER_AGENT} (Android|iPhone|iPod|Windows.Phone) [NC]
 RewriteCond %{QUERY_STRING} !mode=pc
 RewriteRule ^$ /sumaho/ [R,L]
</IfModule>


上記のように .htaccess ファイルを目的のフォルダ(PC用サイト)に設置しておく。


.htaccess についてここでは詳しく触れないが、ここで使用する書き方だけ少しだけ説明しよう。


'RewriteEngine On' はURLのリライトを有効にする、{HTTP_USER_AGENT}でUserAgent情報を取り出して後述に続く文字列で判定する。
'|' パイプラインは or を、'.' ドットは任意の一文字を意味する。

'[NC]' は大文字と小文字の判別をしないオプション。'[R,L]' のRはリダイレクト、Lは書き換えを意味する。

上記では、UserAgentに指定した特定の文字列が一致した場合に、/sumaho/へリダイレクトする。
UserAgentを追加することで、ガラケーも振り分けすることが可能。


なお、タブレット端末についても、記述の仕方で振り分けが可能だ。たとえば、AndroidタブレットをPCサイトへ振り分けたいのであれば、"Android" を "Android.*Mobile" に変更する。

'*' は0文字以上の任意の文字列を意味しており、'.*' と記述することで、1文字以上の任意の文字列になる。"Android"~"Mobile"の間は何文字入っても該当することになる。



最終的には、PCサイトとスマホサイトを切り替える方法は、ユーザに選択させる方法がいいのかもしれない。

初めに自動振り分けによってスマホ用ウェブページを表示させた場合、PC用ウェブページのリンクを貼っておけばいいだろう。大手のサイトは、この手法をとっていることが多い。


.htaccessについては、過去のブログでも説明しているので、参考にしてほしい。


2013年1月12日土曜日

PCサイトだけの運用はもう通用しない、これからはスマホ用サイトがメインに!


スマートフォンの出荷台数はすでにPCを超えている

世界的にスマートフォン市場は急ペースで成長し、すでに2010年第4四半期に出荷台数が
PCよりも多くなっている。(米IDC調査報告)


当然、ネットの利用者もそれに比例して増加傾向にあり、当ブログのアクセス解析でも昨年は18%であったスマホでのアクセスが、今年はすでに3割を超えている。

この勢いだと来年にはスマホのアクセスの方が多くなりそう。しかし、ネットサーフィンをしているとスマホ用サイトに対応しているサイトはまだまだ少ない。


意外と大手企業なども対応が進んでおらず、とくに学校関係は対応が遅いところが多いようだ。

学校関係はスマホでのアクセスがわりと多く、生徒が志望校を調べる際に、スマホをもっていなくても、親のスマホで見ることが多いのではないだろうか。実際に某喫茶店にてそんな親子を見かけたことがある。

まぁ、入試関連は別サイトで業者に委託しているとろこも多いようだが、学校を選ぶ生徒はきっと、本家のページも閲覧するだろう。

すでに時代はHTML5が必須、Flashはもう古い

大きなFlashを使ったサイトはもう時代遅れだ。PCはともかくスマホはこれからFlashではなくHTML5へ進む(現行モデルはすでにHTML5)。

Flash非対応のスマホ(iPhone,Android4.1以降)でアクセスしてみればお解かりになると思うが、とても見れたものでない。

高いお金をかけて製作したサイトもこれでは無駄遣いにすぎないのでは!?