使えるユーザビリティーガイドライン10 – creamu
遅いエントリーですが、Smashing Magazineで使えるユーザビリティーガイドラインがまとまっています。 ざっとご紹介しますね。 1. フォームのラベルはフィールドの上がベスト study by UX Mattersによると、フォームのラベルはフィールドの上が理想的とのこと。多くのフォームで、ラベルはフィールドの左に置かれ、2カラムのレイアウトになっている。いいデザインだが、最も使いやすいレイアウトとは言えない。なぜなら、フォームは一般的に垂直方向に並んでおり、ユーザーは上から下に向かって入力していく。ユーザーは視線を下の方向に向けていくのだ。そのため、ラベルが左にあるよりも、同じ方向にある方が認識しやすい。 2. ユーザーの視線は人の顔に向く Webページを見るとき、人の顔や目に視線が行く。マーケッターにとっては、注目を集める有効なテクニック。ユーザーは画像の中の人の視線が向いて
実用的なユーザビリティの10のポイント：ガイドライン編 | コリス
ユーザーにあなたのウェブページを容易で、そして楽しくアクセスできるようにする実用的なユーザビリティの10のポイント（ガイドライン編）をSmashing Magazineから紹介します。 Tumblr 多くのフォームは2カラムのレイアウトを採用し、ラベルはフィールドの左に配置されています。一見よさそうに思えますが、これは採用すべきではありません。 なぜなら、フォームは一般に垂直に方向付けがされているためです。ユーザーが左→右→左下と視線を動かすことより、上→下と移動する方が容易です。 また、ラベルを左に配置することはもう一つの問題があります。 あなたはラベルを右揃えと左揃えのどちらで配置しますか？ 左揃えはラベルを読みやすくしますが、どのフィールドのラベルか判断するのが難しい場合があります。 右揃えはその逆です。フィールドのラベルを判断するのは容易ですが、ラベルを俯瞰するのが困難です。 2.
ウェブサイトでやってしまいがちなユーザビリティのミス
ウェブサイトでやってしまいがちなユーザビリティの9つのミスをSmashing Magazineから紹介します。 9 Common Usability Mistakes In Web Design 下記は、その意訳です。 1. クリックできるエリアが小さい リンクのクリックできるエリアが小さいと、ユーザーはクリックするのが非常に困難です。 解決方法 リンク箇所にpaddingなどを設けて、クリックできるエリアを大きくします。 2. 間違った目的のためのページネーション ページネーションは、内容を複数のページに分ける時に使用します。 しかし、最近ページビューを増やす目的でページネーションを設置しているサイトがあります。これには問題点が2つあります。 一つ目は、1つのコンテンツを読むのにページをロードしなくてはならないこと。二つ目は、SEOと関係があります。ページのインデックス付けを行う際、ペー
UIデザインガイドラインのまとめ : could
UIUXガイドライン UIデザインガイドラインのまとめ デザインガイドラインは、実際同じようなガイドラインを作るときだけでなく、UIデザインを考える際にも役立つ貴重な資料です。今まで個別で紹介したことはありますが、今回は一挙にまとめてリストアップしてみました。 Introduction to Apple Human Interface Guidelines 個人的に UI デザインガイドラインといえばこれ。日本語訳も大変便利です Apple User Experience Guides ソフトウェア開発向けですが、イントロダクションあたりは参考になります iPhones Human Interface Guidelines 会員登録すると見れる PDF 資料ですが、上記のリンクからブラウザ上で観覧することが出来ます Windows User Experience Interaction G
星野リゾート、旅館サイト改良で予約数8割増：日経ビジネスオンライン
気になる記事をスクラップできます。保存した記事は、マイページでスマホ、タブレットからでもご確認頂けます。※会員限定 無料会員登録 詳細 ｜ ログイン
ウェブサイトの第一印象を決める大切な21のポイント
ウェブサイトの第一印象を決める大切な21のポイントをVandelay Website Designから紹介します。 21 Factors that Influence the First Impression of Your Website's Visitors 下記は、それを簡潔にした意訳です。 ロード時間 ロード時間はユーザーをいらいらさせる大きな要因です。少しでも早くロードするように設計をします。 エラーメッセージ エラーメッセージが表示されアクセスができないと、ユーザーは二度とアクセスをしないでしょう。 カラー サイトのデザインは第一印象の重要なファクターです。正しいカラーコンビネーションを使用して、効果的で適切なカラースキームを使用します。 ロゴ もう一つ重要なファクターはロゴです。ブランディングを考慮し、信頼感を与えるロゴを使用します。 ヘッダ ヘッダも強い印象を与えます。魅力
会員登録フォームを構築するポイント | ランサーズ社長日記
いいね！ 11 ツイート B! はてブ 734 Pocket 58 ここ2・3日、ひたすら色々なサイトの会員登録フォームやコマースサイトの購入フローを見ていました。 また、フォームのユーザビリティについて語っているブログやサイトをみて研究していました。 こうすれば登録数が劇的に上がる！とか、売上が上がる！といった方法はありませんが、少しだけユーザーに安心感を与えたり、ストレスを取り除いたりする方法はたくさんありますし、見ていたサイトでも登録しやすいサイトには共通点が多くありました。 少し量が多いですが、自分で意識的に行ってきたこと、登録しやすいサイトの共通点、ブログやサイトをみて参考になる点をまとめてみました。 1つ1つはよく言われていることで、大したことありませんが、こういった小さなディティールにこだわって行きたいと思います。ケースバイケースの側面も強いのですが、何かの参考になればと思い
やっぱり[OK]ボタンは右なんだよ - ぼくはまちちゃん！
こんな話題はいまさらかもしれない！ それはわかってます！ だけど書きたい！ なにって、[OK]ボタンの位置のことです！ これって右に置くのが自然だよ絶対！！ 理由は単純で、 [OK][キャンセル] は、画面によっては [保存] [取り消し] だとかに名前を変えるし、 さらに、入力が3ページあるようなウィザード形式の画面なんかだと、 [ここまでOKそして次の画面へ]、[間違ったかもしれないから前へ戻って修正] とかになっちゃう。 うん、このウィザード形式の時のことを考えるとわかりやすい！ ウェブは横書き！ 左から右に読む！ 左からやってきたんだから、[戻る] のは左！ 右に進んでいくんだから、[進む] のは右！ だから、[次へ] も [保存] も [OK] も右が自然！ ウィザードっぽい画面の時と他の画面の時とで 「OK的なもの」の位置がぶれていると、少し迷うよね。 だから[OK]は右に統一
![やっぱり[OK]ボタンは右なんだよ - ぼくはまちちゃん！](https://cdn-ak-scissors.b.st-hatena.com/image/square/281b1fd51f0e3fedc726435362724c3af4fce817/height=288;version=1;width=512/https%3A%2F%2Fogimage.blog.st-hatena.com%2F13208692334729888519%2F26003855888873578%2F1550052661)
第11回 PCサイトとこんなに違う！携帯サイトのフォーム設計ポイントとは | ユーザー視点のウェブデザインガイド
その半面、携帯サイトの設計については、PCサイトとは異なるユーザー特性があるにもかかわらずノウハウは少なく、中規模以上のサイトであっても「とりあえず作っただけ」のサイトや、やみくもに見た目だけを新しく装ったサイトが多いのが現状である。 今回は、携帯サイトの設計、その中でも特にビジネス成果に直結するフォームについてピックアップし、携帯ユーザー特有の行動に対していかに対応すべきかを考えてみたいと思う。 さて、複数のブラウザを立ち上げて、画面を切り替えながら操作が可能なPC環境と違い、モバイル端末では一度サイトから離れると、戻ってくるのが非常に大変である。そのため、携帯サイトのフォーム登録はPC以上に「一発勝負」であることを強く意識する必要があるだろう。 まず、ユーザーの入力負荷を減らし、自動入力が可能な部分は可能な限り実装するなどの配慮を欠かさないようにする必要がある。さらに、「携帯特有の機能
40分でできるホームページ診断 ～最低限クリアしたい40項目のチェックシート | Web担当者Forum
40分でできるホームページ診断 最低限クリアしたい40項目のチェックシート［訪問者目線編 2008年版］ SEO？ ユーザビリティの向上？ それ以前にしなきゃいけない「サイト作りの基本のキ」を、あなたのサイトではちゃんとできているだろうか？ 高度な施策に目を向ける前に、最低限クリアしておきたいチェックポイントをまとめてみた。あなたのサイトは何点とれるだろうか？ TEXT：編集部 協力：株式会社 環 ウェブサイト作りの基本のキSEOやユーザビリティに限らず、キーワード広告、アクセス解析、LPO、リッチインターフェイスなど、サイトの効果をアップさせる手法はさまざまあり、Web担でも詳しく解説してきている。 しかし、そういった施策にコストを割く前に、現状の自社サイトが、訪問者が「あれれ？」とマウスをうろうろさせてしまうような状態になっていないか確認したことがあるだろうか。 そんなあなたのために、
ユーザビリティの大切さに気づいてもらう - inucaraの日記
こないだの「インターネットってどういう仕組みで動いているの？」に書いた事前研修でユーザビリティの大切さについても話したいと思って簡単なフォームを作ってみたよ。 想定ターゲットはユーザビリティのユの字も知らないような人や、これからウェブサイトの設計、構築の仕事をしようとしている人。これらの人にユーザビリティの大切さに気づいてもらうために、前回と同じように話す内容をとりあえず書いてってみる。 ちなみに前回のインターネットの仕組みからユーザビリティって話が飛んでるけど、そういうことは気にしないで思いつくことをメモ的にどんどん書いてって、流れは最後に考えようかなって感じ。 じゃあ、さっそく始める！ ユーザビリティって何？ まず始めに、みんなは「ユーザビリティ」って言葉は聞いたことあるかな？ 日本語で「使いやすさ」って意味なんだけど、利用者がいかにストレスなく、便利で簡単で直感的な操作ができるか、っ
ウェブサイトを使いやすくするための43の法則
R6K.Net Pressにエントリーされている「あなたが避けるべきウェブデザインの43のミス」の意訳です。 43 Web Design Mistakes You Should Avoid 上記エントリーによると、よく見かけるデザインのミスリストは10個くらいが通常ですが、それでは足らなく、増やしていくうちに43個になったそうです。 43の法則は、常識として浸透しているものもあれば、論争になるようなものもあります。 個人的には、いくつかは条件しだいでと思いますが、概ね相違無いです。 The user must know what the site is about in seconds. サイトに来訪したユーザーは、数秒で何のサイトか知らなくてはいけません。 Make the content scannable. コンテンツが一覧できるリストが必要です。 Do not use fancy
Business Media 誠：「ブラウザの文字サイズ最大」が半数以上――家庭用PC
テレビで見た話題をYahoo!で検索したり、ネットショッピングで買い物をしたり……かつて“仕事の道具”だったPCはすっかり日常的な存在になり、家庭にも当たり前に入り込んでいる（9月10日の記事参照）。 ところで家庭では、みんなどのような環境でPCを使っているのだろうか。 コンサルティング会社のブライト・ウェイは9月7日、「家庭でのPCの使用状況、設定について」アンケート結果を発表した。調査期間は2007年8月1日から8月31日までで、同社が運営する子育て支援サイト「こそだて」で実施したもので、回答数は516人（男女比24：76）。 調査によれば、家庭で使用しているPCは、デスクトップが51.8％、ノートPCが47.1％だった。ディスプレイの画面サイズは、14～15インチ程度（ノート）が34.1％で最も多く、次いで17インチ程度（デスクトップ）21.8％だった。デスクトップを含めると、14～
第7回 コンテンツの魅力を引き出すユーザーフレンドリーなウェブライティングのコツ | Web担当者Forum
第7回 コンテンツの魅力を引き出す ユーザーフレンドリーなウェブライティングのコツ 現実の店舗や窓口では、目の前にいるお客が困っていればすぐにわかるし、同じトラブルが重なれば問題がおきないように施策をとる。しかし、ウェブサイトを作っているときにはお客は目の前にいないし、公開後にお客の対応をするのはウェブサーバーやスクリプトという機械だ。そのため、現実の商売では当然のように行っている接客ができない、いや忘れてしまってはいないだろうか？ 今木 智隆（株式会社ビービット） コンテンツの価値を確実に伝える ウェブライティングの基本6大原則とは「Content is King」という言い回しを見聞きしたことはあるだろうか？ これは“音やグラフィックなどの表現法より、提供する情報の中味がまず第一である”という格言であり、ビル・ゲイツも引用しているほどだ。最近は、SEOやLPOを筆頭とするさまざまな「ノ
僕が購読している英語ブログ（主にWebデザインやユーザビリティ）を簡単な説明入りで全部公開します。 - Trans
id:elastic965kさんから疑問を投げ掛けられたので、その質問に答えるためのエントリーです。僕が購読している英語ブログの一覧とその概要を簡単に書いておきます。 追記（2007年8月28日21時）：はてなのアンテナにもいくつかエントリーを入れているのを忘れていましたので、文末に追加しておきました。 このエントリーの動機と英語ブログに対する考え方 id:elastic965kさんから先のエントリーの英語ブログを訳すための5つの私的なコツに対するはてブのコメントで、 id:aratako0さんはよく英語の記事を訳されているようだけれど、どんなブログを読んでいるのか知りたい。 とのご質問を受けたので、僕が読んでいる英語ブログを全部公開しておきます。主に僕の好きな分野であるWebデザインやユーザビリティなどが中心です。 そもそも僕はNPO法人で働いていて、例えば朝礼なんかで「昨日公開されたあ
未経験者がユーザーテストを行う際の10のポイント - livedoor ディレクター Blog
こんにちは、ディレクターのほうの谷口です（余談ですが、ライブドアには3名の谷口がいて、私はプログラマーじゃないほうの谷口です）。今回は、ユーザーテストについてお話したいと思います。 ユーザーテストは、ウェブサイトの新規立ち上げやリニューアルの際、ユーザーがウェブサイトやプロトタイプを実際に操作してもらう様子を目の当たりにすることで、問題点を発見する方法です。 ライブドアのサービスは、作る側とユーザー像が近いことが多かったので、頻繁にはユーザーテストをしてきませんでした。しかし、今後は自分たちと違うユーザー像も対象としていきたいことから、ユーザーテストの数を増やしていきたいと思っています。 ユーザーテストの専門会社に頼むという手もあり、そうすることで厳密に調査をしてくれます。しかし、ポイントをしぼって外注せずにすむ方法もあるので、ここに紹介します。 1. 被験者は友人か知り合いでいい 専門会
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
ウェブサービスを作るときはBlank Slateを工夫しよう | IDEA*IDEA
https://www.openvista.jp/archives/note/257/?257/
サイト解析を使ったユーザビリティを収益に変える為のまとめ*ホームページを作る人のネタ帳
