「WebInspector Pro」は、Webページのソースをチェックして、アクセシビリティを診断してくれるソフト。問題点の解説表示機能はもちろん、ソースコードの問題個所をその場で編集したり、プレビューを確認したりといったことができる。

メイン画面は上下の2ペイン構成。上段はHTMLソースの編集エリア。HTMLタグ挿入用の各種コマンドが用意され、HTMLタグを直接編集できる。編集エリアの表示（タグや属性値の文字色など）や、挿入タグはオプションで変更することができる。下段は「ユーティリティエリア」と呼ばれ、

• アクセシビリティチェック
• イメージ一覧
• プレビュー
• ガイドライン

「アクセシビリティチェック」はその名の通り、HTMLファイルが万人にとって使いやすいかを確認できる機能。実行すると、問題個所と「何が問題か」が具体的にリスト表示される。問題点の重要度は「修正必須」と「場合により問題あり」に分類されるほか、ソースコードの行番号、ガイドライン（富士通ウェブ・アクセシビリティ指針に準拠）の項目番号などが表示される。チェックで使用するガイドラインの種類やチェック項目はオプションで自由にカスタマイズできる。

結果リストの項目をクリックすると、編集エリアのカーソルがソースの問題個所にジャンプして、直ちにソースコードを編集できる仕組み。Webブラウザを起動して、問題個所を含むページをプレビューすることも可能だ。ページ上の該当部分には枠線が点滅表示し、問題個所を容易に確認できる。

「イメージ一覧」は、HTMLファイルから参照されている画像の「ソース上の行番号」「画像ファイル名」「代替テキスト（ALTタグ）の内容」「ファイルのパス」を一覧表示するもの。任意の画像のプレビュー表示や、代替テキスト編集などを行うこともできる。

「プレビュー」では、現在読み込んでいるHTMLファイルをプレビュー表示する。「ガイドライン」は、アクセシビリティチェックの基準となる「富士通ウェブ・アクセシビリティ指針」を表示するものとなっている。

そのほかにも、

• ガイドラインチェックの結果をHTML化してブラウザで表示
• HTMLソースの印刷
• ColorSelector

「WebInspector Pro」の売りは、このアクセシビリティを実際にチェックしてくれる上に、プレビュー機能付きのエディタで即修正できるという点にある。アクセシビリティの重要性を頭では理解しているつもりでも、ほかのパソコンやブラウザで表示してみる機会がないとなかなか気づかない点も多いので、このように具体的に指摘してくれるのは大いに助かる。

便宜上、「HTMLソースをチェックする」という書き方で説明してきたが、実はスタイルシートにも対応していて、しかも参照先の外部スタイルシートまでチェックしてくれるのは当たり前といえば当たり前だが、やはりすばらしい。今回筆者がテストした例でいうと、外部スタイルシートで文字サイズや行間隔を固定にしていた個所が要注意ポイントとして指摘された。ブラウザ側で文字サイズを変更できないと視覚障碍者の方にとって不便な場合がある、というわけだ。

そのほかにもColorSelector機能は特筆したい。判定基準として白内障や色覚についてのオプションがあり、文字色と背景色の組み合わせによっては利用者に不便を強いることを教えてくれる。これは、実体験できないだけに貴重なアドバイスといえる。

もちろん「WebInspector Pro」の基本はチェック機能であり、実際にアクセシビリティを改善するにはHTMLやスタイルシートの知識が必要となる。特に普段WYSIWYGタイプのHTMLエディタを使っている人にとっては敷居の高い部分もあるだろうが、Web制作に本格的に取り組む人なら、ぜひ揃えておいてほしいソフトだ。

一方、アクセシビリティの高いホームページを構築するには「理解や知識が必要」「効果的な支援ツールがない」「作成途中や完成時の評価が難しい」といった課題がありました。

当社は、こうした状況をふまえ、ウェブ・アクセシビリティの診断・修正ツール「WebInspector Pro」を開発いたしました。

製品の特徴
「WebInspector Pro」は、ウェブ・アクセシビリティの診断、問題点の修正の機能を備えています。アクセシビリティの高いホームページ構築に最適なソフトウェアです。診断から問題点の修正に特化したシンプルな操作インタフェースで、診断結果から検出された問題の内容理解、対処方法の確認、効率的な修正が可能です。

特徴（1）：各種規格・指針に対応したアクセシビリティ診断ができます
本製品は、「JIS X 8341-3」「みんなの公共サイト運用モデル」「富士通ウェブ・アクセシビリティ指針」にもとづいてHTML/XHTMLソースの診断を行い、アクセシビリティの問題点を検出します。

特徴（2）：ガイドラインの表示により、問題点と対処を理解できます
アクセシビリティのガイドラインを表示して、問題点の検出だけでなく問題の詳細と対処方法を確認することができます。これにより、ホームページ作成者が問題内容を理解し、知識を習得することができます。

特徴（3）：問題点を効率的に修正することができます
画像の代替テキスト（ALT属性）の付与や修正を効率的に編集することができます。ページ内のすべての画像を一覧表示し、プレビュー画面により画像内容を確認しながら代替テキストを付与することができます。