タグ

ユーザビリティに関するWebDesignScrachのブックマーク (183)

  • 高齢者のユーザビリティ:課題と変化

    65歳以上のユーザーは、Webサイトやアプリを利用する際に固有の課題に直面する。このユーザー層のデジタルリテラシーは向上しているが、デザインは高齢のユーザーに対応したものにする必要がある。 Usability for Seniors: Challenges and Changes by Lexie Kane on September 8, 2019 日語版2020年6月17日公開 多くの裕福な国で、最も急速に増加している年齢層が65歳以上だ。グローバルに見ても、人は長生きするようになり、年を取っても元気でいられるようになった。Pew Research Instituteが実施した調査によると、2019年には65歳以上の人の73%がインターネットに接続していた(訳注:総務省の令和元年版情報通信白書によると、2018年の個人のインターネット利用率は、60~69歳で76.6%、70~79歳で5

    高齢者のユーザビリティ:課題と変化
  • ランキング1位は大阪府立大学。レベルは全体に向上。ただしトップページの見やすさは年々低下 | 日経BPコンサルティング

    ランキング1位は大阪府立大学。レベルは全体に向上。ただしトップページの見やすさは年々低下 ―「全国大学サイト・ユーザビリティ調査2011/2012」― 2011年11月28日 ランキング・トップ3校は大阪府立大学(公立)、岡山大学(国立)、電気通信大学(国立)の国公立大学が独占――。過去8回の調査でベスト3を国公立が占めたのは初めてで、独立法人としての意欲の表れかもしれない。また、広島工業大学(私立)、大谷大学(私立)、国学院大学(私立)の3校が新たにベスト10入りした(参考資料:スコア・ベスト10)。 日経BPコンサルティング(東京都港区、戸田雅博社長)は、大学サイトのユーザビリティ(使いやすさ)を評価した「全国大学サイト・ユーザビリティ調査2011/2012」の結果をまとめた。 今回、国立・公立・私立を合わせて211大学のサイトを調査対象とした。全体の傾向をみると、平均スコアは前回の5

  • ECサイトのユーザビリティ

    サイトは改善されてきており、電子小売業のユーザビリティについての我々の知識もかなり増えている。今日では貧弱なコンテンツがユーザーの失敗の主な原因である。 E-Commerce Usability by Jakob Nielsen on October 24, 2011 日語版2011年11月7日公開 eコマースユーザビリティについての最初の調査から11年が経ち、このトピックを再び扱うに価する時間が十分に経過した。今度の調査の結論は何かって? それはeコマースサイトのユーザビリティガイドラインの数が初版レポートの207個から最新版では874個に増加した、ということである。この大ざっぱな測定基準を用いると、ドットコムバブル時代に比べて、我々はeコマースのユーザーエクスペリンスについて4.2倍知っていることになる。 ユーザビリティ: 際立った進歩 11年前の調査では、当時のeコマースサイト上で

    ECサイトのユーザビリティ
  • ウェブサイトのユーザビリティを改善する 7つの方法 | Startup Dating [スタートアップ・デイティング]

    Mashable 日語訳記事は、株式会社gumi の提供でお送りします。株式会社gumiは、拡大著しいソーシャルゲーム業界において、高い技術力と強固な運営体制をもとに、スマートフォン/フィーチャーフォン向けにゲームを提供するSAP(ソーシャル・アプリケーション・プロバイダ)です。我々は、日はもちろん全世界に向けて、次世代のエンタテインメントを提供するリーディングカンパニーとして、グローバルNo.1を目指します。エンジニアをはじめ多数のポジションで絶賛採用中です。 All reproduction of the Mashable content is licensed by PARS International. (c)2011 Mashable, Inc. All rights reserved. 【翻訳 by Conyac】【原文】 Web ユーザー向けのコンテンツを書くことには独特

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

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

  • 【友人紹介キャンペーン】ユーザの気持ちを180度変化させるちょっとした工夫 (ユーザビリティ実践メモ)

    友人紹介キャンペーンを用いることで自社サイトの会員数を増やそうと考えている人は多いと思います。 普段はウェブとユーザの二者間のコミュニケーションを考えていますが、友人紹介キャンペーンには「紹介される人」という第3の人を意識する必要があります。 そこで今回は、ユーザと紹介される人のコミュニケーションが少しの仕組みの違いで180度変わってしまうという例を見ていきます。 友人紹介としてたとえば次の二つの方法が考えられます(図1、図2参照)。 図1は企業のウェブサイト上で友人のメールアドレスを登録するもの、図2は企業のウェブサイト上にある紹介券を友人に送るものです。 一見これらはささいな違いしかないように見えますが、ユーザの視点から見ると大きな違いがあります。 それは、前者は「企業に友人の情報を与える」のに対して、後者は「友人に有益な情報を与える」という違いです。 これによってどういう行動の違いに

  • 現在閲覧しているページへのリンクをハイライトできるjQueryプラグイン「currentPage」:phpspot開発日誌

    これは必見のCSS3のBox Shadow等を使って描画されたオブジェクト描画例い... 次の記事 ≫:フレッシュなWordPressテーマ100 MagicEdit - currentPage: A jQuery plugin to add "current" to nav links 現在閲覧しているページへのリンクをハイライトできるjQueryプラグイン「currentPage」。 一般的なナビゲーションの場合、現在いるページにハイライトをすることで、どこにいるか、分かりやすく表示することが多いですね。 これをサーバサイドでやると分岐が増えてソースが見にくくなってしまう。 例えばphpなら次のような処理がリンクごとに発生して超めんどくさい。 <?php if ($_SERVER['REQUEST_URI'] == "aaa.php") { ?> <em>aaa</em> <?php

  • SEOとユーザビリティを結びつけてコンバージョンを増やす4つのポイント | Moz - SEOとインバウンドマーケティングの実践情報

    誰もが分かっていることだろうけど、SEOの目的は最終的なコンバージョン数の向上にあり、コンバージョンはお金に直結している! SEO施策をしっかりしていても、サイトのユーザビリティがお粗末だと投資対効果(ROI)は上がらない。しっかりしたSEOに加えてユーザビリティも素晴らしければ、忠実な訪問者と高いROIを間違いなく獲得できる。 つまり、検索結果でクリックしてもらうところでSEOの役割が終わりだというわけではないということだ。単にグーグルで夢のような検索順位を獲得できればそれでいいということではない。それに、これは私のささやかな意見だけど、大事なものはサイト内のページ上にあり、ユーザーにそれをどう見せるかということだ。 そこで今回は、どうすればSEOと優れたユーザビリティを結びつけることができるかを考えてみよう。 さぁ、SEOとユーザー体験の融合に取り掛かろう。やり方としてベストなのは、ユ

    SEOとユーザビリティを結びつけてコンバージョンを増やす4つのポイント | Moz - SEOとインバウンドマーケティングの実践情報
  • 情報のつめこみすぎにご注意! (ユーザビリティ実践メモ)

    サイトを運営していると、新しい機能をつける、お知らせがある等の理由で掲載するものがどんどん増えていき、気がつくと肝心のことが分かりにくくなってしまっている……ということはありませんか? しかし、1か所に情報を詰め込みすぎると分かりにくくなってしまい、肝心のそのページの商品の売り上げが下がってしまう…というようなことにもなりかねません。 「できるだけ情報をまとめて伝えたいけれど、わかりにくくなるのは避けたい」という場合、どこまで情報を詰め込んでいいのか判断がつかずに悩んでしまうこともよくあるのではないでしょうか。 そうした場合、いわゆる「マジックナンバー7±2」を参考に、「1エリア5要素まで」を一つの目安としてみることもおすすめです。 例えば、ECサイトにおいて、購入ボタン付近に以下のような情報を掲載していたとします。 商品名 価格 獲得ポイント 数量 購入ボタン と現在5つの情報要素が掲載

  • ウェブサイトのユーザビリティ、とっても大切な20のポイント

    ウェブサイトに最も大切なのは、ユーザービリティです。 どんなにかっこいいデザインでも、どんなに重要なコンテンツを掲載しても、それを使うことができないのであれば意味はありません。 ウェブサイトのユーザビリティを向上する20のポイントを紹介します。 The Ultimate 20 Usability Tips for Your Website [ad#ad-2] 下記は各ポイントを意訳したものです。 最新の情報を中心にウェブサイトのデザインを組み立てる もし新しいコンテンツをあまりリリースしないのであれば、スタティックなコンテンツに重点をおいたデザインにします。更新頻度が高いようであれば、ブログ風に新着が目立つデザインにします。 ロゴは左上、メニューは右か下 ロゴは左上に配置し、メニューは右か下に配置します。ロゴはクリックして、サイトのトップページにリンクするようにします。このことはたいていの

  • 良質なQ&Aコンテンツを埋もれさせない方法

    GoogleのMatt Cutts(マット・カッツ)氏によるウェブマスター向けQ&Aビデオの紹介です。 今日ピックアップするビデオでは次のような質問に回答しています。 1ページに10個ずつ質問が載るQ&Aセクションを運用しているんだけど、ものすごくいいQ&Aでも古くなってしまうと4ページ目とか5ページ目とか後ろのページに埋もれてしまい、検索結果に出てこなくなる。どのようにページ送りしたらいいかアドバイスが欲しい。 Matt Cutts氏は2つのアドバイスをしています。 関連するQ&Aを表示させる 人気のQ&Aをハイライトする 順に説明します。 関連するQ&Aを表示させる 1つのQ&Aのやりとりが終わったあとに関連するQ&Aを表示させます。 教えて!gooでもやってますね。 ※余談ですが教えて!gooはぜんぜん関連のないQ&Aが並ぶことも頻繁です。関連度判定のアルゴリズムが貧弱に思えます。

    良質なQ&Aコンテンツを埋もれさせない方法
  • ユーザを逃さないヘルプの見せ方、2つの注意点 (ユーザビリティ実践メモ)

    前々回、前回に引き続き、ヘルプコンテンツの効果的な見せ方についてご紹介します。 ヘルプコンテンツは、すべての項目を羅列した「よくあるご質問」のようなページを持つだけでは不十分です。 以前の実践メモでは、疑問が発生したタイミングで「その場で」参照できるよう、主要な導線となるページ内に、ヘルプ内容を露出する方法を推奨していました。 今回は、ヘルプ内容を露出する際の、具体的な2つの注意点をご紹介します。 ヘルプの隠れた役割 置くだけでは不十分?ヘルプ活用3つのポイント そこで、実際に皆様のサイトで主要導線上にヘルプ内容を露出させる際の注意点を、以下の2つにまとめています。 注意点1. 同一ウィンドウでヘルプページに遷移させない ヘルプが掲載された別のページに「同一ウィンドウで遷移させる」(ページが完全に切り替わる)という方法はお勧めできません。 ページが完全に切り替わると、もとのページに戻るため

  • 置くだけでは不十分?ヘルプ活用3つのポイント (ユーザビリティ実践メモ)

    FAQやよくある質問などのヘルプコンテンツは、ユーザの疑問や不安を解消するために、どこのサイトでも必ずと言っていいほど設置されています。 今回から数回にわたって、「FAQ・ヘルプ」をテーマにした記事をお届けする予定ですが、まず今回は、ヘルプ活用の基ともいうべき3つのポイントについてご紹介します。 一点目は、以前の実践メモ(「FAQの隠れた役割」)でも触れていますが、「よくある質問」や「FAQ」というリンクを置くだけでなく、文の中で、ユーザの疑問が生じるところからヘルプに誘導する」ということです。 サイトを閲覧しているユーザは、「商品やサービスを選び、購入する」といった何かしらの目的を持って動いていることが多く、「ヘルプを閲覧しに行く」といった脇道へ逸れる行動には移りにくい状態です。 そこで、図2のように、ユーザが疑問や不安を感じるポイントで、ユーザの疑問・不安に合わせた表現を用いたリン

  • ユーザーの疑問を素早く解決するためのWebサイト設計

    2017年6月29日 Webサイト制作, ユーザビリティ サービス系・企業系Webサイトでよく見かけるサポート関連のコンテンツ。問い合わせをせず、自己解決を望むユーザーが増加し、よりよいサポートページの作成が必要となってきています。ユーザーが抱える疑問を積極的に解消するWebサイトを作成し、問い合わせ数を減らせば、ユーザー・企業側ともに手間を省くことができます。また、Webサイト内だけで解決できなかった疑問も素早く対処する事でユーザーのストレスを軽減することができます。そこに注目し、どのようにWebサイトを設計していくのかを考えてみました。 ↑私が10年以上利用している会計ソフト! 問い合わせを未然に防ぐ サービス関連のWebサイトでは、同じような質問を何度も受ける事が多いです。そのような質問にひとつずつ回答していくのは非常に非効率。どのような問い合わせを受けやすいのかを的確に理解し、ユー

    ユーザーの疑問を素早く解決するためのWebサイト設計
  • Web ページのフォントサイズはどのくらいが適切? | スラド IT

    米 Facebook が Web ページのフォントサイズを縮小したところ、ユーザーから目が疲れるといった苦情が出たそうだ (CNN.co.jp の記事より) 。 「高齢者差別だ」との声も挙がっているようだが、確かに若干小さめのような気がする。日の Web ページの場合、ブラウザのデフォルトフォントサイズ (12pt / 16px) をベースに、トップページなどでやや小さめ (たとえば Yahoo!ITmedia のトップページは 12px) にするのが主流のようだが、mixi のように全ページに渡って 12px 設定というサイトもある。facebook の場合、フォントサイズは 11px と確かに小さめだが、多くのブラウザで英語フォントのデフォルトサイズが小さめに設定されているため、そこまで小さいとは言えないのかもしれない。 人によってはデフォルトのフォントサイズを大きめに設定して

  • コピペで実装する「ユーザーに優しいドロップダウンメニュー」 :: 5509

    ドロップダウンメニューが便利な場合もありますが、ドロップダウンしてるエリアからカーソルが離れた際の素っ気なさときたら・・・ とりあえずサンプル2つ用意したので比較してみてください。 比較用サンプル 素っ気ないドロップダウンメニュー 優しいドロップダウンメニュー ちょっとした気遣いで優しいUIに 彼女(彼)とバイバイしたあと見えなくなるまで見守ったりしませんか?名残惜しい的なのでもいいです。振り返ったとき既にいないとか寂しいじゃないですか。そういう気持ちって重要じゃないですか。 UIにもそういう小さな優しさというか思いやりを持たせてあげましょう。普通のことですけどね。カーソルが離れてもすぐ消えずにちょっと待ってくれるドロップダウンメニューを簡単に実装できるコードを用意したので、ちょっとした優しさを持ってコピペで使ってやってください。 こっからコード HTML CSS ul#nav { mar

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

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

  • 画像はユーザーに無視される? アイトラッキング最新調査から考えるSEO対策時のポイント【Search Engine Strategies 2010レポート】

    『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day

    画像はユーザーに無視される? アイトラッキング最新調査から考えるSEO対策時のポイント【Search Engine Strategies 2010レポート】
  • iPadならではの特徴的なユーザ行動について (ユーザビリティ実践メモ)

    iPadのようなタブレット型のタッチUI端末では、PCでは見られなかった特徴的なユーザ行動が見受けられます。今回は、弊社の調査で見られたiPadにおける特徴的なユーザ行動と、デザイン上のポイントについてご紹介します。 【ポイント1】 ユーザはスクロールが苦ではない 弊社のユーザ調査にて、iPadで画面が切り替わる度にスクロールしてみようと画面をドラッグするユーザがよく見受けられました。ユーザは画面をスクロールしたがる傾向があるようです。 確かにiPad上で画面をスクロールすると、指に吸い付くようにスムーズに画面が動くため、直感的で心地よい感じがします。iPad上での快適なインタラクションは、ユーザにとってポジティブなフィードバックを与え、スクロールも苦になりにくいと考えられます。 情報は極力たくさん並べよう 調査で用いたショッピング用のアプリでは、iPadの縦1画面内におさまるだけの商品し

  • 外部リンクは別ウィンドウで開かせるべきか?  アクセス解析でユーザー行動を理解する

    『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day

    外部リンクは別ウィンドウで開かせるべきか?  アクセス解析でユーザー行動を理解する