アクセシビリティ対応に不安がある方へ

アクセシビリティ対応は、必要だと分かっていても、
どこを確認するのか
どこまで対応するのか
社内でどう説明するのか
最初の一歩が踏み出しにくいテーマです。

Web担当者の方がリニューアルや改修を安心して進められるように、確認内容や対応範囲はご提案の段階で分かりやすくお伝えして、アクセシビリティ対応における検討負荷を軽減いたします。

アクセシビリティ対応が必要な方へ

  • 社内・庁内で説明できる材料がない
  • 何を基準に判断すればよいか分からない
  • 制作会社に任せきりにするのが不安

アクセシビリティ対応について、まず何を確認すべきか一緒に考えます。現在の状況やリニューアル・改修予定を伺い、必要な確認範囲や進め方をご案内します。

初回無料相談
(オンライン可)

アクセシビリティ対応のチェック事項

アクセシビリティ対応におけるWebサイト制作では、HTML構造、キーボード操作、スクリーンリーダー確認、目視確認を組み合わせてチェックします。必要に応じて、Lighthouse、axe DevTools、WAVE、カラーコントラストなど、アクセシビリティ対応のチェックツールを使用します。

HTML構造・見出し構造

見出し、本文、リスト、表、ナビゲーションなどが、内容の意味に沿って正しく記述されているかを確認します。見た目だけで整えられているページは、読み上げ環境や検索エンジンに内容が伝わりにくくなります。

画像・アイコンの代替テキスト

画像、アイコン、図表、バナーに適切な代替テキストが設定されているかを確認します。装飾画像と情報を伝える画像を分け、必要な情報が画像だけに依存しない状態にします。

キーボード操作・フォーカス

マウスを使わなくても、メニュー、リンク、ボタン、フォームを操作できるかを確認します。現在どこを操作しているか分かるように、フォーカス表示や操作順序も確認します。

フォーム・エラー表示

お問い合わせフォームなどで、入力項目の意味、必須項目、エラー内容が分かりやすく伝わるかを確認します。入力ミスがあった場合も、どこを直せばよいか分かる状態にします。

色のコントラスト・文字サイズ

文字色と背景色のコントラスト、文字サイズ、行間、余白を確認します。200%拡大時やスマートフォン表示でも、情報が欠けずに読めるかを確認します。

スクリーンリーダー確認

音声読み上げで、情報の順序、リンクの意味、ボタンの役割、フォームの内容が正しく伝わるかを確認します。見た目では分かりにくい構造上の問題を確認します。

アクセシビリティ対応の制作会社

アクセシビリティ対応の制作会社をお探しの方へ、
私たちは確認・設計・実装・運用まで一貫してお客様のアクセシビリティ対応を支援します。

アクセシビリティ対応の範囲やレベル、実装時のコード、公開後の運用ルールまでをクラウド上で共有し、関係者全員が確認できる形にしています。この実務基盤を、K2 Project Baseとして整備しています。

対応範囲とレベル

経験豊富な専門スタッフが対応

自治体はもちろん、民間企業でもコンプライアンスやCSRの観点から、アクセシビリティ対応の重要性が高まっています。リニューアルや改修の際には、JIS X 8341-3:2016を基準に、対象ページ、対応レベル、確認方法を明確にし、運用体制に合わせた対応範囲をクラウド上の基盤で参照できる形にします。

ソースコードのイメージ

UX / IA 設計

あらゆる環境でアクセシブル体験

アクセシビリティ対応では、利用環境や操作方法が異なる人でも、必要な情報に迷わずたどり着けることが重要です。私たちは、クラウド上の基盤に画面構成、導線、情報の並びなどをワイヤーフレームとして共有し、UI/UXとIAの両面からアクセシブルな設計を行います。

UI設計図

UI実装 -デザインシステム-

デザインの一貫性と品質を保つ

ボタン、リンク、フォームなどのスタイルやコンポーネントをクラウド上の基盤で共有し、HTML構造、ラベル、フォーカス、キーボード操作まで確認できる形にします。アクセシブルなUIを再利用できる状態にしておくことで、更新時にも一貫した操作性とアクセシビリティ品質を保ちます。

デザインシステムのイメージ

公開後の運用ルール

基盤でルールを確認しながら運用

アクセシビリティ対応は、公開後の更新やページ追加によって品質が崩れることがあります。私たちは、更新時のチェック方法、担当範囲、確認手順、運用スケジュールなどをクラウド上の基盤で共有し、関係者が同じルールを確認しながら運用できる状態にします。

ガイドラインのイメージ

アクセシビリティチェック方針

基準と確認範囲を明確にする

