タグ

ブックマーク / www.bebit.co.jp (11)

  • コンバージョンを後押しする体験談・事例の効果的な活用法 (ユーザビリティ実践メモ)

    ウェブサイトでは、商品やサービスを説明する際にお客さまの声や体験談、企業の活用事例などが多く使われます。 これらの体験談・活用事例には、「このサービス(商品)はあなたのためのものですよ」とユーザに伝える役割があります。� 今回は上記のような役割で体験談・活用事例を効果的に活用できたケースを2つご紹介します。 あるサイトでは、特定分野の専門知識を持っているユーザに対するサービスを提供していました。 このサイトでも体験談や活用事例を掲載していましたが、理解しやすくするため、難しい専門用語を含めずに記述するよう留意していました。 しかし、その体験談をサービスの対象となる専門知識を持つユーザが閲覧した際、「きっとこのサービスは初心者向けだから、自分たちが使うサービスではなさそうだ」と感じてしまう様子が見受けられたのです。 そこで、あえて専門用語を含めた体験談を見せたところ、「これなら是非使いたい」

    ike_aiji
    ike_aiji 2013/09/20
  • ウェブライティングのルール (ユーザビリティ実践メモ)

    以下、読みやすさ向上のためのルールの一部をご紹介します。 文字サイズは大きめに設定 横幅は40文字以内 3-4行の固まりで、改行(余白)を入れる 背景色と文字色とのコントラストを高める(白い背景で薄いグレーの文字はNG) 要点を箇条書きにする 至極当然のルールではありますが、意外に忘れられがちなものでもあります。

  • 文章を見やすくする5つの工夫 (ユーザビリティ実践メモ)

    ウェブサイトを制作していると、どうしても長い文章を掲載しなければいけない場面に遭遇します。 今回は、文章を読みやすくする「見せ方」の方法を、例を元にご紹介いたします。 ウェブライティングをご覧ください。 方法1.文字サイズを大きくする 最も基的な方法ですが、最も効果的です。文字サイズを大きくするだけでも「見やすさ」は格段に向上します。 方法2.行間・改行・インデントを適切に取る 方法1.と同じく基的な手法ですが、こちらも効果的な手法です。方法1.と組み合わせることで、ほとんどのサイトでは問題がないレベルにまで「見やすさ」は向上するでしょう。 方法3.キーワードを目立たせる 文中で重要なキーワードを太字にしたり、文字色をつけることで文章にメリハリをつけて見やすくすることができます。 キーワードを装飾することで、単に目立たせて読み手に意識させるだけでなく、一行を読み終えたユーザが視線を右か

    ike_aiji
    ike_aiji 2013/09/20
    文章を見やすくするには、文章に「メリハリをつけ」て、ユーザが「どこを読んでいるかすぐ分かる」ようにすることが重要
  • ユーザ心理を捉えてコンバージョンボタンの文言を (ユーザビリティ実践メモ)

    ウェブサイトでユーザに情報提供することも大切ですが、商材によってはユーザと店舗などで対面し、直接的にコミュニケーションする機会を持った方が自社の商品をより魅力的に伝えられる場合があります。 特に銀行や保険業界などでは、ウェブサイトを用いて自社の商品を検討しているユーザを実際の店舗での相談会・説明会に誘導したい、と考えている方は多いのではないでしょうか。 ただし、「店舗での相談会・説明会に来てもらう」ためには、ユーザにとって心理的に高いハードルを越えてもらう必要があります。そのため、「思うように来訪者数を伸ばせず、困っている」というご相談を多く頂きます。 今回は、弊社で行った生命保険のウェブサイトにおける行動観察調査を事例に、「ユーザに クリックしてもらいやすいコンバージョンボタンのあり方」をご紹介します。 あるユーザは、生命保険のウェブサイトを「そろそろ格的に乗換えを検討しようかな」 と

  • ウェブサイト設計の時に役立つ7つのテクニック/【その6】目線の操作 (ユーザビリティ実践メモ)

    今回のテーマは「目線の操作」です。ユーザの視線を集める要素と遠ざける要素をうまく使い分けることで、意図通りにユーザにメッセージを伝達するためのコツをご紹介します。 ファーストビュー 関連性 具体性 ウェブライティング リンクの装飾と配置 目線の操作 ←今回のテーマ 他サイトでの慣習 「目線の操作」を構成する3つの要素 視線の開始位置 視線を集める要素 視線を遠ざける要素 1. 視線の開始位置 例えば、以下は弊社のHPですが、このサイトを見るときどこから見ますか?「徹底した顧客心理分析により・・・」というブランドパネルか、その下の「コンサルティング事例・実績」ではないでしょうか? 弊社HPの例 ビービットのサイトには、「ビービットは何をやっているんだろう?どのような会社なんだろう?」ということを漠然と思いながら来訪する方が多いため、その疑問に直接答えられるようメインメッセージや実績エリアに目

  • ウェブサイト設計の時に役立つ7つのテクニック/【その5】リンクの装飾と配置 (ユーザビリティ実践メモ)

    ウェブサイト作成時に役立つ7つのテクニック、第5回のテーマは「リンクの装飾と配置」です。ユーザにとって使いやすいリンクの装飾や配置のサイトを作成するためのポイントをお伝えします。 ファーストビュー 関連性 具体性 ウェブライティング リンクの装飾と配置 ←今回のテーマ 目線の操作 他サイトでの慣習 ウェブサイトでは、ユーザがリンクを見つけることができなければどんなにユーザの関心を引くページやコンテンツを用意しても、まったく見られないまま終わってしまう危険性があります。 そこで、今回は「リンクの装飾と配置」をテーマに、ユーザがスムーズにページ間を遷移することが可能な、回遊性の高いサイトを設計するためのポイントをお伝えします。 まずはリンクの装飾について、テキストリンクとボタンリンク、それぞれのポイントを順に解説していきます。 1. テキストリンクの装飾 テキストリンクは青字下線で表すことによ

    ike_aiji
    ike_aiji 2012/02/09
  • ウェブサイト設計の時に役立つ7つのテクニック/【その4】ウェブライティング (ユーザビリティ実践メモ)

    ウェブサイト作成時に役立つ7つのテクニック、第4回はウェブライティングについて取り上げます。ウェブ上で文章を書く際には、紙媒体とは違った独特のルールが存在します。ルールの観点を押さえて、読んでもらえる文章を書くためのポイントをお伝えします。 ファーストビュー 関連性 具体性 ウェブライティング ←今回のテーマ リンクの装飾と配置 目線の操作 他サイトでの慣習 「ウェブサイトに有益で魅力的な情報を載せているのに、何故か成果が出ない。」そんな経験をお持ちの方もいらっしゃるのではないでしょうか。ウェブサイトでは紙媒体に比べ、可読性が著しく低下します。もしかしたらウェブサイトに適した文章の書き方になっておらず、「有益で魅力的な情報」であることが伝わっていないのかもしれません。 第4回では「ウェブライティング」をキーワードに、メッセージを伝えるための3つの観点をお伝えします。 「ウェブライティング」

    ike_aiji
    ike_aiji 2011/12/06
  • ウェブサイト設計の時に役立つ7つのテクニック/【その1】ファーストビュー設計のポイント (ユーザビリティ実践メモ)

    サイトを作るにあたって、伝えたいことやユーザが求めているものをはっきり考えられても、いざ実際のウェブサイトにしようとするとどう作ったらいいのか途方に暮れてしまう、といったことはありませんか? 実践メモでは、今回から7回シリーズで実際のウェブサイトをどう作っていったらよいのか分からないときに役立つ、特に重要な7つのテクニックについてまとめていきます。 ファーストビュー 関連性 具体性 ウェブライティング リンクの装飾と配置 目線の操作 他サイトでの慣習 まとめの第1回は「ファーストビュー」についてです。ファーストビューは、ユーザがそのページを見るかどうかを決める重要なエリアです。以下4つのことに気をつけてください。 ファーストビュー設計/4つのポイント 縦幅を節約する 適切なフィードバックを与える 下にページがつながる印象を与える 画像を置く 1. 縦幅を節約する スクロールしないユーザもい

  • ユーザに自分ゴト化してもらうための3つの方法 (ユーザビリティ実践メモ)

    今回の実践メモでは、WEBサイト上でユーザの購買意欲を喚起するための方法についてご紹介します。 WEBサイトを見ているユーザの購買意欲を喚起するためには、ユーザに商品の購入を『自分ゴト化』してもらうことが重要であることが、これまでの弊社のユーザ行動観察調査から明らかになっています。 稿では、WEBサイト上での情報提供で、ユーザに『自分ゴト化』してもらうための3つ紹介いたします。 (1)「こんな人にオススメ」という情報を示す 例えば、以下の表現を比べてみてください。 上の例だと、これらの商品が自分に合っているのかどうかをユーザは判断することができません。 しかし、下のように「こんな人にオススメ」という情報を提示すれば、ユーザに「この商品は自分の状況に合っている」と認識させることができ、自分ゴト化してもらうことができます。 (2)商品価格をユーザに実感させる いくら自分の状況に合った商品があ

  • サイト外でのユーザ心理を利用する3つのポイント【前半】 (ユーザビリティ実践メモ)

    今回から数回にわたり、「サイト外のユーザ行動も踏まえたコミュニケーション設計」というテーマで実践的なノウハウをご紹介します。 ユーザ行動観察調査を実施していると、企業サイトで製品・サービスの概要を理解した後、他社サイトや口コミサイトを確認するという行動が非常によく見られます。 そこで、企業サイト以外での情報収集によってユーザが陥りがちな3つの心理と、それに対応する方法を考えてみます(今回は【前半】として、初めの2つをご紹介します)。 「企業のサイトは(自社に)いいことしか書いていないので、悪い評判や自分が気づいていないデメリットがないかを知りたいからです」 インターネットは比較メディアとも呼ばれ、このような行動は老若男女問わず、ほとんどのユーザで見られます。「悪い評判を見つけるまで、しつこく探します」と、検索結果を何ページも見ていくユーザもいます。 企業サイトはこのようなユーザの行動と、そ

  • 【海外事例に学ぶ】アコーディオン型入力フォームの実力 (ユーザビリティ実践メモ)

    今回は少しテーマを変えて、フォーム関連の最新事例について書いてみます。 海外事例紹介としてお馴染みとなってきましたLuke Wroblewski氏の、“Testing Accordion Forms”(A List Apart)をご紹介します。 「入力フォームを複数ページに分割すべきかどうか?」について皆さんも悩まれたことがないでしょうか?分割すると各ページの項目は少なく済みますがステップが多くなってしまい、分割しないと1ページが縦に長くなってしまいます…。 その問いへの新たな解決案として出てきたのが“アコーディオン型”とも言うべき入力フォームです。 Apple.comのオンラインショップの購入フォームです。 では実際のフォームをみて見ましょう。 下記にある画面が、MacBook Airの購入フォーム画面です。なんと、この1ページ中で購入手続きが完結できるのですが、入力項目が多い印象も特に

  • 1