Eyes, JAPAN Blog > 【Tips】すぐできるウェブアクセシビリティ!勝手にページ遷移させない編

【Tips】すぐできるウェブアクセシビリティ!勝手にページ遷移させない編

きたざわ

過去4回にわたり、ウェブアクセシビリティの記事を公開してきました。
今回も簡単に始められるウェブアクセシビリティのTipsを紹介したいと思います。
今回ご紹介するのは「勝手にページ遷移をさせない」というTipsです。

国税庁サイトリニューアルでページにたどり着けず無限ループに

国税庁のWebサイトが2018年3月31日にリニューアルし、大きな混乱が起こり話題になったのは記憶に新しいかと思います。
[参考] 国税庁Webサイト、全URL変更で混乱 サイト内検索も役立たず、「無限ループ」状態に (外部サイト)

この件を簡単に説明します。

  • 国税庁Webリニューアルに際しページのディレクトリ構成を見直しを行った結果、トップページ以外のページのURLが変更された
  • 通常はURLが変更される場合はリダイレクト(旧URLから新URLへ自動で移動させる設定)がされますが、今回の件ではサーバ負荷の懸念等からリダイレクトの設定を行っていなかった
  • 旧URLにアクセスをすると、「国税庁ホームページリニューアルのお知らせ」という画面が表示されて、10秒後に強制的にトップページへ移動する
  • トップページ右上にある検索窓でページを検索して、検索結果ページから個別ページを見ようとする。リニューアル直後は検索エンジンの結果がすべて旧URLを参照していたため、見ようと思っていた個別ページは全て「リニューアルのお知らせ」が出てきてトップページに戻されてしまう
  • 検索窓を使うと無限ループでトップページに戻されてしまうので、メニューから頑張ってページを探すしかない

[画像]国税庁、リニューアルのお知らせページのスクリーンショット

ちなみに、4月17日現在では検索エンジンの参照が新URLになりつつあるようで、トップページの検索窓から検索をしてみると個別のページにたどり着くことができました。
ただし一部は旧URLも残っており、トップページに戻されました。

この件で特に問題だと思われることは

  • リダイレクトがされていなかった
  • 強制的にTOPページに戻される

という2点です。

自分の意志と関係なくページ移動をすると混乱し、作業が中断する

この国税庁以外にも、「URLが変更されたので5秒後に新URLに遷移します」というページが表示されたり、外部サイトに遷移する確認のページ(中間ページ)が表示され「5秒後に移動します」という場面に、一度は遭遇したことがあるかと思います。
ページ遷移を知らせて自動的に移動してくれるんだから一見親切なように思えますが、これはユーザーが混乱してしまう可能性があります。

決められた時間で移動をしてしまうと、ユーザーによっては文章を読み終わる前に遷移をしてしまい最後まで読むことができません。また、スクリーンリーダーでは一定の時間がかかるために聞き終わる前に遷移すると内容を把握できません。
また、URLを変更したり再検索をするなどの操作を行おうとしていたのに、自動的に遷移してしまうと作業が強制的に中断されてしまいます。

ユーザーの操作に任せるか、中間ページを作らず直接リダレクトさせる

この場合の解決策としては二つあります。
まず一つ目はユーザーの操作に任せるという方法です。
例えば外部サイトへ遷移させるための中間ページをどうしても準備しなくてはならない場合、ユーザーの操作で外部サイトへ移動することを任せます。自分の好きなタイミングで移動ができるので、混乱が起きません。

もう一つは、こういった中間ページを作らずに直接リダイレクトをさせるという方法です。
ユーザーが意識せずに旧URLから新URLに移動することができるので、ユーザーの体験としては直接移動したことと同じになります。

まとめ

今回は実際に起こった事例をもとに説明をしてきました。
国税庁の対応はサーバ等の様々な事情があった末の結論とのことでしたが、ユーザーが多数おり外部からのリンクも相当されているサイトのようなので、リダイレクトで対応するのがベストだったのではないかと考えます。
これとはまた少し違う問題でもありますが、ページが存在しない場合に解決策を提示してあげる配慮も必要で、これもアクセシビリティの一つです。国税庁のサイトは404ページの整備も不十分のようです。(別の機会に紹介できたらと思います)

もし運用しているサイトで自動的に遷移してしまうページがある場合は、ぜひ一度見直しをしてみてください!

参考書籍

デザイニングWebアクセシビリティ – アクセシブルな設計やコンテンツ制作のアプローチ [amazonリンク]

  • このエントリーをはてなブックマークに追加

コメントは受け付けていません。