お問合せ先 無料見積もり

APRICOT DESIGN BLOG

ユーザーにとって使いやすいデザインとは?

UPDATE : 2020.08.07

CATEGORY : Sasayama Sayaka

さやさんです。

WEBコンテンツのデザインがとても重要なことは皆さんご存じだと思います。

しかしデザインと一言に言っても様々ありますね。
「かっこいいデザイン」「シンプルなデザイン」「かわいいデザイン」など……

今回の記事ではデザインの方向性ではなく、
『ユーザーにとって使いやすいデザイン』をテーマに、その重要性をお伝えします。

閲覧者の目的が達成できる良いデザインのホームページはユーザビリティの満足度が高く、ユーザーの離脱率を抑えることができます。
すると自然に多くのユーザーが集まり、検索エンジンはそのコンテンツを『良いコンテンツ』と評価します。
ユーザーに評価されるホームページは間接的にではありますが、結果として検索エンジンにも評価されるのです。



目次の設置


皆さんが何か調べ物をしようとしてGoogleで検索した時、上位にヒットする記事の多くに『目次』が設置されていることにお気づきになりましたか?

情報が多いコンテンツは記事の内容が長くなってしまいます。
検索でヒットした長文の記事の中で、自分が知りたい情報が下部にあるとしましょう。
知りたい情報までスクロールして探すのは一苦労ですよね。
そんなユーザーの手間をなくすために、情報量の多い記事の多くには各見出しにクリックで飛ぶことができる目次が設置されているのです。

目次の設置は『ユーザーにとって使いやすいデザイン』ですね。



テキストの読みやすさ


WEB上のコンテンツの多くは文章です。文章が読みにくいと、ユーザーはすぐにそのコンテンツから離れてしまいます。
そのため、テキストの可読性は『ユーザーにとって使いやすいデザイン』で重要な要素となります。


・行間

文章の行間は狭すぎても広すぎても読みにくくなります。
1.5倍~1.75倍が読みやすい行間の設定(文字サイズに対して0.5倍~0.75倍の隙間を空ける)と言えるでしょう。
行間の例

・文字サイズ

文字サイズも可読性の大きなポイントですね。
ブラウザで文字サイズが変更できるとはいえ、小さすぎる文字は読みにくくユーザーを疲れさせるので注意しましょう。
読みやすい適切な通常の文字サイズは16px~18px程度です。


・余白

文章の余白も読みやすい文章を作る上での重要な要素です。
余白は各段落や見出しと本文の区別などに使われ、ユーザーに文章構造を視覚的に理解しやすくさせます。
ただし無秩序に文書中に様々な広さの余白を使うと、逆にユーザーにとって読みにくい文章となる可能性があります。
余白の幅は文章構造毎にルールを定めると読みやすくなりますよ。
余白の例


少しではありますが、『ユーザーにとって使いやすいデザイン』についてお伝えしました。
アプリコットデザインで制作するホームページも、テキストの読みやすさは上記を意識したつくりとなっています。

良いWEBデザインとは見た目で「かっこいい」「かわいい」「素敵!」と感じるだけではなく、
ユーザーにとって見やすい、初見でも迷うことなく操作できるデザインなのではないかな、と思います。


その他、ユーザーに優しいWEBデザインを考えるおすすめ記事です!

webで考えるデザイン基本原則-整列編-

webで考えるデザイン基本原則-整列編-



【やさしいウェブ】アンカーテキスト編

【やさしいウェブ】アンカーテキスト編

    営業マンゼロだから低コスト・高パフォーマンス!東京・長野(長野市、松本市)・金沢(石川県金沢市)でホームページ制作・WEB制作・ネットショップ制作を中心に、ブランディングに繋がるロゴ制作・チラシ・名刺・パンフレット・DM・ショップカード等の各種印刷物、看板・のぼりなどの販促物を制作しているデザイン事務所アプリコットデザイン。

    [長野オフィス-本社-]
    〒381-2246
    長野県長野市丹波島1-805

    [東京ブランチ]
    〒100-0004
    東京都千代田区大手町 2-6-1 朝日生命大手町ビル2F

    [松本ブランチ]
    〒390-0851
    長野県松本市大字島内4619-3 QuintetDoor 1階南室

    [金沢ベース]
    〒920-0831
    石川県金沢市東山1丁目10-1 103

    記事が気に入ったら「いいね」してね。(SNSとは連動してません)

    6+

    この記事を書いた人Who wrote this blog

    Sasayama Sayaka

    向上心ハンパない、ワクワク系WEBエンジニア。写真を撮るのは苦手笑

    無料見積

    まずは無料でお見積もりを作成いたします。
    お気軽にお問い合わせください。

    無料見積もり

    お問合せ先

    クリックで
    事務所一覧が
    開きます

    tel.0120-622835

    営業時間/9:00〜18:00 
    定休日/土日祝日

    Copyright © 2020 APRICOT DESIGN All Rights Reserved.