ホームページのトップで自動的に切り替わる画像について、読む人が止めたり前の案内に戻ったりできるように見直す方法を解説する。停止やキーボード操作の確認手順、見学会などの重要な案内をスライドの外にも置く考え方を含む。
シェアックリップ
シェアされたアックリップです。
そのほかの #キーボード操作 ピックアップ
クリックできる要素が <button> で作られているか、<div> などで代わりに作られていないかを確かめる方法を解説する記事である。<div> は、自分で補わない限り、Tab キーで移動できず、スクリーンリーダーにもボタンとして伝わらない。
レスポンシブなレイアウトで CSS の order や column-reverse によって見た目の順番だけを変えると、キーボード操作と読み上げの順番が見た目と食い違うことを解説する。HTML の論理的な読み順を保つべきだと論じる。
開発中のプロダクトの作業を公開するとき、1つの操作をキーボードだけで試し、開始状態・フォーカスの移動・結果を記録して共有する方法を解説する。確認した範囲と確認しなかった範囲も明記する。
モーダルダイアログのフォーカス管理を解説する記事。フォーカスをダイアログ内に閉じ込める実装と、閉じたあとに元の要素へ戻す挙動を扱う。HTML の dialog 要素を使えば、背景の操作を止める処理を自前で書かずに済むとする。
Fluent UIのReact v9とWeb Componentsが、Shadow DOMやPortal、ダイアログでフォーカスやキーボード操作をどう扱っているかを、公式ドキュメントとソースで確かめながら論じる記事である。UIライブラリの設計判断が主題である。
専門家のいないチームが取り組めるよう、WCAG 2.2の87項目から実害の多い7項目を絞った記事。キーボード操作、ラベル、代替テキスト、コントラスト、見出し、色以外の手がかり、フォーカスの表示を扱う。