メガメニュー | Accessible & Usable
公開日 : 2014年5月12日 カテゴリー : アクセシビリティ / ユーザビリティ 「メガメニュー (Mega Menu または Mega Dropdown Menu)」と呼ばれる、面積の広いドロップダウンメニューがあります。情報量の多い大規模サイトを中心に、時折見ることができます。 メガメニューの例 : スターバックス (starbucks.com) メガメニューの例 : MoMA (www.moma.org) メガメニューの例 : LG (lg.com) JavaScript によるドロップダウンメニュー自体は昔からありましたが、それに比べると、メガメニューは以下のような特長があり、ファインダビリティの面で優れていると言えます。 サブメニューを二次元的に (縦だけでなく横にも) 展開できるので、たくさんのメニュー項目を、一度ですべて見渡せるように表示できる。 広い面積を活かして、情
ページ内スクロールエリアの是非 | Accessible & Usable
公開日 : 2010年8月4日 (2011年7月16日 更新) カテゴリー : ユーザビリティ / アクセシビリティ 今回の話題で採り上げる「ページ内スクロールエリア」とは、ブラウザの機能として標準装備されているスクロールバーとは別に、Webページの中で表示されるスクロール領域を意味します。下図のようなイメージです。 このようなスクロールエリアを用いると、情報をコンパクトに配置することができます。エリア内のすべての情報を見るにはスクロール操作が要るので、メニュー表示のように一覧性が求められる情報には適しませんが、たとえば、下図のような例を見かけたことがあるのではないでしょうか。 ページ内スクロールエリアは表示面積が限られるので、当該エリアの外側部分も含めて、ページ全体を見渡しやすくできるというメリットがあります。その一方で、ページ内スクロールエリアには、ユーザビリティやアクセシビリティの問
プログレッシブエンハンスメント（Progressive Enhancement）という考えかた｜ウェブユーザビリティ向上を支援するWebsite Usability Info
公開日 : 2010年6月6日 (2021年2月2日 更新) カテゴリー : アクセシビリティ 最近、プログレッシブエンハンスメント（Progressive Enhancement）という言葉をよく目にするようになりました。Webユーザーの増加、ユーザーの閲覧環境の多様化（パソコンだけでなく、携帯電話やスマートフォン、支援技術など）、ユーザーの抱える身体的状況の多様化（障害、加齢、怪我、など）、といった背景を踏まえて、より幅広く、多くの人が情報にアクセスできるようにすることを目指したWebサイトの開発理念です（Webアクセシビリティを実現するための技術的方法論のひとつとも言えますね）。以下、簡単にご紹介したいと思います。 基本的な考えかた あらゆるユーザーに対して、基本的な体験ができるようにします（たとえば、そのサイトが伝えたい情報には、どんな閲覧環境下にいるユーザーでもちゃんと到達できる
「ページが見つかりません」をどうユーザーに提示するか｜ウェブユーザビリティ向上を支援するWebsite Usability Info
公開日 : 2010年4月12日 (2012年8月13日 更新) カテゴリー : ユーザビリティ ページが存在しないアドレス (URL) にアクセスすると、「ページが見つかりません」といったメッセージが表示されるのを見たことがあると思います。いわゆる「Not Found (404エラー)」と呼ばれる現象です。 Not Found (404エラー) が起こる原因としては、以下のようなものが挙げられます。 サイト内でのリンク切れ (コーディングミスのほかに、サイト更新の関係でページを移動または削除したりすることによって生じることもあります)。 外部サイトや検索エンジン (SERPs) からのリンク切れ (主に、サイト更新の関係でページを移動したり削除したりすることによって生じます)。 URLの入れ間違い (ユーザーがブラウザのアドレスバーに直接URLを入力するときのタイプミス、あるいはURLを
ユーザーはちゃんとスクロールする？ | Accessible & Usable
公開日 : 2009年12月21日 (2011年1月11日 更新) カテゴリー : ユーザビリティ 456 Berea Streetという、主にWeb標準やアクセシビリティ、ユーザビリティに関する話題を簡潔にまとめて発信しているスウェーデン発のサイトがあります。その中に、「Don't fear the fold -- people do scroll」という興味深い記事がありました。Webユーザーはちゃんとスクロールしてくれるもだから、「fold」を恐れるな、というものです。 ここでいう「fold」とは、折り返しという意味ですが、もう少しわかりやすく言うと、Webページの情報のうち、ブラウザに表示される部分と表示されない部分の「境目」のことを「fold」と言います。スクロールせずに閲覧できる範囲のことをWebの業界では、「above the fold」または「first view」と呼んだ
パスワードは隠すべきか？ | Accessible & Usable
公開日 : 2009年7月26日 (2024年3月23日 更新) カテゴリー : ユーザビリティ ウェブユーザビリティの第一人者である Jacob Nielsen (ヤコブ・ニールセン) 氏が、自身のブログ記事「Alertbox」の中で、「Stop Password Masking」という興味深い問題提起をしています。通常、ウェブサイトなどでパスワードを入力すると、画面には入力された文字列が表示されず、代わりに文字の数だけ「黒い点」が表示されます。こうした状況は、「フィードバックをユーザーに提供し、システムの状態を視覚化する」という基本的なユーザビリティ原則に反している、というのです。 さらにニールセン氏は、パスワードを隠すユーザーインターフェース (UI) について、以下のように否定的な見解を述べています。 画面上でパスワード表示を隠したところで、本当にスキルのある輩は、入力しているユー
Ajaxは取り扱い注意 | Accessible & Usable
公開日 : 2009年4月19日 (2011年1月11日 更新) カテゴリー : ユーザビリティ Ajax（エイジャックス）とは、簡単に言うと、画面遷移（ページの切り替え）を伴わずに、ページの情報内容を変更させることができる技術です（詳しくは、Wikipediaの解説などをご参照ください）。 ユーザーの操作（クリックなど）のたびにサーバー側からのレスポンスを待つ（新しくページを切り替えて表示する）必要がないことから、使い勝手の向上が期待できます。また最近では、気軽にAjaxを実装できる「ライブラリー」と呼ばれるプログラムモジュールが多数出回っており、これを使うことでクールな（かっこいい）ユーザーインターフェースをWebサイト（ホームページ）に容易に実装できることも、Ajaxの特長と言えるでしょう。 ちなみにAjaxという概念は、「Asynchronous JavaScript + XML」
ALTAIR（アルティア）for Windows | Accessible & Usable
公開日 : 2008年5月14日 (2011年3月22日 更新) カテゴリー : アクセシビリティ 無料で使える音声ブラウザの例として、Firefoxのプラグインである「Fire Vox」について触れたことがありますが（ご参考：Fire Vox（Firefoxで音声読み上げ））、日本語の音声合成エンジン（SAPI5）が別途必要で、それ自体は無料で入手できない（MS Officeを買うか、SAPI 5対応の日本語音声合成エンジンが入っているソフトウェアを買うしかなさそう）ため、視覚障害者がWebサイト（ホームページ）を閲覧するには、エクストラなコストがかかってしまうではないか？という疑問を抱いていました（健常者にとっては、ブラウザ自体無料ですし、そう考えると、エクストラなコストがかかる時点で、アクセシブルでないような気がして...）。 そんな中、（恥ずかしながら最近になって）日本語の音声合成
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
