-
投稿者投稿
-
2025年4月1日 7:39 AM #144632
【お使いの Snow Monkey のバージョン】
【お使いの Snow Monkey Blocks のバージョン】
【お使いの Snow Monkey Editor のバージョン】
【お使いの PHP のバージョン】
【お使いのブラウザ】Chrome
【当該サイトのURL】https://fureai-bunko.or.jp/application_form/### 発生している問題
Snow Monkey Forms:10.0.2
VoiceOverを使用していて確認画面に遷移した時、確認内容が読み上げられない。
プログレストラッカーも読み上げられない。NetReader使用時にはタブ移動していると確認内容が読み上げられず、下矢印を使用すると読み上げられたのですが、こちらも見えない状況では下矢印が必要とわからないのでやはり問題がありそうです。
NetReaderではプログレストラッカーは読み上げられたのですが、どの項目が太字なのかわからないので、プログレストラッカーとしての役割は果たせていないようでした。(連続で投稿してすみません・・・m(_ _)m)
### 試したこと
♥ 0いいねをした人: 居ません2025年4月1日 9:35 AM #144639「確認画面へ」ボタンを押すと、「現在グループ内の Web コンテンツ上にいます」となって、ページの1つ外側(ブラウザ?)にいる状態になりました。そして、「[Control] + [Shift] + [Option] + [↓] で Web コンテンツ内に入れます」という案内がありました。
ここで指示に従って入ると普通に操作できるようになって、[Control] + [Option] + [→] と [Control] + [Option] + [→] で確認画面部分も読み上げられました(移動はかなりめんどい…)
指示に従わずに [Tab] をクリックすると、一気に送信ボタンのところに飛んでしましました。
確認画面や完了画面に遷移したあとは [Tab] を押すのが一般的であれば、[Tab] を押したときにフォーム全体にフォーカスが移るようにしたほうが良いのかな?と思ったのですがどうでしょうか?
軽く試した感じでは、[Tab] でフォーム全体にフォーカスが移るようにはなりそうだったのですが、フォーム(確認画面)内のテキストも連続で読み上げはじめてよくわからない感じになってしまいそうでした…が、そこから [Control] + [Option] + [→] をクリックすると、フォームの中のテキストにフォーカスがちゃんと移動しました。
♥ 0いいねをした人: 居ません2025年4月1日 9:38 AM #144640プログレストラッカーは読み上げられたのですが、どの項目が太字なのかわからないので、プログレストラッカーとしての役割は果たせていないようでした。
これたしかにそうですね。ちょっとまだどうやれば良いかはわかっていないのですが、
aria-label
とかで「プログレストラッカー」と入れて、選択中の項目のところ(例えば今確認画面を表示しているなら「確認」のところ)にも「現在このページが表示されています」みたいなテキストを設定しておくと良いのかな?と思いました。これは試してみます。♥ 0いいねをした人: 居ません2025年4月1日 12:43 PM #144643すみません、私がVoiceOverの使い方をわかっていなかったかもです・・・
おっしゃる通りoption+control+→で中に入ることができました。ただNetReaderは普段から使用している方が確認項目があると気づかずスルーしておられたので何らかの対策は必要かもしれません。
—
確認画面や完了画面に遷移したあとは [Tab] を押すのが一般的であれば、[Tab] を押したときにフォーム全体にフォーカスが移るようにしたほうが良いのかな?と思ったのですがどうでしょうか?
—
一度これをしていただくことは大変でしょうか?
これで先方にNetReaderでどう動くのか試してもらおうと思うのですが・・・♥ 0いいねをした人: 居ません2025年4月1日 5:12 PM #144648plugins/snow-monkey-forms/dist/blocks/snow-monkey-form/render.php
のform
にtabindex="0"
を追加することで実現できます。<form class="snow-monkey-form" id="snow-monkey-form-<?php echo esc_attr( $form_id ); ?>" method="post" action="" enctype="multipart/form-data" data-screen="loading">
を
<form class="snow-monkey-form" id="snow-monkey-form-<?php echo esc_attr( $form_id ); ?>" method="post" action="" enctype="multipart/form-data" data-screen="loading" tabindex="0">
追加して確認をお願いします!
ちょっと思ったのは、一般的なやり方化はわからないのですが、例えば
<div class="screen-reader-text" tabindex="0">ここからフォームが始まります</div> <form class="snow-monkey-form" id="snow-monkey-form-<?php echo esc_attr( $form_id ); ?>" method="post" action="" enctype="multipart/form-data" data-screen="loading">
とすると、タブを押したときに「ここからフォームが始まります」にフォーカスして読まれるけど画面には表示できなくすることができるので、そのほうがわかりやすいかも?と思ったりしました。もう一回タブを押すと戻るボタンにフォーカスしちゃうので、確認画面の内容を読ませたいなら [Control] + [Option] + [→] を押してもらわないとですが…。
♥ 0いいねをした人: 居ません -
投稿者投稿
- このトピックに返信するにはログインが必要です。