スマホサイトへ遷移するかどうか、ダイアログで確認するJS

本来はどこかのブログからの引用ネタなのですが、残念ながら引用元を失念いたしました。すみません。
便利なので自分用に覚書。jQuery必須です。

/**************************/
//redirect.js
/**************************/

$(function(){
    var agent = navigator.userAgent;
    if(agent.search(/iPhone/) != -1 || agent.search(/iPod/) != -1 || agent.search(/Android/) != -1){
        redirect();
    }
});
function redirect(){
    if(window.confirm('スマートフォン向けサイトに移動しますか?')){
        location.href = "【スマホサイトのURL】";//ここにURLを入れてください
    }
}

/**************************/

これをPCサイト側で下記のような感じで読み込ませるだけです。
(<>は全角になってます)

<script language="javascript" src="js/jquery.js" type="text/javascript"></script>
<script language="javascript" src="js/redirect.js" type="text/javascript"></script>

理想はワンソース・マルチデバイスですが、依頼の形態によってはそうもいかない事も多々ありますので、まだまだこうした対策は必要ですよね。
この方法であれば、.htaccessをいじる必要もないので手軽に実装できます。


以下は蛇足です。

スマホサイト対応が流行り出していくらか経ちますが、世の中にはスマホサイトが嫌いな人、というのもいます。というか、僕がそうです。
サイトによっては、「検索で引っかかった情報を見たいのに、スマホサイトに飛ばされて見れなくなる」という現象が発生するので、スマホで検索している時はこれがかなりストレスになります。
やはり、ダイアログなどで確認してからの方が、ユーザビリティとしては優れていると思います。

また、全てのページでダイアログが毎回出るのもうざったいので、個人的にはトップページのみの実装が望ましいと思っています。

cookieなどで一定期間遷移の有無を記憶するタイプも、面倒だなあと思います。
スマホサイトとPCサイトは行き来することが多いので、そういう実装をされると見る側からしたら「さっきは見れたのに今は見れない」という状況が発生することになりますから、この辺はできるだけシンプルな実装にして欲しいものです。

以上、蛇足でした。

コメント

人気の投稿