ホームページ制作の読みもの 07
パソコンでは完璧だったのに。親指が教えてくれるホームページの弱点
大きな画面で整って見えることと、移動中のスマートフォンで使いやすいことは別です。画面を小さくするだけでは見つからない、不便の話。
本文中の場面は、制作の考え方を説明するための想定例です。
駅までの道で、予約しようとしたら
お店へ向かう前に、スマートフォンで営業時間を確かめる場面を想像してください。きれいな写真を何枚も通り過ぎ、ようやく見つけた予約ボタンを押そうとすると、すぐ隣の別のリンクを開いてしまう。見た目は整っていても、急いでいる人には小さな障害になります。
制作側の大きな画面では、マウスで簡単に押せた場所です。けれど親指は、マウスの矢印ほど細くありません。操作する道具が変われば、必要な余白も変わります。
一列にした後の、順番まで見る
二列の画面を縦一列にすると、写真と説明の順番が変わる場合があります。説明を読む前にボタンだけが現れたり、一つのサービスの説明が離れ離れになったりしていないかを確認します。
料金表も、単に横へスクロールできれば十分とは限りません。プラン名が見えなくなると、何の料金を読んでいるか分からなくなります。比較表を残すか、プランごとの説明に分けるかは、内容に合わせて考えます。
固定ボタンにも、居場所が必要
画面の下に相談ボタンがあると便利な場面があります。一方、本文の最後や入力欄に重なるなら、その便利さが別の不便をつくります。常に表示するものを増やす前に、読む面積を残せているか確かめたいところです。
フォームでは、入力欄の名前が入力後も見えること、間違えた場所と直し方が分かることも大切です。送信ボタンの色だけを目立たせても、途中の入力で困ってしまえば先へ進めません。
自分のスマホで、一つだけ用事を済ませる
確認するときは、「サイトを眺める」より、「料金を知って相談する」「住所を確認する」と目的を一つ決めて操作してみます。途中で迷った場所を記録すると、修正の話が具体的になります。
スタジオりんりんでは、画面幅に応じた配置と読み順を考えます。ただし、実際の端末やブラウザでの確認も欠かせません。きれいな縮小版をつくるのではなく、その画面で用事を済ませられるか。親指は、意外に正直な確認役です。
まだ言葉になっていないことから、一緒に。
相談の前に、資料や考えを完璧にまとめる必要はありません。まずは質問を眺めて、書けそうなところから始めてみてください。
