MENU
CLOSE
AIディレクションユーザビリティ Edit : 2025.02.06 Update : 2025.01.30
【ChatGPT】AIを使って既存サイトのウェブアクセシビリティを改善する方法

【ChatGPT】AIを使って既存サイトのウェブアクセシビリティを改善する方法

企業や個人が運営するウェブサイトにおいて、アクセシビリティの向上は重要な取り組みです。
多くのユーザーが快適にWebサイトを利用できるようにすることは、企業価値の向上や検索エンジンでの評価にも直結します。

そこで本記事ではChatGPTを改善案を提示するサポートツールとして活用し、既存サイトのウェブアクセシビリティを改善する方法を紹介していきたいと思います。


①ChatGPT o1へ以下のプロンプトを投げる。

まずは、ChatGPTに正確な情報と明確な指示を与えることが重要です。以下のようなプロンプト例を用いて、サイトをアクセシビリティ観点で厳しく評価するよう促します。


上記のプロンプトは評価対象のURLを示し、課題点を整理するためのフォーマットを指定しています。
すると、以下のように指摘点が生成されます。

【ChatGPT】AIを使って既存サイトのウェブアクセシビリティを改善する方法

MECEを意識した課題抽出

ChatGPTに対して「MECE(Mutually Exclusive, Collectively Exhaustive)」を意識して列挙するよう依頼することで、漏れを防ぎながら課題点を洗い出せます。
たとえば、評価観点として「色使い」「テキスト構造」「ナビゲーションのわかりやすさ」「画像の代替テキストの有無」「キーボード操作への対応」などを設定すると、幅広いユーザーが使いやすいサイトへと近づきます。

②課題点をテーブルで表示

ChatGPTで洗い出してもらった課題をテーブルで表示してもらいます。



【ChatGPT】AIを使って既存サイトのウェブアクセシビリティを改善する方法

③CSVでスプレッドシートへ落とし込みます。

スプレッドシートへ出力します。すべての改善策を同時に実行するのは難しいため、ユーザーの影響度の多い/実行しやすい課題から優先度を付けていきます。
【ChatGPT】AIを使って既存サイトのウェブアクセシビリティを改善する方法

④課題を実行。

実行する課題が決まったらタスク化して実行してきます。
以下は弊社で改善プランを担当しているサイトでの課題の例です。
【ChatGPT】AIを使って既存サイトのウェブアクセシビリティを改善する方法

ソースにおける課題の改善案はChatGPTに再び質問すると答えてくれます😊
例:altテキストの指定について 【ChatGPT】AIを使って既存サイトのウェブアクセシビリティを改善する方法

Webサイトは公開してから改善を行う事で、コンテンツやデザインへ内容を肉付けしたり改善していくことで効果を最大限に引き出せます。弊社では、300以上のWebサイトを作ってきた経験とAI技術を用いて貴社のWebサイト改善を行う事が可能ですので、興味がありましたら以下よりお気軽にご相談ください。

KOHIMOTO LABO

WebプロダウションKOHIMOTO Inc.が発信を通して成長していくためのラボ🧪 IT企業出身。世界中の人へ発信できるWebサイトを通じて、社会がより良い方向へアップデートしていく為に日々学び、技術を生かしていきます。