キーボード操作を意識したHTML/CSSコーディング
この記事は 「Webアクセシビリティ Advent Calendar 2020」 5日目の記事です。 アクセシビリティ Advent Calenderの記事を寄稿するにあたり、少しの工夫であらゆるユーザーに対して優しいWebサイトを作れるようなHTML/CSSコーディングの方法についてまとめました。より多くの人にとって優しい・使いやすいWebサイトを作ることは訪れてくださるユーザーの方々だけでなく、クライアントにとってもユーザーの機会損失を防ぐことができるので多大なるメリットがあります。（よくコードが適当でもデザインが見えていれば良いって意見を聞くけれどそんなことはない） ただ、アクセシビリティを意識したHTML/CSSコーディングについてのまとめだと内容量が非常に多くなりZennなら記事より本で出したほうがベターになってしまうので、今回は数あるアクセシビリティの視点から「キーボード操作で
ColorTester - JIS X 8341-3:2010 (WCAG 2.0)の達成基準に基づき背景色と前景色のコントラストのチェックを行うソフトウェア - アルファサード株式会社
2020年3月18日 : macOS 64ビット対応版を追加しました。 このソフトウェアは2色のコントラスト比を計算し評価するツールです。コントラストの評価はJIS X 8341-3:2010 (WCAG 2.0)の達成基準に基づきます。 画像ファイルをウィンドウにドラッグ&ドロップ(※)することで、画像の背景色と前景色を自動的に推測し、評価を行う機能があります。またはクリップボードのピクチャから色を取得して評価を行うこともできます(自動取得した色は正確でない可能性があります)。 ※macOSではWebブラウザから直接ドラッグ&ドロップできます。Windows版ではMozilla Firefoxのみドラッグ&ドロップに対応しています。 コントラスト比 - ウェブ・コンテンツ・アクセシビリティ・ガイドライン (WCAG) 2.0 コントラスト比 (L1 + 0.05) / (L2 + 0.0
macOS Safari の Tab キーでフォーカスがフォーム以外に当たらない。キーボード操作を許可するためには？
アクセシビリティの「ガイドライン 2.1 キーボード操作可能」に対応するために ガイドライン 2.1 キーボード操作可能: すべての機能をキーボードから利用できるようにすること。 Web Content Accessibility Guidelines (WCAG) 2.0 こちらに対応するためには、このままでは困ります。 キーボードの TAB キーを押下した時に、クリッカブルな要素だったり、フォーム部品だったりにフォーカスが移動してマウスを使わなくてもウェブサイト内を操作移動できるようにしておく必要があります。 Safari 環境設定でキーボード操作可能に macOS の Safari はデフォルトの環境設定では、フォーム部品且つテキストボックスとブラウザの URL 入力する窓にしかフォーカスが移動されないようです。 ラジオボタンとか、サブミットボタンとかもですよ。 （Safari の）
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
