「誰でも使える」は「AIにも使える」―人間と機械の両方に読まれるための“アクセシビリティツリー”
近年、AIがWebを訪問し操作するエージェンティックWebが当たり前のものになりつつある。AIエージェントフレンドリーなWebサイト構築にどう取り組むべきか解説する。
7:05
Webアクセシビリティの取り組みが、AIの可読性を高めるというと意外に感じるだろうか?
「生成AI×マーケティングフォーラム2026」に、Webサイト制作会社として多くの企業を支援してきたミツエーリンクスの木達氏が登壇し、「『誰でも使える』は『AIにも使える』人間と機械の両方に読まれるためのアクセシビリティツリー」と題して、AI時代にWebアクセシビリティに取り組む意義について語った。

エグゼクティブ・フェロー(CBO) 木達 一仁氏
エージェンティックWebの到来
木達氏は冒頭で、生成AIをテーマとしたイベントでアクセシビリティを扱う理由について、次のように述べた。
“アクセシビリティツリー”は、Webコンテンツの機械可読性を高める仕組みのひとつです。従来は、Webブラウザーや視覚障害者の支援技術であり、Webコンテンツの情報や操作を提供するための基盤として利用されてきました。近年は、AIエージェントがWebコンテンツを読み取り・操作する際の手がかりとして注目されています(木達氏)
今、Web担当者がAIエージェントを意識せざるを得ないのは、AIがWebを訪問し操作するエージェンティックWebが当たり前のものになりつつあるからだ。
トラフィックのトレンドを調査できる米Cloudflare社の「Cloudflare Radar」によると、すでにグローバルで6割以上のアクセスがBot(機械)によるものになっている。また、米国のセキュリティ企業HUMANは、AIエージェントによるアクセスが対前年比7851%に達したと報告している。
AIエージェントとは、ユーザーに代わって購買・予約などのタスクを自律的に完了するAIシステムのことです。たとえば、Perplexityが提供するCOMETというブラウザーは、AI機能があり、自律的にユーザーに代わって操作ができます。AIエージェントは、皆さんのWebサイトにも訪問している可能性があります(木達氏)
AIエージェントフレンドリーなWebサイト構築のために
では、AIエージェントをおもてなしするにはどうすればいいのか。そのヒントになるのが、Googleが運営する「web.dev」にある、「エージェント フレンドリーなウェブサイトを構築する」というページだ。
この資料から、木達氏はAIがWebコンテンツを読み取る方法として以下の3つがあると話す。
- スクリーンショット(画像解析):見た目に依存するため信頼性が低く、トークンコストも高い。補助的に利用される。
- DOM(Document Object Model)ツリー:HTMLソースをベースにしたデータ構造。装飾用要素などAIが解釈するには、ノイズが多い。
- アクセシビリティツリー(ユーザー補助ツリー):意味的・構造的にノイズが少なく、見た目に左右されない。AIエージェントの読み取りに最も適するとされる。
つまり、AIエージェントに対応するための土台が実はWebアクセシビリティなのです(木達氏)
アクセシビリティツリーがAI技術との橋渡し役に
木達氏はアクセシビリティツリーについて、「DOMツリーをベースにWebブラウザーが内部的に生成するツリー構造(木構造)のデータ」と定義する。ツリー構造とは、親子関係を階層的に表現したもので、大本から枝分かれしていく様子を木に見立てている。
スクリーンリーダーや点字ディスプレイなど、視覚障害者の支援技術は、OSごとのアクセシビリティAPIを介して、アクセシビリティツリーから情報を取得しています。従来はWebコンテンツと支援技術の橋渡し役だったアクセシビリティツリーが、AI技術との橋渡し役としても注目されています(木達氏)
アクセシビリティツリーの生成プロセス
アクセシビリティツリーの生成プロセスは次のようになる。
- ブラウザーがHTMLを解析してDOMツリーを生成する。
- DOMツリーとCSSを組み合わせてレンダーツリー(画面表示用)を生成する。
- DOMツリーとCSSを組み合わせ、アクセシビリティツリーを生成する。このプロセスでは、CSS非表示要素や装飾的要素を除外(ノイズ除去)し、WAI-ARIAの情報を反映する。
WAI-ARIAとは、Web技術の標準化団体であるW3C(World Wide Web Consortium)のアクセシビリティ担当サブグループであるWAI(Web Accessibility Initiative)が策定する、HTMLだけでは提供できない役割・状態・性質をロール属性やARIA属性で補完する仕様のことだ。ARIAはAccessible Rich Internet Applicationsの略称だ。木達氏は、使い方を間違えるとアクセシビリティを下げるので、必須ではないと述べた。
また、ツリーが提供する主な情報に次のようなものがある。
- 役割(role):見出し・ボタンなどの役割
- 名前(name):ボタンであれば「検索」「送信」といった、要素の識別名
- 説明(description):名前を補完する詳細説明
- 状態(state):選択中/非選択、メニュー開閉などの状態
DOMツリーやアクセシビリティツリーは、Google Chromeのデベロッパーツールから簡単に確認できる。使い方の詳細は、「Chrome DevTools のフル ユーザー補助ツリー」を見てほしい。さらにChrome拡張「Accessibility Tree Explorer」を使うと簡単に確認でき、JSON形式でのファイル保存も可能だ。
アクセシビリティツリーの品質を上げるには
続いて木達氏は、アクセシビリティツリーの品質を上げる3つのポイントを紹介した。
その ① Lighthouseによる監査と対応
Chromeのデベロッパーツール内の監査ツール「Lighthouse」のレポート生成で、「エージェントによるブラウジング」カテゴリを選択して分析を実行すると、アクセシビリティツリーの問題点と修正アドバイスが出力される。必要があればそのアドバイスに基づいて対処するとよい。
詳細は「Lighthouse エージェントによるブラウジングのスコア」を参照してほしい。
その ② HTMLの品質向上
前述したようにアクセシビリティツリーは、HTMLから作成されるため、HTMLの品質が低いとアクセシビリティツリーの品質も下がる。品質を向上するには、Jens Oliver Meiert氏がHTML.mdのなかで提唱した、以下の3つを意識すると良い。
- 意味的に最も適切なHTML要素を使用する
- HTMLのコード量は必要最小限に抑える
- すべてのHTML出力をバリデータ(できればW3Cのもの)で検証し、エラーがあれば修正する
この3つを満たすことで、AIが読みやすいアクセシビリティツリーが作れます。特に、意味的に最も適切なHTML要素を使うことが重要です。HTML制作時点で要素を決めるのではなく、より上流の情報設計、原稿作成の段階で決めることが理想的です(木達氏)
その ③ WCAGの達成基準に基づく対応
W3CのWCAG(Web Content Accessibility Guidelines)に定義された達成基準には、アクセシビリティツリーに関わるものが複数ある。それらの達成基準を満たすことで、アクセシビリティツリーの品質も上げていける。木達氏は特にアクセシビリティツリーと関わりが深い達成基準として、次の4つをピックアップした(それぞれのリンク先は、ウェブアクセシビリティ基盤委員会の提供するWCAGの日本語訳)。これらに適合することで機械可読性を高めることができる。
- 達成基準 1.3.1 情報及び関係性
- 達成基準 1.3.2 意味をなすシーケンス
- 達成基準 2.5.3 ラベルを含む名前(name)
- 達成基準 4.1.2 名前(name)・役割(role)・値(value)
木達氏が考える機械可読性の未来
機械可読性の将来はどうなるのだろうか。木達氏が7月に執筆したコラム「WebMCP起点で考えた、GEO/LLMO時代のWebアクセシビリティ」では、「WebMCP」について取り上げている。
WebMCPとは、WebアプリやWebページがAIエージェントに対して実行可能な操作や機能を公開する仕組みであり、まだ仕様を策定している段階だ。
Chromeでは先行実装済みである一方、Safariの開発チームでは反対意見を表明している。その理由は、「AIにとって使いにくいということは、ページの見た目とセマンティクス(意味づけ)にギャップがあるからで、HTMLやWAI-ARIAで解決すべきである。そのほうが、ユーザー、支援技術、AIエージェントの三者すべてに恩恵がある」というものだ。
別の英文記事「Designing with web standards: The playbook for this AI moment」では、AI時代の混乱についても取り上げている。かつてブラウザーベンダーが標準化を軽視して、Webデザイナーが苦労した時代があった。その後、標準を守ろうというムーブメントがあり、混乱が収まったという経緯がある。そしてAI時代になり、再び同様の混乱が起きているという見方が示されている。
AI向けの新しい標準に向けて求められる議論への参加
木達氏は最後に次のように話し、これからのWebの使いやすさを目指して、議論への参加を呼びかけた。
AIエージェント、エージェンティックWebの時代において、機械可読性の高め方やAI向けの新しい標準が必要になっています。AIエージェントに対する最適化はまだ定まっていないので、皆さんにもぜひこの議論に参加していただけたら幸いです。
AI以前から、検索エンジンやブラウザーにとっての読みやすさである機械可読性は、意識すべき品質でした。そしてWebの利用状況が多様化するなか、コンバージョンを最大化し法令を遵守するうえで、アクセシビリティも高めるべき品質でした。
機械可読性を高めるうえで、どこまで機械に歩み寄るべきかはAIの進化、技術の進化とともに変わるため、議論が終わることはありません。だからこそ生身の人間のユーザーを忘れず、まずはユーザーニーズを第一に考えて、対応していくべきです。
誰でも使えるWebは、AIから「も」使いやすいという考えにぜひご賛同いただき、取り組みを進めてほしいと考えます(木達氏)