EC サイトやクチコミなどで、商品やサービスに対するユーザー評価を、星の数で示すことがあります。この星の数による評価 (star rating) の UI は、色のコントラストをはじめ、アクセシビリティがおざなりにされることが少なくないように感じます。この記事では、星の数による評価 (star rating) をアクセシブルにする方法について、解説します。| accessible-usable.net
「ダークパターン – 人を欺くデザインの手口と対策」を読みました。ダークパターンの現状、撲滅に向けての動き (主に欧州および米国における法規制)、今後の課題、がコンパクトにまとめられており、ウェブサイトやアプリケーションの UX 向上に携わる方にはぜひお手にとっていただきたい本です。| accessible-usable.net
ウェブコンテンツをダークモードに対応させる場合、単にデバイス (OS) の設定に連動させるだけでなく、ユーザーの任意で都度、モード (テーマ) を切り替えやすくしておくと、なおよさそうです。この記事では、ウェブコンテンツのダークモード / ライトモードを任意で切り替えるユーザーインターフェースについて検討してみたいと思います。| accessible-usable.net
パスワードのマスキングを解除する機能を、よくある実装 (input 要素の type 属性を password から text に切り替える) の代わりに、type 属性を password のまま維持した形で実装することの可能性と課題について、検討します。| accessible-usable.net
一般的なウェブサイトのフォームであれば、サブミットボタンは常時有効にしておくのが基本ですが、例外的なケースとして、あらかじめシステム側に反映されている情報を変更するようなフォームでは、サブミットボタンがデフォルトで無効になっているほうが、ユーザーにとって状況の認識が容易である可能性があります。| accessible-usable.net
私の監訳書「Form Design Patterns — シンプルでインクルーシブなフォーム制作実践ガイド」では、各章の冒頭で「この章で解説するフォームの完成形」としてデモページをご用意しておりますが、これまで Heroku で公開していたものを、このたび Render に移行しました。| accessible-usable.net
英国政府 (GOV.UK) が、「Designing for people with dyscalculia and low numeracy」という記事および啓発ポスターを公開しました。「数を扱うのが苦手な人を排除することなく情報を伝えるには、どうデザインすればよいか」がまとめられています。| accessible-usable.net
「ザ・ダークパターン — ユーザーの心や行動をあざむくデザイン」を読みました。ダークパターン (dark patterns) とは、「ユーザーをだまして何かを購入させたり、登録させたりするなど、意図しないことを実行させる、ウェブサイトやアプリで使われているトリック」のことを言います。最近では、「欺瞞的なデザイン (deceptive design)」と称されることもあります。| accessible-usable.net
多要素認証としてワンタイムパスワードの入力が求められることが珍しくなくなってきましたが、その入力欄が通常のパスワード入力欄と同様の実装になっているケースを時折見かけます。こうした実装は、ユーザビリティ (あるいは認知/学習障害のアクセシビリティ) の観点でいくつかの問題があります。| accessible-usable.net
ウェブサイトにおける情報探索の方法には、大きく分けて、ブラウズと検索があります。どちらを利用するかはユーザー次第ではありますが、ユーザー行動の基本的嗜好として、まずはブラウズが検索に優先すると考察することができます。| accessible-usable.net
認知および学習に障害を持つ人々にとって使いやすいウェブコンテンツの作りかたについて、W3C が Working Group Note を公開しています。| accessible-usable.net
ウェブのフォームにおいて、サブミットボタンをデフォルトで無効化しておいて、ユーザーの入力不備がなくなったときにボタンを有効化する UI があります。このような UI は、アクセシビリティやユーザビリティの観点で問題があります。| accessible-usable.net
「インクルーシブなペルソナ拡張」の英語版 (Inclusive Persona Extension) について、広く海外の UX デザイナーにも使っていただきたく Medium で紹介記事を執筆し、このほど UX Collective が運営する「Bootcamp」というパブリケーションに掲載いただきました。| Accessible & Usable
2018年にリリースしたデザイン支援ツール「インクルーシブなペルソナ拡張」について、このほど英語版を制作しました。また、今回の英訳に合わせて、日本語版も含めて、諸々アップデートしました。| accessible-usable.net
いわゆる「ハンバーガーアイコン」を押すとメニューを展開表示するインタラクションを備えたウェブサイトを昨今よく目にします。そのほとんどがオーバーレイでメニューを展開表示しますが、メニューの提示とその利用をモードレスかつアクセシブルなものにするには、インレイで展開するインタラクションを採用するほうが無難だと言えるでしょう。| accessible-usable.net
多くのウェブサイトは、サイト内検索機能を持っていますが、その検索結果ページにおいては、検索の入力欄 (検索窓) をページ冒頭など目に付きやすいところに残しておき、その中に入力済のクエリを保持しておくのが定石です。| Accessible & Usable
数 (人数、個数、年齢などのように数えたり測ったりできるもの) を入力させる UI コンポーネントとして、増減ボタンを押して値を入れることができる「ステッパー」があります。この記事では、ステッパーの利点や、アクセシビリティを担保した実装について、考えてみたいと思います。| accessible-usable.net
フォームのテキスト入力を補完するインタラクションとして、「オートコンプリート」があります。テキストボックスに文字をタイプし始めると、それに呼応して、タイプされた文字列と部分一致する入力値候補が一覧として提示され、ユーザーはその中から入力値を選択できるという、コンボボックス型のインターフェースです。とても便利で有用なだけに、この UI ...| accessible-usable.net