今回は業務用食材通販の「タスカルネットショップ」で買い物をしてみました。PCサイト、タブレットサイト、スマホサイトと、それぞれのデバイスに合わせたサイトを構築しています。
サイト名 | タスカルネットショップ |
URL | http://www.tasucallshop.com/ |
QRコード | ![]() |
近頃スマホサイトは増えてきましたが、タブレットに最適化したECサイトを構築している事例というのは、まだまだごくわずかです。
ですので、主にタブレットサイトにフォーカスをあて、PCサイトとどのように違うのかを比較してみました。
iPadで確認しました。上図ではわかりにくいかもしれませんが実際にタブレット端末で確認すると、PCサイト表示でのタッチのしにくさ、文字の小ささが(細かいところですが)結構ストレスを感じます。これがiPad miniなどのもっと小さなタブレットであれば、拡大しないと見ませんし、タッチすることができないと思います。
一方タブレットサイトでは、文字の大きさや、バナー・ボタンの幅などがタップしやすい大きさに調整されており、PCサイトをタブレット端末で表示するのに比べて使い勝手は大きく向上しています。
本当に細かいところになりますが、ページャーや並び替えボタン(下図)まで、タッチがしやすくなっています。サイトの設計をされた方はきっとモバイルファーストの考えを理解されているに違いありません。
PCサイトと違い、「買い物カゴに入れる」ボタンが青色で目立たせていたり、商品価格も目立つようにデザインされています。フォームの大きさも大きくなっていて、見やすいだけでなく、使いやすい工夫が嬉しいですね。
ショッピングカートでも見やすくなっています。スマホサイトなどでは、スマホに最適化したページを作成してもショッピングカートに入るとPCサイトが表示される例はよくありますが、このサイトは手を抜いていませんね。
もちろん下図のようにスマートフォンにも対応しています。
今回実際にPCサイトとタブレットサイトを見比べてみました。
キャプチャー画像ではわかりにくいかもしれないので、ちょっとしたタッチのしやすさや文字の見やすさで、大きく使い心地が変わってくると感じました。
皆さんぜひ実機でご確認をいただければと思います。
山本