webデザイン

スマホサイトデザインを依頼する際に気をつけること3つ+α

  • このエントリーをはてなブックマークに追加

今回はスマホ表示に対応したウェブサイトを作る上での注意点を見ていきたいと思います。

今更?とお思いかもしれませんが、未だに注意しておく点が無視されていると感じるサイトもよく見かけるので、スマホ来航10年を迎えた今、改めて考えていきたいと思います。

3つのユーザビリティ

サイト制作で言うところのユーザビリティとは「ユーザー(サイトを利用する側の人)のことを考えて設計しましょう!」という意味の言葉ですよね。

…できてますか?

「自分の思うように見せたい!」というのが先行して、その結果ユーザーを無視していませんか?

とは言っても、見せ方見られ方バランスを取るのは難しいですよね。僕もサイト制作に携わる度に毎回悩むのですが、少なくとも全く考えないよりは一度は考えてみた方が良いサイトに仕上がるはずなので、これから挙げていく内容を確認してみてください。

ページの表示速度

検索サイトを運営しているGoogleの調査では、ページの読み込みに3秒かかると53%の利用者がサイトから離れていくという結果が報告されました。

たった3秒で半分以上が!?と思うかもしれませんが、この3秒、意外と長いです。自分が検索する時のことを思い返してみてください。

パッと見たい情報だけ見たくないですか?

少なくとも僕が検索してる時は、数秒待つくらいなら一回検索サイトのページに戻って次の検索結果を見た方がマシだと考えてます。そうやって1ページ目の検索結果に目的の情報が見つからなければ、その時初めて、“読み込みの遅かったサイトに再訪問して表示されるまで待ってみる”という行動をします。

Googleの調査結果では多くのユーザーがそれに近い行動を取っているようなので、ご自身のサイトの表示速度を一度は測ってみた方が良いでしょう。

さぁ、自分のスマホを見てストップウォッチで計測…というのも一つの方法ではありますが、キャッシュや通信速度などの条件で表示速度も色々変わるので、より客観的に計測できる方法をGoogleが用意してくれています。計測したいページのURLを入れるだけなので、下記のリンクから試してみてください。


https://testmysite.withgoogle.com/intl/ja-jp

文字の大きさ

最近は結構読みやすい大きさのサイトも増えてきました。しかし未だに20年前のパソコン表示を基準とした文字サイズに設定しているサイトを見かけます。これは、スマホではかなり小さな文字に見えます。例えば…

「これが、20年前のパソコン表示に合わせた文字サイズで、最小文字だとこれくらい

「一方、2018年現在のスマホ表示に合わせた文字サイズで、最小文字だとこれくらい

という感じです。いかがですか?実は今のパソコンモニターも高解像度化が進んでいるので、20年前の方はパソコンから見てもかなり小さい文字に見えている人が多くいると思います。

文字は小さく表示した方が見た目がカッコいいからとか、これが普通だったから今も普通でしょ?みたいな考えでサイトを作ってしまうと、とんでもなく見づらいサイトが出来上がってしまうので、気を付けてください。

ナビゲーションの数と大きさ

皆さんご存知の通り、スマホ画面はパソコンに比べて表示領域がかなり小さいです。パソコンと同じように常時表示させるヘッダーなどのナビゲーションを設置すると、かなり圧迫感のあるサイトになります。

ちなみに、スマホとパソコンの画面サイズの比較はStatCounterというサイトのデータの一番多いサイズを参考にしています。

2017年の利用スマホ画面サイズの統計

2017年の利用パソコン画面サイズの統計

念のためと思って元となったデータを添えたんですけど…何だか話が逸れそうですね。要は、パソコン画面と同じようにナビゲーションで表示領域を占領してしまうと、スマホ画面ではかなり見づらいというのを言いたかったんです。

なので極力、固定の表示物は少なく!そして小さく!!…しかし、表示するからにはきちんとタップできるようにしないといけません。難しいですね。見せたいものは沢山あるのに、極力削らないといけないとは。

制作を他社に依頼する場合

これが結構厄介で、依頼者と制作者の立場で意見交換する場合は、先ほど挙げたような注意点が話題に出て来ない場合があります。

依頼者の立場

やはりサイト制作に関しては専門家ではないので、上記注意点を知らないことや、そこに気付けないことがほとんどです。なので、自ら「注意点を考慮した上で制作してほしい」と依頼することができません。

サイト制作を外部に依頼する場合は、デザインの話をする前に、どういう意図があってサイトを作るのかということを説明しておいた方が良いでしょう。制作者はその意図を中心に置いて設計・デザイン・コーディングを行ってくれるはずです。逆に言えば、伝えたにも関わらずサイト制作の意図を汲み取れない制作者は、信用しない方が良いでしょう。

制作者の立場

依頼者の思惑通りのものを制作するのが仕事なので、注意点は分かっているものの、依頼者の意向が注意点と正反対の場合、そのまま正反対のものを制作します。依頼者に従順な制作者ほど、そうなります。

依頼者の意見を全く受け入れないというのも問題ですが、少し意見してくれるくらいが丁度良いように思います。制作者が何でも受け入れてくれるからと鶴の一声で全てを決めてしまっては、気付けたはずの改善点を見落としてしまうことも多いでしょう。

まとめ

このように、スマホサイトの気を付けるべき点3つと依頼する際の注意点を見てきましたが、まずは見やすいサイトを整備して見てもらわないことには、そこに書いてある文字すら読んでもらえないという状況が出来てしまいます。

これらのことは検索サイトでの検索結果にも影響してくる場合があるので、最悪の場合、サイトの存在すら知られないということにも繋がりかねません。

制作する作業者かどうかは関係なく、プロジェクトに関わる全ての人の共通認識として今回の注意点を意識しておくことが必要なのではないでしょうか。

  • このエントリーをはてなブックマークに追加

コメントを残す

*