[ 対応中 ] JIS X 8341-3:2016に基づくウェブアクセシビリティ対応について
[ 対応中 ] JIS X 8341-3:2016に基づくウェブアクセシビリティ対応について
- このトピックには3件の返信、2人の参加者があり、最後に
により1ヶ月、 3週前に更新されました。
-
投稿
-
■ WordPress のバージョン
6.5.3■ テーマ・プラグインは全て最新版で確認してください。
確認しました。■ テーマの種類
Lightning ( G3 ) + Lightning G3 Pro Unit■ テーマのバージョン
バージョン: 15.23.0■ Pro Unit のバージョン
バージョン 0.26.8■ スキンの種類
Origin III■ プラグインの種類・バージョン
VK Blocks Pro バージョン 1.73.0.0
VK All in One Expansion Unit バージョン 9.97.2.1■ 期待する動作
自社のサイトがウェブアクセシビリティに対応してるサイトであるか調べるために
miChecker（エムアイチェッカー）
でチェックしたところ （JIS X 8341-3:2016に基づくウェブアクセシビリティレベルAA）
以下の問題が発見されました。lightningのテーマが干渉しているところやVK BlockPROやVK EXUnitのCSSが干渉しているですのでアドバイスがあればと思い質問しました■ 自分で試した事
『iframe要素にtitle属性がありません。iframe要素には、フレームの内容を説明するための空でないtitle属性を提供してください。』【原因】GTMスニペットタグ(noscriptタグ)のiframe要素のtitle属性がない。
【対策】ExUnitプラグインのGoogle タグマネージャーの設定を解除し、
子テーマファイルに直接GTMを設定（functions.php）
【手順】1.テーマファイルエディタを開く
WordPress管理画面から「外観 ＞ テーマファイルエディタ」と進みます。
2.functions.phpにタグを追加する
子テーマのfunctions.phpの末尾に、次のコードを貼り付けます。//GTMコンテナ出力（head用）
add_action(‘wp_head’, function() {
?>
[GTMのhead用コード]
<?php
}, 0);//GTMコンテナ出力（body用）
add_action(‘wp_body_open’, function() {
?>
[GTMのbody用コード（※iframe要素にtitle属性を記述）]
<?php
}, 0);この問題は対応しました。
『このページ内リンクはジャンプ先のアンカー”top”が存在しません．ジャンプ先のアンカーを挿入してください (ページの先頭へのページ内リンクとして動作する場合もあります)』
【原因】ジャンプ先のアンカー”top”の不備。
【対策】子テーマに/_g3/header.phpを追加し、bodyタグに id=”top” を追記。<body <?php body_class(); ?> id=”top”>
この問題は対応しました。
『:before擬似要素を用いてコンテンツ（テキスト）が挿入されています。装飾目的でないコンテンツが挿入されていないか確認してください。フォントアイコンの場合にはARIA24の利用を検討してください。』
VK BLOCK PROプラグインを外しました。が他に干渉しました
■ 症状が発生するブラウザ
全て■ 実際の症状
自社のサイトがウェブアクセシビリティに対応してるサイトであるか調べるために
miChecker（エムアイチェッカー）
でチェックしたところ （JIS X 8341-3:2016に基づくウェブアクセシビリティレベルAA）『このページ内リンクはジャンプ先のアンカー”top”が存在しません．ジャンプ先のアンカーを挿入してください (ページの先頭へのページ内リンクとして動作する場合もあります)』
『iframe要素にtitle属性がありません。iframe要素には、フレームの内容を説明するための空でないtitle属性を提供してください。: src=https://www.googletagmanager.com/ns.html?id=GTM-5QVP8NW』『:before擬似要素を用いてコンテンツ（テキスト）が挿入されています。装飾目的でないコンテンツが挿入されていないか確認してください。フォントアイコンの場合にはARIA24の利用を検討してください。』
(https://xxxxxxx/wp-content/plugins/vk-blocks-pro/build/_pro/table-of-contents-new/style.css?ver=1.73.0.0)
(content: “CLOSE”, “OPEN”, “OPEN”, “CLOSE”)
(https://xxxxxxx/wp-content/themes/lightning/_g3/assets/css/style-theme-json.css?ver=15.23.0)
(content: “?”, “?”)
(https://xxxxxxx/wp-content/plugins/vk-blocks-pro/build/block-build.css?ver=1.73.0.0)
(content: counter(number), counter(num_inner), counter(number), counter(num_inner), “?”, “?”, “?”, “?”, “?”, “?”, “?”, “?”, “?”, “Q”, “A”, “CLOSE”, “OPEN”, “OPEN”, “CLOSE”)
(https://xxxxxxx/wp-includes/css/dist/block-library/style.min.css?ver=6.5.3)
(content: “???”)
(https://xxxxxxx/wp-content/themes/lightning/vendor/vektor-inc/font-awesome-versions/src/versions/6/css/all.min.css?ver=6.4.2)
(content: “0”, “1”, “2”, “3”, “4”, “5”, “6”,——長いので省略）
(https://xxxxxxx/wp-content/plugins/vk-blocks-pro/build/faq/style.css?ver=1.73.0.0)
(content: “Q”, “A”)
(https://xxxxxxx/wp-content/plugins/vk-all-in-one-expansion-unit/assets/css/vkExUnit_style.css?ver=9.97.2.1)
(content: “Q “, “A “, “1”, “2”, “3”, “4”, “5”, “6”, “7”, “8”, “9”, “?”, “?”, “?”, “?”, “?”, “?”, “?”)『:after擬似要素を用いてコンテンツ（テキスト）が挿入されています。装飾目的でないコンテンツが挿入されていないか確認してください。フォントアイコンの場合にはARIA24の利用を検討してください。』
(https://xxxxxxx/wp-content/themes/lightning/_g3/design-skin/origin3/css/style.css?ver=15.23.0)
(content: “.”)
(https://www.rockets.co.jp/xxxxxxx/wp-content/themes/lightning/_g3/assets/css/style-theme-json.css?ver=15.23.0)
(content: “/”)
(https://www.rockets.co.jp/xxxxxxx/wp-content/plugins/vk-blocks-pro/build/block-build.css?ver=1.73.0.0)
(content: “/”)
(https://www.rockets.co.jp/xxxxxxx/wp-content/plugins/vk-all-in-one-expansion-unit/assets/css/vkExUnit_style.css?ver=9.97.2.1)
(content: “?”, “?”)
(https://www.rockets.co.jp/xxxxxxx/wp-content/plugins/vk-blocks-pro/build/_pro/breadcrumb/style.css?ver=1.73.0.0)
(content: “/”)
(https://www.rockets.co.jp/xxxxxxx/wp-content/plugins/vk-blocks-pro/vendor/vektor-inc/vk-swiper/src/assets/css/swiper-bundle.min.css?ver=11.0.2)
(content: “prev”, “next”)上記の問題点が出ました。大きな問題点のみ
■ その他特記事項
2024年4月に障害者差別解消法の改正法により、行政機関だけでなく民間事業者でも「合理的配慮の提供」が義務化されることとなりまずは自社のサイトがウェブアクセシビリティに対応してるサイトであるか調べるために
miChecker（エムアイチェッカー）を使って
https://www.soumu.go.jp/main_sosiki/joho_tsusin/b_free/michecker.html
でチェックしました。 （JIS X 8341-3:2016に基づくウェブアクセシビリティレベルAA）該当URL : https://*********※該当URLはフォーラムライセンスが有効のユーザーにのみ表示されます
書き忘れです
視覚（ロービジョン）で トップのスライダーやスライドする部分の背景の色を指定できないので。
背景色は255 255 255 になっており、文字が白なので、背景に画像があるにも関わらず
アクセシビリティに問題ありと出ていました
classで特定し色をCSSで加えて対応はしております。
背景付きの見出しでも背景に写真を指定して、
色を指定していない場合 同じようなアラートが出ました。おまたせして恐れ入ります今週順次確認予定です
- このトピックに返信するにはログインが必要です。
