オンラインストアでの注文やフォームなどで、ユーザーの進捗を明示するプログレストラッカーの概要や特長、実装例、よくある間違いなどをSmashing Magazineから紹介します。 Progress Trackers in Web Design: Examples and Best Practices 以下はそのポイントを意訳したものです。 1. プログレストラッカーとは？ 2. プログレストラッカーとパンくずの相違点 3. プログレストラッカーの活用 4. プログレストラッカーのベストプラクティス 5. プログレストラッカーの実装 6. プログレストラッカーのよくある間違い 7. プログレストラッカーのショーケース 1. プログレストラッカーとは？ プログレストラッカーとは進捗を明示するもので、複数のステップがあるプロセスを完了するためにユーザーの手助けとなるものです。 オンラインのプロダ
usabilityに関するminorleagueのブックマーク (21)
-
minorleague 2010/01/22
-
英文見出しで使われる9つの大文字化ルール - 情報デザインblog
英語で記事を書く必要がある方は、見出しの大文字化ルールを把握する必要があります。サイト内でバラバラにならないように、あるいは同じ紙面上でバラバラにならないように、あらかじめ見出しの大文字化ルールを定めておかなければなりません。 Wikipediaを参考に、見出しの大文字化ルール（Capitalizaion）をまとめました。 出展：Capitalization - Wikipedia 1.すべて大文字 THE VITAMINS ARE IN MY FRESH BRUSSELS SPROUTS 2.単語の先頭はすべて大文字 The Vitamins Are In My Fresh Brussels Sprouts 3.単語の先頭はすべて大文字（ただし、文中の冠詞と前置詞と接続詞を除く） The Vitamins Are in My Fresh Brussels Sprouts ※ 文の先頭は冠
-
顧客を逃してしまう、Eコマースサイトの15のポイント
Eコマースサイトの設計・制作時の間違いで、顧客を逃してしまう15のポイントと解決方法をSmashing Magazineから紹介します。 15 Common Mistakes in E-Commerce Design 下記は、そのポイントと解決方法を簡潔にしたものです。 原文ではキャプチャ入りで詳細に解説されています。 商品の詳細な紹介ページが無い。 商品の外観・材質・重量・寸法など詳細な情報を提供します。 連絡する手段が分かりにくい（提供されていない）。 ウェブサイトの全ページの見つけやすい場所に連絡に関する情報を掲載します。 購入のフローが長すぎる（分かりにくい）。 シンプルなレイアウトにし、入力→確認→完了のようにフローを簡潔にします。 購入時にサイトへの登録を必須にしている。 登録無しでも購入できるようにします。登録を入れる際は最後にオプションでいれます。 サイトの検索機能が役に立
-
EFO(エントリーフォームの最適化)のまとめ | ユージック
EFO(エントリーフォームの最適化)のまとめ 2009年8月7日 フォームのユーザービリティーの改善がコンバージョンレートの向上に一役買っているようです。 WEBサイトの最終的な受け皿であるお問い合わせフォームやショッピングカートといったフォームは他のコンテンツに比べて制作の際にないがしろにされがちですが、アクセス解析を見るとサイト内でもかなり上位の閲覧数のあるページとなります。 コンテンツできっちり情報を伝えて、アクションをおこしてもらってもフォームの操作性ひとつで機会損失につながることだってあります。 そこで最近ではEFO(エントリーフォームの最適化)としてフォームの改善対策が注目をあびています。 致命的な改善すべき項目 1.入力の訂正をする際に以前に入力した内容が消えないようにする せっかく入力したのに書き直しやエラー訂正の時に入力した内容が消えているとモチベーションがいっきに落ちる
-
ユーザビリティ改善の費用対効果を測る6つのステップ（後編） | カスタマーエクスペリエンスで道は開ける～フォレスター・リサーチのWebサイト方法論
[コラム]カスタマーエクスペリエンスで 道は開ける ～フォレスター・リサーチのWebサイト方法論 by ジョナサン・ブラウン フォレスター・リサーチのシニア・アナリストであるジョナサン・ブラウン氏によるウェブコラム。 主にカスタマーエクスペリエンスとマーケティングの側面から企業のビジネスをサポートしているジョナサン氏が、企業サイトにおけるユーザー志向の考え方や方法論をさまざまな切り口で解説します。 前回のコラムでは、カスタマーエクスペリエンスへの投資を正当化するための6つのステップのうち、最初の3つをご紹介しました。 プロジェクトを企画する（サイトのどこを変える必要があるかを明確にする）プロジェクトによってどういう効果が得られるかを定義する現状を把握し、記録する今回のコラムでは残りの3つのステップを解説します。 サイトの改善により得られる効果の度合いを予測するプロジェクトにかかる費用を算出
-
アクセシビリティ：視覚障がい者、音声ブラウザ(読み上げソフト)のシェア:WebClip - ウェブ制作、UXD／IA、アクセシビリティ
この記事のトピック Web担当者の悩み：音声ブラウザのシェアがわからない 視覚障害者のパソコン・インターネット・携帯電話利用状況調査2007 Web担当者の悩み：音声ブラウザのシェアがわからない こんにちは。“時代の3歩先をねらうWeb屋さん”ミキ・オキタです。 このブログ「WebClip ウェブデザインのニュース」では、Webデザイン・Webマーケティングの話題をお届けしています。 今回はWebアクセシビリティの話題。Web担当者なら必ず頭を悩ます音声ブラウザのシェアについて。 以前の記事でも書いたが、アクセシビリティはSEOではない。Web標準とも異なる(アクセシビリティはもっと広範囲にわたる)。かといって、結果の見えづらい「社会貢献」扱いでは、現場のモチベーションが保ちづらい。 企業がなぜアクセシビリティに取り組むのか、その動機づけははっきりさせておかなければならない。 上のことを踏
-
ユーザーの動き。｜CSS HappyLife
ボクたちみたいな、ウェブサイトを閲覧するのが当たり前の人間からすると、全く気づかない事に気づかされたりしたので、自分用メモ。 2008年2月14日の22：47頃に追記 ボクのただのメモ書きをもうちょっとちゃんと以下のエントリーで書いてもらってるので、あわせてご覧になって頂くと、良いかと思います。 Webアクセシビリティについての覚書 - ねんがんのWebユーザビリティテストに参加した ロゴクリック＝トップページに戻るという認識は殆ど無い。 トップページに戻る場合は、ブラウザの「戻る」ボタン。 サイドバーのバナーは、認知すらされない傾向が強い。 そもそもバナーとして押せるものではなく、デザイン上の飾りとして見られる場合も。 リストのマークとかのマーク部分をクリックしよーとする人が居る。 それにより、クリックできないと諦めるケースも。 プルダウン（ドロップダウン）型メニューは、近くのボタンを押
-
-
お偉方の説得に使えそうな、ウェブでROIを向上させた特徴的な事例 | Moz - SEOとインバウンドマーケティングの実践情報
自社サービスにウェブを導入する必要が本当にあるのかと聞かれたら、僕は、たいていの場合はイエスだと答えるね。宅配ピザのパパ・ジョンズ（PapaJohns.com）に関するAP通信の記事を見てみよう。 米国3位の宅配ピザチェーン店のパパ・ジョンズは5月7日、10億ドルの記録的売上を達成したと発表した。米国におけるオンラインでの売上が、1年あたり50％を上回る勢いで拡大したという。同チェーンの2001年におけるオンライン売上は総額2,040万ドルだったが、昨年は4億ドルに近づいた。 パパ・ジョンズによると、売上の20％以上がオンライン、あるいはテキストメッセージによるものだという。テキストメッセージによる注文方法は、昨年導入されたもの。同社は、テキストメッセージでの売り上げが期待どおりの業績を上げていると説明したが、具体的な数字は挙げなかった。 ワシントン地域でパパ・ジョンズのフランチャイズ店を
-
『ペルソナ作って、それからどうするの？』といっしょに読みたい参考文献：2.認知科学・UCD編: DESIGN IT! w/LOVE
不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 『ペルソナ作って、それからどうするの？』の第1章では、「デザインって何なのでしか？」という問題の整理をスタート地点にして、「ウェブの制作とデザイン」、「創造性とデザインの方法」、「ユーザーの行動とデザイン」、「ウェブサイトをデザインする際の境界線問題」と話を進め、現在のウェブデザインの問題点と課題を整理・指摘しています。 それを受けた第2章は「ペルソナ／シナリオ法とウェブデザイン」と題して、＜「誰のためのデザインなのか？」という疑問に対して「誰のどんな問題を解決するのか」を明示するデザイン手法がペルソナ／シナリオ法＞を紹介するとともに、「ユーザビリティとペルソナ」、「ユーザーエクスペリエンスとペルソナ」、「ペルソナを用いてインタラクション･デザインを考える」など、ペルソナ／
-
-
「OKボタン」は左にあるのが正しい事を、任天堂に教わってみる - 狐の王国
少し前だが、やっぱりOKボタンは右なんだよという記事が話題になっていた。 OKボタンは右か左かというのはけっこう議論になったり統計とってる人がいたりと尽きない話題なのだが、先日任天堂のWiiを使ってて「OKボタンは左が正しい」と確信するに至った。 Wiiにはショッピングチャンネルといって、Wii用のソフトウェアや昔のゲームが購入できる機能が搭載されている。いろんなソフトがある中、特定のソフトを選んでみると…… このような画面になる。 そして「購入する」ボタンを押す。 注意書きがあらわれる。OKが右側にあるのが見える。「次の工程へ進む」ためのボタンは右が基本なのは、やはりどこの環境でも変わり無いようだ。 OKを押すとさらに別の注意書きが現れる。ここでもOKは右側。 しかし次の画面で「はい」と「いいえ」が現れ、左側が「はい」になる。 この画面で「はい」を押すと購入が確定になり、プリペイドカード
-
-
予約ボタンを押してもらうための7つの鍵--旅行サイトに欠かせない要素とは？
8月のお盆に合わせて休暇を取る人も多いのではないでしょうか。最近は旅行代理店に行かずとも、インターネットで飛行機や電車、ホテルの予約ができるようになりました。ただそれは、はたして本当に「簡単」なのか？と突き詰めて調べてみると、どうやらそうとも言えないようです。ユーザーの不満を彼らの視線と共に検証していきます。 今回は被験者A〜Eの5名に、「お盆に旅行をするつもりでサイト内から予約をしてください」というタスクを与え、「Yahoo!トラベル」「楽天トラベル」「じゃらん」をそれぞれ利用してもらいました。 写真は「穴の開くほどじっくりと」 被験者Eは、沖縄ツアーを楽天トラベルの中で検討しました。「ビーチリゾート特集」のバナーより、楽天おすすめのホテル一覧ページへと遷移しました。 このページでは、ホテルによって、 A：ホテルに付随するプールの向こうに豪華な建物が見える写真 B：前面に海がありその彼方
-
Articles and Publications
Usability PublicationsPublished Materials from Microsoft's usability community. Below is a listing of published papers and presentations from Microsoft's Usability Engineers. For those citations where we have provided a link to the actual articles, please respect the copyright policies of the respective publishers. Publishers: ACM Copyright Notice, Microsoft Terms of Use
-
B2Bのユーザビリティ
ユーザテストは、ビジネス対ビジネス用Webサイトのユーザビリティが、一般的な消費者向けサイトよりも、かなり低いことを示している。もっと顧客転換率を上げたければ、ガイドラインに従って、商材を見込み客たちが楽にリサーチできるよう手助けするべきだ。 B2B Usability by Jakob Nielsen on June 1, 2006 多くのビジネス対ビジネス（ B2B ）サイトは、ユーザ体験の観念が 1990 年代で止まってしまっている。顧客たちのよくある疑問や関心に応えることに失敗し、彼らが取引先候補を探す作業の障碍となってしまっているのだ。 これらのサイトは、ウェブが企業と顧客の関係を逆転させたことに気づいていない。オンライン上でのインタラクションのほとんどは、要求主導型だ。訪問者の要求を満たすことができなければ、彼らが貴方のサイトを見捨てて競合サイトへ流れていくのを、眺めているしか
-
ユーザビリティコラム：Jakob Nielsen博士のAlertbox
コンテンツ戦略とUXライティング 2024年12月24日 読了までに約8分 コンテンツ戦略はコンテンツに関連するプロセスに焦点を当てる一方、UXライティングはテキストを通じてユーザーエクスペリエンスをかたちづくる。この2つの分野は協調して機能する。 このコラムについてUIデザイン・ユーザビリティ・UXデザインについて、その道の第一人者・ヤコブ・ニールセン博士（略歴）ら米Nielsen Norman Groupのメンバーが実例を交えて洞察するコラム『Alertbox』。その日本語訳を許可を得て公開しています。 チェックボックス：デザインガイドライン 2024年12月10日 読了までに約8分 チェックボックスは、ユーザーがリストから1つまたは複数を選択するか、あるいは何も選択しないことを可能にする要素である。チェックボックスは単独でも、チェックボックスリストや入れ子型のチェックボックスリストと
-
サイトを美しく魅せるゴージャスナビゲーション集:phpspot開発日誌
50 Gorgeous Navigation Menus | Vandelay Website Design サイトを美しく魅せるゴージャスナビゲーション集。 重厚で美しいデザインのナビゲーションの特集です。 Housing Works Nuttersmark Paiko Good Soh Tanaka 参考にしてエレガントなメニュー作りに役立てましょう。 関連エントリ ナビゲーション実装に使える、Ajaxライブラリ/サンプル集 階層ナビゲーション実装ライブラリ集 クールなナビゲーションメニューを作成するCSS＆HTMLサンプル CSSベースの超クールなナビゲーション集 CSSでdigg風のナビゲーションを実装サンプル
-
モバイルサイト構築前に知っておきたいユーザビリティ10のポイント（第1回） | モバイルサイト構築のユーザビリティいろは
端末特性に応じたユーザビリティの考え方最も身近で、どこでも気軽に使えるインターネット端末となった携帯電話。端末の急速な普及とハイスペック化にともない、携帯電話向けインターネットサービスによるマーケティングが各企業で本格的に取り組まれるようになっています。PC向けWebサイトと同様、携帯向けWebサイト（以降“モバイルサイト”）の構築においても当然、ユーザビリティの高いサイトを構築することが各企業のビジネスによい影響をもたらすことは必然です。 しかし、モバイルサイトでは、これまで各企業が構築・運用してきたPC向けWebサイトと比べると、画面サイズや1ページで表示できるページ容量制限、キャリアごとの違いなど、モバイルならではの制約があります。それらを踏まえたうえで、どうすればモバイルサイトでユーザーにメッセージを正確に伝えることができ、ストレスなく利用できるユーザビリティの優れたサイトを実現で
-
公式Twitter
- @HatenaBookmark
リリース、障害情報などのサービスのお知らせ
- @hatebu
最新の人気エントリーの配信
キーボードショートカット一覧
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Copyright © 2005-2025 Hatena. All Rights Reserved.
設定を変更しました