日立コンサルティング 公共コンサルティング本部の岡山将也マネージャー、サイボウズ グローバル開発本部 東京第2開発部 小林大輔氏、ツルカメの森田雄代表取締役社長・UXディレクターによる対談の後編。アクセシビリティ向上の基本となる“Webの構造化”と、そのメリットについて語り合う。
タイトルや見出しなど、ページの内容をきちんと構造化したHTMLのテンプレートを使うだけで、一定のアクセシビリティは確保できますよね。例えば、音声読み上げソフトで見出しだけを読み上げるといったことができるようになったり。
森田氏 そうですね。でも国内の多くの会社では、構造化されていないテンプレートがまだまだ使われています。テンプレートを構造化されたものに変えることはそんなに面倒ではないはずです。でも、「見た目が変わらないのに作り直す」ということにはなかなか予算が出ない。
Webページの制作を請け負うベンダー側の能力も関係していると思います。個人的には、本来は要件定義書に入っていなくてもアクセシビリティに配慮したテンプレートを作るべきだと思うんですけど、それができていない。さらに顧客企業がテンプレートを修正しようとすると、検証のやり直しが発生するとかいった理由で多額の見積もりが来たりします。それで予算を超えてしまってできない、とか。
僕がクライアント先でWebのコンサルティングやデザインをするとき、こういうことが障壁になることがよくあります。Webの担当者レベルではやりたい人が多いのに、最終的にお金がなくてできない、ということですね。
新規にWebサイトを作ったりCMS(コンテンツ・マネジメント・システム)を導入したりする際には特に、どこにお金を使うべきかをよく考えてほしいなと思います。構造化されたHTMLを出力するCMSと、そうでないCMSを比べて、前者の方がコストが高くつく、ということはないはずです。それに、構造化されていた方がWebページのテストがしやすいはずなので、最終的に安く済むでしょう。
ボタンは「button」タグで作ろう
小林氏 構造化することの意義が知られていない、というのもあるでしょうね。例えばWebページ上に配置するボタン。「<button>」タグを使って実装すれば、音声読み上げソフトも「それがボタンである」と読み上げてくれます。
でも、そうじゃない実装が普通に行われています。例えば、個別にデザインを指定する「<div>」タグを使って、「<div class="button">」みたいに書く方法ですね。目で見てボタンが表示できているし、実際にクリックもできるので、それが問題だということを知らないパターンが多いんじゃないかという気がします。