2020/02/20自社ホームページが「見づらいんだけど..」と言われたことはありませんか?「おしゃれに」「可愛く」など見た目デザインばかりで悩んでしまうweb担当者さん・事業主さま、忙しさや難しさで、サイトを放置していませんか?“うわべデザイン”だけではホームページの価値は出ません・・・・・・!「見やすさ/使いやすさ・わかりやすさ」もアップさせ、価値あるサイトにしてみませんか?web専門用語では「ユーザビリティ」と言います。デザインがおしゃれでも、このボタン押したら何が起こるの?(不安/わからない)値引き条件が難解すぎる!次のページへの行き方は?だと「ホームページに集客できているのに、売れない...」てことになりやすく、かなり損してしまいます。今回は、見やすいホームページにする方法がわからない、ユーザビリティ初心者向けの改善ポイントをまとめました。まとめ「おしゃれなホームページ」目指して、事件発生ホームページリニューアルしたのに・・・まだお客様からこのような「見方がわからない」と言われたり、あるいは購入などにつながりにくいまま・・・・ということがありえます。ホームページ制作は、この部分でもクオリティに違いが出ます。適切な制作者を選ぶのはもちろん、発注者様も「お客様が本当に望むデザイン」を共に目指していきましょう。運用後などにもちょこちょこ、使いやすさの課題は出てくるからです。その際、できるだけ「改悪」してしまわしない事も重要です。バナーだらけで疲れたレイアウトが難解。探したい〇〇はどこ?イメージ写真を見て、「これは違うな」と思いました耳障りのいいコピーやデザインばかりで、重要なコンテンツが乏しい!といったことが起きた時、人はそのwebサイトから回れ右して、逃げてしまいます。お客様から直接言われないことも多く、アクセスに繋がらないというような形で問題が見えたりしますね。ホームページでは特に、せっかく作るなら、「見にくい、使いにくい。損しない」Webデザインを依頼された方が賢明です。運用時にも、アクセス解析・ユーザーテストなどから見えた課題を改善していくのがオススメです。おしゃれなだけ、を目指しますか?Web担:見た目次第でだいぶ(結果も)変わるでしょ?Web担新人:デザインを覚えて、自社サイトをかっこよくするぞ!社長:きれいだったらいいのでは?有名な制作会社を探そう...こういう「デザイン」は、アートを意味することが多いです。制作会社も中には、HP制作にとっての「デザインの意味」を曖昧にしている業者もあります。“きれいなデザイン”は長期的に見ると重要ですが、単品ではホームページの効果に結びつきません。「見にくい(ユーザビリティが低い)と、残念なホームページなのか」、ご理解いただけましたか?あなたがWeb担当者さんだった場合、周囲から何か指摘されるかもしれないポイントです(特に、売れていない場合など)。なく、Webデザインは課題解決の一つなんです。お客さま思いの作りになっていることがまず、大前提。ホームページはダサい必要もないどころか、見た目の恩恵もかなり大きいのですが......00.「使いやすさ」とはでは早速、自社サイトで「残念な結果」を避ける「使いやすさ」の基礎を押さえましょう!利便性のよさの尺度をデザイン用語では「ユーザビリティ」と言います。特定の利用状況において、特定のユーザによって、ある製品が、指定された目標を達成するために用いられる際の、有効さ、効率、ユーザの満足度の度合い。ユーザーが満足できるよう楽しく利用することが可能つまり「ユーザビリティがいい状態」とは、「紛らわしくなく、くどくど説明しなくても、お客様が自然にみていただけるような」ホームページのことですね。01.ページ導入部に、パッと伝わる情報やビジュアルをあるページに訪問して、最初に画面に見える上部のエリアを「ファーストビュー」と言います。このファーストビューは超大切。ページに訪問した大多数の人は、ページ上の方を見て瞬時に判断し、問題を感じたらすぐ離脱してしまうからです。様々な調査で、ページの下へ行くほどスクロールしてくれる割合は激減することがわかっています。下まで見る人は、全体の30%以下ほどになるでしょう。ヒートマップのサービスを提供するClickTaleはおよそ10万のページの閲覧を分析しました。結果としては、対象者は閲覧したページの76%でスクロールバーを使用し、そのうちの22%では、ページの長さにかかわらず一番下までスクロールしました。2なので、少しでも脱落させないためにも、「ファーストビュー」は一瞬で的確に、その先まで見続けるメリット・特色を打ち出すよう作り込みましょう。ファーストビューが最初のハードル。「導入部」が残念だと、その下にいくら丁寧な説明などあっても離脱され安く、ムダになってしまいます。専門用語を不用意に使わず、ターゲットに通じる文言なのか?クリック先が予測できるコピーやデザインか?一つのバナーで伝える内容を絞っているか?など。「うちのファーストビューだめかも...」と思った人は、ぜひ改善を試みてください。こんな事例もデザインに詳しくない方の作るバナーやメインビジュアルは、「改善前」のように多くの要素を詰め込んでしまいがちです。バナーなども、人はクリックすべきか判断するのに数秒以上かけてくれません。ファーストビューの改善だけで反応率がアップした事例(現在記事は非公開になっています)02.定番ルールに従う(学習しやすさ)ホームページって色んなデザインのサイトがあるように見えて、実は「迷ったらこうしとけ」な“定番ルール”があるんです。ヘッダーのロゴはトップページ(ホーム)へ戻るリンク。“定番ルール”に従うだけでも、十分使いやすくなります。そのホームページでちゃんと明確な法則が見えるようデザインすれば、必ずしもこのルールに沿わなくても大丈夫。(規格外にすることは、制作者の力量次第では危険ですが...)「サイトをピンク系にまとめるため、リンク色はピンクに」という感じですね。新ルールは、誰もが簡単に理解できるものである必要があります。「何でもかんでも問合わせないと使えないホームページ」なんて使わないですよね?(それに近いサイトもあります・・・)混ぜるなキケン。ルールは基本は一つに統一しましょう。気分でリンク色がピンクになったり青になったり、というのは絶対だめです!“webサイトの定番”は押さえつつ、プロの判断で独自性を出したデザイン性の高いサイトは、良質な「見やすい」のお手本です。たくさんのホームページを研究してみてください。ルールの作り方も、崩していいポイントも、そこにヒントがあります。03.ユーザーは広告が嫌いユーザーは広告に見えるコンテンツを無意識に飛ばし読みします。それが広告でなくても、「広告っぽい」だけでクリックされません。)デザインのコツは、あらゆる案内リンクをバナー風のデザインにするのは避けること。広告風デザインはバランスや目的からみて、重要なものに絞りましょう。広告化させないものの例としては、一般的には、定番的なメニューで案内するような基本のナビゲーションなどです。04.メニュー数は少なめに人は選択肢が多すぎると、決断できないという心理があります。一度に記憶できる「情報のかたまり」にも上限があり、だいたい3〜7個と言われています。2つの心理学的な理由から、ナビゲーションのどれもクリックせず、次のページまで見ない可能性が高いわけです。このため、メインナビゲーションは情報整理して、主要なものに制限しましょう。05.文字を読みやすく小さすぎ・薄すぎなど、字が読めない「無駄におしゃれ風」ホームページになっていませんか?薄ーいグレーの文字、ミニサイズのフォント、流れる文字・チカチカする効果・・・とか。(懐かしいwww...と感じる世代です・汗)それだめ!デザインです。お客様の目に優しく、読みやすいテキスト表現に改善してください。ホームページの本文で、読みやすいフォントサイズは、14~16ピクセル程度。フォントの種類や、背景と文字カラーのコントラストによっても変わります。リンクとボタンをわかりやすく本文テキストとは明らかに違った目立つリンク色にしたり、クリックできそうなボタンデザインを心がけましょう。クリックできるかわかりにくいデザインは、それだけで損しています。考えて「押せそう」となるよりは、パッとわかるものであるほど面倒な印象を和らげられます。マウスオーバーしたり、クリックすると見た目(色やライン)を変えることで「押した感」を出してください。色覚系のアクセシビリティに問題ある方にも、助けになるでしょう。07.ホームページの文章に、余白を行間や段落ごとの余白がちょうどよく取られていれば、読みやすさが確保されます。行間が適度にあると、じーっと目を皿にして読まなくても大丈夫なので、「読んでみよう」と思ってもらえる一要素に。08.ユーザビリティ改善を阻むもの「明日から活かせそう!」という人も、「使いやすく変えられるか、よくわからない」人もいらっしゃるかもしれません。「このホームページでは注文こない、とは感じているんです。社長や上司も見た目を中心に指摘するし...」などその重要性を訴えたり、ご自身での改善が難しいこともありますよね。「使いやすさは、逃げられない・効果的なホームページを支える」もの、と少しでもご理解いただけましたら、とても嬉しいです。当制作でももちろん配慮しています。(「使いやすい」視点だけじゃないですが)ユーザビリティをしっかり考えられるweb業者なら、目的・ニーズに沿って制作します。気分や好みだけでは作りません。デザインや見やすさの話は、なるべく制作会社やプロデザイナーを信頼していただきましたら幸いです。心理学や統計、イメージなどの視点から、わかりづらいと判断したご要望につきましてはご相談させていただきますが、弊社ではエンドユーザーのよき理解者という意味で、まずはお客様の視点もお聞かせください。基本的には「画面を覗くリアルなお客様候補」の方々を重視いたします。Design/エイプリルデザイン「ビジネス春メク🌸Webカウンセラー👩‍⚕️」を理念とする、Web制作/基礎SEO対策/マーケティング/ブランディング等をサポートする伴走型Webデザイナー。ブログ/ライティング・分析/HP改善っぽいのが一応の強みで、公開後も安心のサポート対応可。ブランディングもマーケいづれも好き。お気軽にご相談ください。HP診断などからも承っています。基礎から覚える、深く理解できる。考えていた時期がありました。postフォロワー買ってもムダ。reserved.^。