Tablet タブレット

 
タブレットwebマーケティング

このままで大丈夫? Webサイトのタブレット対応

tabletl_marketing

突然ですが、みなさんは日常生活でタブレットを利用していますか? Webマーケティングにおいて「消費者に一番近いコミュニケーションの接点はスマートフォンである」ということは、もはや言及するまでもないことですが、もうひとつ忘れてはならないのがタブレットの存在です。

タブレットの利用・普及率についてはスマートフォンほどの伸びはないものの、内閣府の調査データによると世帯普及率は2015年3月時点で28.3%まできています。スマートフォンは約60%ですので、それと比較するとまだまだですが、決して少ない数字ではありません。では実際の利用率はどうなのでしょうか?

参考リンク:平成27年3月実施調査結果:消費動向調査|4-1.主要耐久消費財の普及・保有状況(一般世帯)|内閣府

意外と少ない? タブレット利用率

当社はWebサイトのモバイル対応サービス「Mobify」を提供しており、サービスのご提案などでさまざまな企業の方とお話させていただく機会があります。例えばBtoCのWebサイトだと、タブレットからのアクセスの割合はだいたい10%~15%前後といったところです。普及率に対して利用率はそれほど伸びていないようです。これにはいくつかの要因がありますが、その要因のひとつに「Webサイトの使いにくさ」があります。

タブレットからアクセスした場合、PC(デスクトップ)用サイトのコンテンツをそのまま見せているWebサイトがほとんどです。“タブレット”といってもスクリーンサイズはさまざまです。10インチサイズはまだしも、6~7インチサイズだとすべてのコンテンツが「キュッと」縮小されて見えるため、かなり見づらいですよね。

さらに、デスクトップ用のWebサイトは“マウス操作”を前提とした作りとなっているため、“指でタッチ”するタブレットでは使い勝手が大きく変わってしまいます。

「まだタブレットのアクセスの割合が少ないから……」と思われるかもしれませんが、その「使いにくさ」が原因で利用率が伸びないとも言えるのではないのでしょうか。そもそも使い方が違うタブレットには“指でタッチ”するユーザーインターフェース(UI)を考慮する必要があります。

タブレット用のデザイン、UIで考慮すべきこと

Webサイトをタブレット対応するために大切なことは、大きく3つあります。「タッチフレンドリーであること」「Wi-Fi以外のアクセス環境も意識したページの容量」「スクリーンに応じたコンテンツサイズ」これら3つを考慮したWebサイトにすることで、タブレットでも「使いやすい」サイトになると思います。

タッチフレンドリーであること

繰り返しになりますが、スマートフォンと同様にタブレットは“指でタッチ”が基本です。メニューボタンやテキストリンクがタッチしやすい大きさや配置になっていることが重要です。可能なかぎり、ブロック要素を覆うようにリンクを設定したり、タップさせたい箇所には、テキストリンクではなくボタン形状でタップしやすくする必要があります。さらにタッチデバイスでは、ホバー(コンテンツに「マウスオーバー」してアクションを起こす前の中間・補助動作)という状態がありませんので、現在のPC用サイトにそういった機能が使われている場合は意味をなさず、意図しない動作をしてしまい、ユーザーの不満に繋がってしまうこともあります。

taparea

Wi-Fi以外のアクセス環境も意識したページの容量

スマートフォンと同じように、タブレットももちろん、屋外での利用機会が多いデバイスです。屋外での利用シーンを考えると、Wi-Fiにくらべて通信量が少ない環境(4G、3Gなど)でのアクセスがほとんどです。容量の重いサイトでは、なかなか表示がされずにイライラしてあきらめてしまう、すなわち離脱をしてしまいます。そういった環境でも素早く表示させるには、ボタンやバナー、見出しなど画像で表示させていたものをデバイスフォント・CSSを使って軽量化してあげましょう。表示パフォーマンスを向上させて、ユーザーのストレスを軽減することで、離脱を防ぐことが重要です。

スクリーンに応じたコンテンツサイズ

iPad(10インチ)とiPad mini(7.9インチ)では、コンテンツの見え方にも大きな差があります。大きいスクリーンサイズ向けだけにコンテンツを作ってしまうと、iPad miniやファブレットなどで見た時に、文字が読みにくいタッチしにくいというストレスの原因を与えかねません。細かいようですが、フォントやサムネイルなど、小さいスクリーンでは大きく表示するような設定が必要です。さらに、誤動作を防ぐためにも、各要素の大きさや余白を十分にとるなどの配慮も必要になってきます。

タブレットリニューアルという考え方も

もし今後、サイトのリニューアルを検討しているのであれば、「デザインの中心をタブレットにおいてしまう」というのもひとつの選択肢です。当社でもwebサイトをタブレットデザインでリニューアルするお手伝いをさせていただきました。

参考リンク:講談社のファッション雑誌withの公式サイト「with online」リニューアル

アクセスの大半がスマートフォン・タブレットになるのであれば、そもそものWebサイトもPC中心ではなく、タブレットをメインに考えていこうというのがこのケースでした。そうすると、スマートフォンへのコンテンツ設計もしやすく、PC用へも展開しやすいというメリットがありました。「with online」のタブレットリニューアルでも、タブレットに必要な3つのポイントを考慮した設計になっています。さらに、少しずつですが、タブレットを意識したデザイン・インターフェースのサイトも増えてきています。

参考サイト:たまひよの妊活 100 TOKYO X BRAND

前述のようにタブレットを意識することはもちろん必要ですが、今後はむしろ「タッチデバイスを意識したWebサイト」という考え方の方が良いかもしれません。Webサイトの運用方法や考え方は企業によってそれぞれの選択があると思います。しかし、世の中はどんどん“タッチデバイスの文化”となっていきますので、それに合わせた考え方のシフトチェンジも必要ですね。

この記事を書いた人
山崎 明日花
タグ

記事mobifyロゴ
Mobify(モビファイ)とは

Googleが認定しているマルチスクリーン対応のための最適化サービス。
デバイスに応じ、専用にデザインされたサイトを表示することができます。
ページの表示を高速化させる仕組みも持ち合せており、ユーザーの離脱を防ぐことが可能です。

▸Mobify(モビファイ)についてさらに詳しく

 最新記事