【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

ECサイト構築クラウド型プラットフォーム

【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

モバイルファーストマーケティングラボ

タブレットサイトのボタンサイズは32px以上がタップしやすい

タブレットサイトのボタンサイズは32px以上がタップしやすい

タブレットサイト構築のポイント

IMJから、「タブレット端末でのサイトユーザビリティ調査」が発表されていました。今までタブレットユーザーを対象にした調査はあまり目にすることはなかったのですが、興味深い結果が出ていたのでご紹介します。

個人的に気になったポイントは以下です。レスポンシブサイトを構築する際のご参考にしていただければと思います。

  1. 7インチユーザーの70%以上は縦持ちでWebサイトを閲覧する
  2. タブレットユーザーが読みやすいと感じるフォントサイズは16px
  3. 7インチタブレットユーザーはタップミスと拡大してタップする割合が多い
  4. タブレットユーザーに最適なボタンサイズは縦横32px以上

それぞれ詳細を見ていきましょう。

7インチユーザーの70%以上は縦持ちでWebサイトを閲覧する

タブレットユーザー全体のWebサイト閲覧時の端末の向きは、64.7%が縦向きで閲覧しているのに比べ、7インチタブレットのユーザーでは75%が縦向きで閲覧しています。

インチ数が小さいほど縦向きで閲覧する比率は高くなる反面、インチ数が大きくなれば縦横関わらずどちらの向きでも閲覧しています。

昨年末に発表されたiPad miniからタブレット市場では7インチが主流になってきているのを考えると、タブレットサイズでのコンテンツ配置は縦で閲覧されることを前提に考えてもいいかもしれません。

インチ別閲覧時のタブレットの向き

 

タブレットユーザーが読みやすいと感じるフォントサイズは16px

フォントサイズ別に「最も使いたいと思ったサイト」というアンケートを取った結果では、7インチユーザー、7.7〜7.9インチユーザー共に年代に関係なく、16pxサイズの文字が最も支持されていました。

PCサイトの一般的なフォントサイズは12px~14px程度と言われているので、タブレットでは文字は少し大きめにした方が読みやすいのではないでしょうか。

年代別最も使いたいと思ったサイト

実際にテキストサイズ別の大きさを確認できるサンプルページを作りました。タブレットで読み取ってみて、ご確認ください。
http://labo.aispr.jp/
テキストサイズサンプル

 

7インチタブレットユーザーはタップミスと拡大してタップする割合が多い

インチ数が小さければ小さいほど、タップをする際に「拡大する」もしくは「タップミス」をする割合が多い結果が出ていました。

当たり前と言えば当たり前かもしれませんが、主流の7インチタブレットでの対応を考えた場合、できるだけ大きな文字(上記の例でいけば16px以上)でのサイト構築をすることがユーザーにストレスを与えないポイントと言えます。

リンクをタップできたか否か

 

タブレットユーザーに最適なボタンサイズは縦横32px以上

ボタンサイズ別の押しやすさの検証です。

縦横28px以下のボタンサイズでは、10%以上のユーザーが「どちらかといえば押しにくい」「押しにくい」と回答しています。

ミスタップの発生比率でも、24px以下のボタンでは10%を超えており、ユーザーにストレスを与えないボタンサイズは28pxもしくは32px程度の余裕を持ったサイズにするのが最適だと思われます。

アンケートでは44px以上のサイズが最も押しやすいという結果になっていますね。特にサイト側が押してもらいやすいボタンではこのことを考慮しておいた方がいいかもしれません。

こちらも実際にサンプルを用意したので、タブレット端末で確認してみてください。
http://labo.aispr.jp/Button
ボタンサイズサンプル

サイズ別のボタンの押しやすさの印象

参考:IMJ調査レポート、「タブレット端末でのサイトユーザビリティ調査」を発表

 

僕はこう思った僕はこう思った
昨年末に急激に普及しているタブレット。2013年度にはノートPCの出荷台数を上回ると予想されています。レスポンシブWebデザインでも考慮しなければならないタブレット端末への対応ですが、上記の調査結果をもとに、よりタブレットユーザーにも使いやすいサイトを心がけなければいけません。

”スマホで売れる”ためには必須の「レスポンシブECサイト」とは?

CTA-IMAGE 2019年、ECサイトの利用者は今やスマ―トフォンからが7割を超え、市場のニーズは完全にPCからスマホに転換しました。
また、検索エンジン大手のGoogleも「モバイルファーストインデックス」を打ち出し、スマホ対応の手段として正式に「レスポンシブWEBデザイン」を推奨しています。 そのような背景から、昨今のEC市場ではスマートフォンへの適切な対応が急務となっており「レスポンシブECサイト」のニーズが非常に高まってきています。本パンフレットではECサイト運営を取り巻く環境の変化を、レスポンシブECサイト構築導入実績No.1のプラットフォームである「aishipR」の機能や実績を踏まえながらまとめました。

・レスポンシブECサイトがなぜ今選ばれるのか
・これまでのECサイトの課題とは何なのか
・どのようにすれば解決できるのか

といったノウハウから、プラットフォーム変更で得られる効果の実例まで網羅して解説しています。
ECサイトの運営されておられる経営者様だけでなく、運営担当者様にも必ずお役に立つ内容となっておりますので、是非ご活用ください。
機能のご確認はお気軽にお問合せ、もしくは2週間無料お試し利用で。
aishipRの無料体験、お問合わせはお気軽に。説明会・資料請求も受付中。
0120-173-163
0120-173-163
無料体験
  • 無料体験
  • 問合せ
  • 説明会
  • 資料請求
  • 問合せ
  • 説明会
  • 資料請求
+