マークアップのいまいちな箇所を指摘してくれるブックマークレット -DiagnostiCSS

ブラウザで表示しているページのアクセシブルではないマークアップ、validでないマークアップ箇所を指摘してくれるブックマークレットを紹介します。

サイトのキャプチャ

DiagnostiCSS

DiagnostiCSSでチェックできるのは、以下の項目です。

  • インラインスタイル
  • 無効リンク
  • 空要素
  • 必須属性のない要素
  • 廃止予定の要素

ページで実行すると、赤い枠で囲まれます。

サイトのキャプチャ

altがないとか、インラインスタイルを使ってるとか。

サイトのキャプチャ

name属性がないとか。

DiagnostiCSSを利用するには、ブックマークレットなのでブラウザのブックマークに下記の「DiagnostiCSS」をドラッグして登録します。

サイトのキャプチャ

DiagnostiCSS

ブックマークにDiagnostiCSSを登録したら、あとはページを開き、ブックマークからDiagnostiCSSを選択するだけでそのページで実行されます。

top of page

©2017 coliss