アクセシビリティメモ

アクセシビリティに関する個人的な覚書を増やしたり減らしたり。

CMS関連

WordPressのテーマについて

アクセシビリティ（Codex）

accessibility-readyタグのついたテーマ

• 必須
• 推奨
• リソース

role

各部分の役割

• role="banner" == header
• role="main" == main content
• role="complementary" = sidebars
• role="contentinfo" = footer
• role="search" = search form
• role="navigation" = navigation menus

twentysixteenのアクセシブルな箇所覚書

screen-reader-text

<a class="skip-link screen-reader-text" href="#content"><?php _e( 'Skip to content', 'twentysixteen' ); ?></a>

画面には表示されないが、画面読み上げソフトウェアで読み上げられる。

制作には関係ないけれど覚書

管理画面内の「外観」にある「ウィジェット」機能は通常ドラッグ・アンド・ドロップで行う。

「アクセシビリティモード」を有効にするとドラッグ・アンド・ドロップが使用できなくなる。

各ウィジェットの横に「追加」が表示されるようになる。

make.wordpress.org/accessibility
wordpress.tv/tag/accessibility

concrete5のテーマ

レスポンシブでアクセシブルなテーマ「Flower」

（通常concrete5のブロック追加はドラッグ・アンド・ドロップなわけですが、「エリア名」をクリックした後、追加したいブロックをクリックするとブロックを追加する方法もあるのは、こういうときのためのものなのだろうか。）

機能

• アクセシビリティの向上に。文字サイズ変更と色反転ができるjQueryプラグイン作った。
• テキストサイズを変更する、TextSizeController.js。

ブックマーク

• 総務省ウェブアクセシビリティページ
• みんなの公共サイト運用ガイドライン
• ウェブアクセシビリティ基盤委員会　公開資料＆リンク集

WAI-ARIA

恥ずかしながら正直WAI-ARIAってまだtwitterのTLとかでよく聞くな・・・？！位の認識しかありません・・・。がんばる

• Accessible Rich Internet Applications (WAI-ARIA) 1.0
• Using WAI-ARIA in HTML（日本語訳）
• ARIA Techniques for WCAG 2.0（日本語訳）

各種チェック

マークアップ

• アクセシビリティチェック
• HARETTA
• Web Accessibility Toolbar 2012J［ベータ版］
• OpenAjax

カラー

• カラー・コントラスト・アナライザー 2013J

ブログ

• Web Accessibility Advent Calendar 2013 （各基礎をおさえたいのであえて2013年のものを・・・＾＾；）