WIKIPLUS - スマートフォン用のデザインを用意する

スマートフォン用サイトの考え方

昨今、スマートフォンの普及はPCを状況になっています。サイトにもよりますが、多くのサイトでPCでの閲覧数よりもスマートフォンでの閲覧数が上回り始めています。

従来のケータイと異なり、スマートフォンのブラウザは画面が大きく、さらに見やすくなっています。そのために、最初にスマートフォンでみたユーザがもう一度PCの大画面で閲覧し直す、ということは、ほぼないと考えて良いでしょう。

つまりPCに存在してスマートフォンに存在しないコンテンツは、スマートフォンユーザにとって「無いコンテンツ」であり、半数を超えるユーザがスマートフォンでアクセスするサイトなら、「半数の人にとっては存在しないコンテンツ」であることを意識する必要があります。

これからのウェブサイトは「モバイル・ファースト」で作るべきであり、スマートフォンサイトを決してPC用サイトのサブセット（縮小版）にはしてはなりません。

WIKIPLUSでは、運用担当者がエディタにて書いたページ文書は、WIKI形式というHTMLではない中間形式で保存されます。アクセスしてきたユーザーがスマートフォンかどうかをPCを自動的に判断し、ページ文書をそれぞれのブラウザに最適化して出力します。

また、デザインファイルも自動的に選択され、〇.design.default.tplではなく、〇.design.sp.tplを利用するようになります。

スマートフォン向けのデザインは、PC用のデザインの作成と同じように作成します。ただしファイル名は、〇.design.sp.tplという名前になります。

例】
A.design.defaul.tplのデザインファイルが適応されているページをスマートフォンで見た場合、スマートフォンサイトのデザインファイルは A.design.sp.tpl が適応されます。

PCサイトに対応したスマートフォンデザインファイルがない場合、以下の順でデザインファイルが適応されます。

A.design.default.tplが該当スマートフォンページのデザインとして適応されます。

base.default.tplが該当スマートフォンページのデザインとして適応されます。

システムが出力するデフォルトのデザインファイルが該当スマートフォンページのデザインとして適応されます。

スマートフォン向けのリンクは、URLの末尾に?vt=spがつきます。システムがスマートフォンであるかどうかをチェックして?vt=spは自動的に付くようになりますが、なるべくならば?vt=spを付けることを推奨しています。

例】
http://www.example.jp/index.htmlというURLをスマートフォン向けのデザインで見るには、http://www.example.jp/index.html?vt=spというURLを利用します。

※同一URLでスマートフォンとPCの出力切り替えを行わないのは、プロキシーサーバ等でキャッシュが不正に起きたり、あるいはキャッシュしないことにより応答レスポンスが悪化するのを防ぐためです。