より重要になった、HTMLのアクセシビリティに関する問題を解決するChromeの拡張機能 -Alix

Post on:2017年3月22日

Alixの特徴

Alixは少し高度なCSSセレクタを使用したスタイルシートを適用するだけで、HTMLのアクセシビリティに関する問題を解決できます。
実際にどんなセレクタを使用しているのかは、前回の記事を参考にしてください。

スタイルシートを記述するのは時間がかかる、セレクタが難しい、という人でも大丈夫です。AlixはCSSでおこなうHTMLのLintツール「a11y.css」をブラウザから簡単に利用できるようにしたものです。

Alixを適用しているところ

表示ページに簡単に適用できます。

AlixはChrome対応の拡張機能で、無料で利用できます。
Chrome ウェブストアからインストールしてください。

インストールが完了すると、Chromeのツールバーから起動できます。

Alixのパネル

Language

メッセージの言語を選択できます。
残念ながら、日本語は未対応なので、「English」でよいと思います。

Minimum Notice Level

表示したいエラーの最小レベルです。
以下の4つのオプションから選択できます。

「Apply」ボタンをクリックすると、表示ページを判定します。