アクセシビリティ対応では、何を基準に、どの範囲まで確認するかを事前に決めることが重要です。JIS X 8341-3:2016やWCAGを踏まえ、主要ページ、テンプレート、フォーム、ナビゲーション、キーボード操作、代替テキストなど、あらかじめ定めたチェック方針に沿って確認します。

チェックリストのイメージ

自治体・公的機関への対応

公共性を考えた伝わる設計

自治体・公的機関のホームページでは、年齢、利用環境、操作方法に関わらず、必要な情報へたどり着けることが求められます。アクセシビリティ対応に加え、情報分類、導線設計、更新運用を考慮し、公共性の高いホームページ運用を支援します。

自治体ホームページ制作支援

パソコンを操作するのイメージ

アクセシビリティ対応が必要な方へ

  • 自治体のウェブサイト担当者の方
  • アクセシビリティ対応を進める企業の方
  • システム開発会社・ウェブ制作会社の方

アクセシビリティ対応について、まず何を確認すべきか一緒に考えます。現在の状況やリニューアル・改修予定を伺い、必要な確認範囲や進め方をご案内します。

ご相談・お問い合わせは
こちらまで

アクセシビリティ対応 よくある質問

アクセシビリティ対応はどこまで必要ですか?
Webサイトの目的、利用者、運用体制によって必要な対応範囲は変わります。主要ページ、フォーム、ナビゲーションなど、利用者への影響が大きい箇所から確認します。
JIS X 8341-3:2016に対応できますか?
JIS X 8341-3:2016を踏まえた確認・設計・実装に対応しています。対象ページ、達成等級、確認方法を事前に定め、必要なアクセシビリティ対応を設定します。
既存サイトのチェックだけ依頼できますか?
可能です。HTML構造、キーボード操作、フォーム、代替テキスト、色のコントラストなど確認しレポートを作成します。
リニューアル前から相談できますか?
可能です。Webサイトの設計段階からアクセシビリティ対応を組み込み、公開直前の大きな修正を防ぎます。
チェックツールだけで判定できますか?
チェックツールだけでは判定できません。Lighthouse、axe DevTools、WAVE、カラーコントラストなどのチェックツールに加え、目視確認、キーボード操作、スクリーンリーダー確認を組み合わせます。
自治体サイト以外も対応できますか?
対応できます。企業サイト、採用サイト、サービスサイトなどもチェック・改善します。
制作会社からの相談も可能ですか?
可能です。設計確認、実装相談、公開前チェック、運用ルール作成など、必要な範囲で支援します。
費用はどのように決まりますか?
対象ページ数、確認範囲、対応レベル、改修の有無によって変わります。必要な作業範囲を確認したうえでお見積りします。

アクセシビリティ制作事例紹介

事例の一部を紹介しますが、具体的事例などはお気軽にお問い合わせください。

自治体 様事例

省庁・自治体 様事例

デザインシステム考案・構築

運用メンバーによってアクセシビリティの知識やデザインスキルにバラツキがあり、Webサイト公開後の更新の際に、コンテンツが増えて行く度にデザインがバラバラになり、アクセシビリティ対応でなくなってしまうことが課題でした。

この課題をクリアするために、誰もが使いやすいWebサイトを維持するためのデザインシステムを考案した結果、アクセシビリティの基準を保ちつつ、更新工数の削減を実現しました。

ゴール設定

運用メンバーへのデザイン仕様共有

技術仕様

HTML5 / CSS3 / javascript

グローバル企業 様事例

グローバル企業 様事例

アクセシビリティ運用ガイドライン作成

WCAG2.0への切り替わりのタイミングで、Webサイトの大規模改修に合わせてガイドライン作成に参画しました。これにより、アクセシビリティの基準を保ちつつ、ベンダー各社まちまちに制作していたページのクオリティ管理が可能になりました。

ゴール設定

ベンダー各社へのデザイン仕様共有

技術仕様

Power Point

アクセシブル体験がロゴ・コンセプト

私たちは、創業当時から人間中心の設計に注力し、
その思想はロゴマークで体現してきました。

アクセシブルコードにはじまり、「ハートに刺さる集客」「コミュニケーションHUB」と
ロゴマークには利用者に寄り添う想いを込めています。
これは私たちが人間を中心にしたクリエイティブを企業アイデンティティとして掲げているからです。

アクセシビリティ対応に関する記事

アクセシビリティ方針について

K2@Web改善ラボ

    自治体ホームページの見直しをご検討の方へ

    アクセシビリティや多言語対応に限らず、自治体サイト全体の見直しや発注準備のご相談にも対応しています。

    自治体ホームページ制作支援を見る>