タグ

Web制作とユーザビリティに関するbasementjaxxのブックマーク (5)

  • U-site

    日記調査:長期間のユーザー行動と体験の理解 ニールセン博士のAlertbox 8月9日 読了までに約15分 参加者は日々の活動をその都度記録し、リアルタイムのユーザーの行動やニーズについてコンテキストに基づいた知見を提供する。 このサイトについて UXリサーチや市場調査の手法やコツ、結果や知見を紹介しています。 詳細 新記事公開は、Twitter・Facebook・RSSで随時、メルマガで月1回通知します。 Twitter Facebook RSS メルマガ YouTube、始めました 黒須教授のユーザ工学講義 7月25日 読了までに約5分 2024年5月にYouTubeチャンネルを開設し、そこで「黒須のユーザ工学入門」を連載することにした。講演や講義とは違ってもっとオープンにして、広い範囲の人たちに話を届けたいという気持ちがあったのだ。

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

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

  • チェックボックスやinput要素などのフォーム周りのユーザビリティを少しだけ向上できる地味に便利なjQueryコードいくつか - かちびと.net

    フォームで利用するjQueryのスニペット コードをいくつか。どれも既出だと思う のでおさらいという事で。とはいえ、所詮 はスニペットですので実際に導入する際 は動作をしっかりと検証する事を強く 推奨します。 フォーム周りのjQueryスニペットです。自分用のメモも兼ねて。 フォーム関係は色々面倒なので参考にならない事もあるかと思います。「ふーん」程度にご覧頂くと丁度いいと思います。 Placeholder属性を、非対応ブラウザでは表示/非表示に 便利なHTML5のPlaceholder属性をオールドブラウザでは表示/非表示として対応します。 if(!$.support.placeholder) { var active = document.activeElement; $(':text').focus(function () { if ($(this).attr('placeholde

    チェックボックスやinput要素などのフォーム周りのユーザビリティを少しだけ向上できる地味に便利なjQueryコードいくつか - かちびと.net
  • 効果的なナビゲーションを設計する5つの大切なポイント

    How To Design Effective Navigation Menus [ad#ad-2] 下記は各ポイントを意訳したものです。 Positon -ポジション Simplicity -シンプル Wording -ワーディング Color -カラー Icons -アイコン [ad#ad-2] Positon -ポジション ナビゲーションをページのどこに配置するかは、非常に重要です。 ユーザーがページを見る際にある特定のパターンがあります。ユーザビリティの大家ニールセンによるFパターンが有名です(F-Shaped Pattern)。これは、ユーザーがページを走査する際、上部と左部に(Fの文字のように)フォーカスを合わせるというものです。 こういったパターンを理解し、それがどのように機能するかを学び、何を期待するべきかのアイデアを得るために使います。数多くのサイトを見て、ユーザーに配慮

  • スマートフォン向けのサイトデザインでとっても大切な5つのポイント

    J Taylor Design スマートフォンにおいて、スクリーン上のクリック(つまりタップ)無しに使うことは考えられません。ナビゲーションはユーザーが必要とすることが得られるように、明確な進路を与えるべきです。 ナビゲーションで重要なことは二つ。 まず、ナビゲーションが視覚的にタップ可能に見えるか確認してください。見た目をボタンやリストのようにしたり、矢印などを加えてもよいでしょう。ただし、スマートフォンではtitleのテキストをホバーで表示したり、ホバー時のエフェクトを適用できないので、それ無しでも押すことができるように見えることが大切なポイントです。 もう一つの重要なことは、ラベルです。 「戻る」というラベルがあれば、ユーザーは戻ることを期待します。これは当たり前のようですが、ユーザーにとってラベルが何を意味するか分かることを確認してください。 ラベルを有意義にするポイントは、シンプ

  • 1