自治体サイトWebアクセシビリティ調査2026を終えて

お待たせしました!2026年も無事に発表できた自治体サイトWebアクセシビリティ調査、24回目でございます。今年のテーマは「使える?押せる?カルーセル」。見えない私がいつのころからか「なんじゃこりゃ?」と感じていたものの犯人はカルーセルでございました。そういうものの自治体サイトにおけるあれやこれやを調査しています。詳しくは調査の本編をご覧ください。

さて、こちらのコラムでは、全盲の視覚障害者である調査員が調査をしてみて感じたこと、雑感を述べてまいります。今年は自治体公式サイトは誰のためにあるのかに着目し、トップページの構成をもとに対象者を意識した表現を解説していきます。実際の自治体公式サイトから具体的な事例も挙げていきます。自分だったらどのような表現をするだろうかと考えながら読んでみてください。

自治体サイトは誰のためにあるのか

そもそも、自治体サイトは誰のためにあるのでしょうか。いわゆる閲覧者を誰と想定しているかということです。

情報発信をする側は「あらゆる人々」と答えるでしょう。それはそうです。そうできるのならそうあってほしいと思います。けれどもそうなっているでしょうか。

多様な特性や生活スタイルを持ったあらゆる人々を想定した結果、言葉が多すぎて、結局誰にも届いていないなどと言うことはありませんか?入力システムの枠にとらわれて、誰の方を向いて発信すべきかを見失っていませんか?自分の業務をこなすため、上司の合格点を得るための作文になってはいませんか?

自治体サイトは誰のためにあるのか。この情報を届ける先は誰なのか。トップページだけでも対象者をいろいろにとらえることができると思います。その人の方を向くようなイメージで考えてみましょう。

理想のトップページを作ってみよう

正解をサッと示すことができれば簡単なのですが、残念ながら正解はありません。あるとすれば、それは情報発信者が「誠実な意図」を持つことだろうと思います。

そのために、情報発信者には情報の受け手である閲覧者を意識してどう表現しておくのがベストかを考え抜いてほしいのです。そのヒントを提示していきたいと思います。

今回は、トップページを構成するパーツを取り上げ、私の考えを示したうえで調査対象サイトの中から具体的な事例を紹介していく形をとります。取り上げるパーツは以下の6つです。

  1. メインメニュー
  2. さがす
  3. 新着情報
  4. 注目コンテンツ
  5. 緊急情報
  6. SNSアカウント

メインメニュー

まずは「メインメニュー」です。メインメニューはサイト全体の目次です。グローバルナビゲーションなどと言うこともあります。

メインメニューの対象者は誰でしょうか。ここは「あらゆる人々」を想定しておいていいのではないでしょうか。

その代わり、ざっくりとした分類にしておく方がいいと思います。あいまいにということではありません。細かくしすぎないでおくという意味です。目的をもって訪れた閲覧者が、その目的を達成するために進むべき道が一つに絞れるような分類にしておくべきです。

分類されたメニューの配下には、さらに細かい項目が並ぶと思います。ここが隠された状態でも、閲覧者である「あらゆる人々」が「タップやクリックするべき部分はここだ!」と確信をもって進む様子をイメージして分類しましょう。

埼玉県公式ホームページのスクリーンショット:彩の国埼玉県のサイトロゴの下にグローバルナビゲーションが配置されている。緑の背景の上に左から「トップページ」「くらし・環境」「健康・福祉」「しごと・産業」「文化・教育」「県政情報・統計」が並んでいる。さらにその右には少し離れて赤い背景で「緊急・防災」が置かれている。
【事例】スタンダードな分類:埼玉県
徳島県ホームページのスクリーンショット:藍色の背景に白文字で県章とともに「徳島県」と縦書きで記されている。その右には「一般の方」「事業者の方」「県外の方」「県政情報」の項目が並び、その右には黄色の背景に警告のアイコンととともに「防災・安全・安心」のボタンが置かれている。
【事例】対象と分野のミックス分類:徳島県

さがす

次は「さがす」というパーツです。メインメニューが情報発信者側から与えられる受動的な分類であるのに対し、「さがす」パーツは閲覧者側の事由によりやや能動的に閲覧していくことができる部分です。具体的な実例で言うと次のようなものがあります。

  • キーワード検索
  • 目的別(ライフシーンなど)分類
  • よく見られているページ
  • よく検索されるキーワード

このパーツの対象者も「あらゆる人々」でいいと思います。入力するキーワードは自由でいいはずですし、ライフシーンにあらゆる人々が混ざっていてもそれほどのノイズにはならない印象です。

「山形の魅力」部分のスクリーンショット:「山形の魅力」の見出しがあり、その下には5つの写真とテキストの組み合わせが並んでいる。テキストは「住みたい! 移住・定住」「行きたい! 観光」「ふれたい! 自然・環境」などである。
【事例】目的別分類:山形県(山形の魅力)
「ライフシーンから探す」部分のスクリーンショット:3×3の9つの領域が設けられ、それぞれにはシーン名のテキストとピクトグラムが記されている。1行目左から「結婚・離婚」「妊娠・出産」「入園・入学」などが並んでいる。最下部には「閉じる」ボタンがある。
【事例】目的別分類:横浜市

ただし、「よく検索されるキーワード」や「よく見られているページ」は、システム上自動で出力されているのか、実際の検索結果がそのまま掲載されているように見受けられます。これらに意味があるかどうか、自治体としての見解を明確にしてから掲載することをおすすめします。

新着情報

次は「新着情報」です。実際の自治体サイトを覗いてみると、実にバリエーションが豊かなパーツです。

文字通り直近の記事が自動で流れていくものから、メインメニューの分類別に並べるもの、組織や手続き別、あるいは閲覧者の行動分類ごとに切り替えられるものまでさまざまです。中には、潔く「本日の日付」で制御するものまで存在します。

「新着情報」部分のスクリーンショット:左上に新着情報の見出し。左右3分割され、「くらし・手続き」「子育て・教育」「健康・医療・福祉」などの枠が設けられている。枠内には分類を表すアイコンと分類名、その下には5件のテキストリンクが並び、さらに「もっと見る」ボタンが置かれている。
【事例】メインメニューの分類別:福岡市
「最新情報」部分のスクリーンショット:左上に「最新情報 News」の見出し。見出しの右側には「すべて」「記者発表」「入札・公募」「採用・資格」「イベント」の5つのタブが並び、「記者発表」が反転表示している。タブの下には、更新日を伴って記事のタイトル5件が並んでいる。右下に「記者発表の一覧」ボタンがある。
【事例】なんらかのくくりで切り替える:福岡県
「新着情報」タブが選択された状態のスクリーンショット。選択されていないタブには「報道発表資料」「採用・試験・募集」が並ぶ。「本日の新着情報 28件」の見出しがあり、テキストリンクが並んでいる。表示件数は11件で、ウィンドウ右にはスクロールバーが表示されている。
【事例】本日の日付で制御:新潟県

ここの対象者は「あらゆる人々」にしない方がいいと考えます。つまり、自動的に直近何件かを表示するという安易な方策に頼るのはよくないということです。なぜなら、そのようにしてしまうと、住民にとって心躍るタイトルが並ばない瞬間が発生する可能性があるからです。

たとえば、入札情報が連続するタイミングで住民がサイトを訪れたらどう感じるでしょうか。自分たちのためのサイトだと感じられるでしょうか。もちろん、入札情報が行政や住民にとって重要ではないと言いたいわけではありません。ただ、もしそれを載せるのであれば、「なぜ今これが住民に必要なのか」という明確な意図をもって表示してほしいのです。

「News 新着情報」部分のスクリーンショット:「News 新着情報」の見出しがあり、その下には、左に5件のテキストリンク、右に写真を伴ったリンクが1件置かれている。さらにその下には「新着情報一覧」「新着情報RSS」「報道発表一覧」「その他お知らせ一覧」の4つのボタンが左右に並んでいる。
【事例】閲覧者を住民と想定していると思われる:大阪府

むしろ、新着情報は格好のアピールエリアだと思います。自治体公式サイトのトップページで、自由に書き換えられる場所は意外と少ないからです。閲覧者に「いつ見に来ても同じ」と感じさせてしまうのはあまりにももったいない。「ときどき見に来ると、ここに魅力的な情報が並ぶぞ」と認識してもらえるような、ワクワクする運用を心がけたいものです。

注目コンテンツ

次は「注目コンテンツ」です。ここは、情報発信者が閲覧者に周知させたいことを表現するところです。

ここの対象者のメインは「住民」ですが、時には「来訪者」を想定することもあります。

ここは、発信者側の都合がにじみ出やすいため、「どうにかして相手に届けたい」と担当者が頭を悩ませがちなパーツです。対象者を意識できることは利点ですが、そうやってあれこれ悩んで試行錯誤しているうちに、上司の影がちらつきやすいところでもあるので注意が必要です。

本来は閲覧者のための情報であるはずで、「発信者の都合」が存在することがよくないのですが、それでもどうにかしないといけません。閲覧者にどう魅力的に見せるか。発信者の腕の見せ所です。当社では、「上司の顔色を見るな」という励ましを含めご相談を受け付けています。御用命お待ちしています!

中央に「AIchi-Nagoya 2026」と記されたスクリーンショット。左には「第20回アジア競技大会」の見出しとYouTube動画のサムネイル、右には「第5回アジアパラ競技大会」の見出しとYouTube動画のサムネイルが見える。どちらのサムネイルも空撮された街並みが見えている。
【事例】国際大会をYoutubeの埋め込みで:愛知県
「MIYAGI 県政だより」部分のスクリーンショット:MIYAGIの題字がある広報誌の表紙(7・8月号)がある。その下には、「渡る風、新たな実り」の見出しと、表紙の説明文が記されている。この画像の四隅にはカギカッコのような形で枠がデザインされている。
【事例】広報誌の表紙を説明:宮城県
「イベント」部分のスクリーンショット:4件のイベント情報が、華やかなサムネイル、イベントタイトルに加え開催日とともに記されている。
【事例】イベントを期間併記で:名古屋市

緊急情報

次は、悲しいことに昨今すっかり注目を集めてしまっている「緊急情報」です。

ここの対象者は「当該自治体に住まう被災者」です。時間の経過とともに周辺住民や企業・団体へと広がるとは思いますが、まずは被災した可能性のある住民のための情報発信が第一です。

「正しい内容を、わかりやすく」が鉄則ですが、「正しい内容」は言うまでもないことなので置いておきましょう。問題は「わかりやすさ」のほうです。

多くの自治体サイトで緊急情報への動線は整備され、たどり着きやすくなってきました。しかし、その表現は本当に被災者を思ったものになっているでしょうか。

緊急情報がない平時にこの調査をすることが多いわけですが、「緊急情報がない」ということをわかりやすく表示できている自治体サイトは少ないです。有事に緊急情報をここに表示しますという心持はあるのかもしれませんが、平時に無事を伝えることだって大切な情報です。ここのところの運用を見直してもらいたいと思います。

山梨県ホームページのスクリーンショット:ロゴや主要メニューで構成されるヘッダがあり、一番右のボタンからページ幅いっぱいの赤い枠が延びている。赤い背景に白文字で「緊急・災害情報」の見出しが示され、その右の白い背景のエリアには「現在、情報がありません」と書かれている。
【事例】緊急情報がないことの表示あり:山梨県
新潟市ホームページのスクリーンショット:ロゴや主要メニューで構成されるヘッダのすぐ下に赤い背景に白文字の「緊急情報」の見出しとともに、「緊急情報が出ている地域があります。詳細は下記リンクで公開しています。」のテキストが示され、URLが掲載されている。
【事例】緊急情報があることの表示あり:新潟市

あとは、情報発信者が正しいと確信して伝えてくださるその大事な情報が、被災者に届くまでの手数が多すぎる傾向への懸念です。被災してしまった、都道府県が、市町村が何か有益な情報を出してくれているのではないかと期待して、必死の思いでやってきた閲覧者(被災者)に、何度もタップやクリックをさせるのですかということです。ここのところの運用も見直しておいてください。

SNSアカウント

ここまで、トップページにあるであろうパーツを取り上げて解説してきました。しかし、実際のところは、検索からたどり着いた末端に近いページから自治体公式サイトに足を踏み入れるケースが圧倒的でしょう。

それでも私がトップページにこだわるのは、踏み入れた足でお散歩していってほしいからです。関連情報を知ったり、ついでに寄り道して新たな情報に触れたりして、住民の生活や人生が豊かになることを望むからにほかなりません。

どんなきっかけであれ、行き着く先が自治体公式サイトであることが多く、「不足情報は公式サイトを見れば載っている」という認識を住民に持っていただくことは大切です。だって、その方がお互い楽ではありませんか?いろいろな形で発信する情報のどこかに多少の不具合があったとしても、公式サイトを覗いてくれれば完璧ですからという共通認識があれば、そう大きく道を踏み外すことはないと思うのです。

もちろん、これは不具合を容認しているわけではなく、やむを得ない側面もあるという話です。現在の情報発信媒体はあまりに多様化しています。多少の不具合のリスクを抱えてでも窓口が多いことは有益であると考えます。

毎日パソコンでウェブサイトを巡回している人ばかりではなく、「Xしか見ない」「InstagramやTikTokしか見ない」という層も確実に存在します。それを思えば、自治体情報への入り口はあらゆるところに用意しておいていいはずです。

「山梨県公式TikTok」部分のスクリーンショット:縦長のサムネイルとテキストで構成された記事へのリンクが4件並んでいる。右下には「山梨県公式TikTok」を見るのリンクがある。
【事例】TikTokをがんばっている:山梨県
「神戸市からのお知らせ」部分のスクリーンショット:左右の移動ボタンが付いたカルーセル内に、サムネイル画像とタイトルで構成されたnoteの記事へのリンクが3件並んでいる。
【事例】noteもやっている:神戸市

自治体側もそれをよく理解しており、さまざまなSNS公式アカウント運用に努めています。その証拠に、近年は公式サイトのトップページにSNSアカウントのリストが表示されることが増えてきました。

ここで、このリストの「見せ方」について一つ提案をしておきます。当該自治体の公式サイト内なのだから、そこに「SNSアカウント」とあれば当該自治体の公式のものだと普通は思いたいところです。しかし、私はアカウント名そのものも併記しておくべきだと考えます。

なぜなら、それぞれのSNSのアカウント名がひと目で公式とわかりやすいものばかりとは限らないからです。「公式っぽくないけれど、うちの公式です」という証明のためにも、現在運用している実際のアカウント名をしっかり明記していただきたいのです。閲覧者がページを遷移させたとき、そのアカウントがパッと開けばそれだけで安心できます。ぜひ、閲覧者に安心材料を与えてあげてください。

それは、そのまま「なりすまし防止」にも役立ちます。丁寧に、手を抜かずにやっているアカウントには、いたずらしにくいものです。

「誠実な意図」の効用

SNSアカウントの項で、丁寧に、手を抜かずにやることが結果的にトラブルやいたずらを防ぐのではないかという見解を書きました。少し意味合いが違うかもしれませんが、みなさんにもがんばっているから許せてしまったという経験はありませんか?

自治体の情報発信をするみなさんにも、どうかがんばってほしいのです。誰のための情報かを考え抜き、対象者を意識した心づくしの発信をしてほしいということです。

もちろん、がんばっていれば不具合があってもいいということではありません。ですが、最初から完璧である必要もないと思っています。「こういう意図をもち、この情報の対象者はこういう人だと想定して、正しく、わかりやすく精一杯表現した」と言いきれるのであれば、誰がその真摯な取り組みを否定できるでしょうか。多少の不具合があったとしても、受け手の気持ちは「ありがとう」に傾くのではないかと思います。

自分のがんばりで少しの猶予を得てください。その猶予の間に、子どもがドリルを解くように情報発信の練習を重ねていけばいいのです。必ず上達します。

発信者と閲覧者の間に、時には担当者と上司の間にも「誠実な意図」が存在すれば、さらにそれが積み重なっていったなら、自治体の公式サイトはいい雰囲気の情報の集合体になると思います。

もし日々の発信につらくなってしまったら、遠慮なく当社にご相談ください。最後になりますが、今年も『自治体サイトWebアクセシビリティ調査』を発表できたことに感謝申しあげます。重ねて、皆様からのご相談・御用命をお待ちしております!

熊本市

最上部のメインビジュアル(2枚の写真切り替え)を装飾と判断し、「トピックス」セクションのカルーセルを調査対象とした。再生/停止ボタンの文字が小さく、コントラストも不足しているため認識しづらい。また、リンク先が別ウィンドウで開く旨が代替テキストでしか示されておらず、視覚的にも識別できる対応が求められる。

福岡市

再生/停止ボタンの音声ラベルに「自動スクロールを停止/自動スクロールを再生」という具体的で丁寧な記述がなされており、操作結果が明確である。スライド選択ボタンは画像の外側に配置できているだけに、再生/停止ボタンのみが画像の上に重なって配置されている点がやや惜しまれる。

北九州市

1枚目のメイン画像の代替テキストが「北九州市キービジュアル」にとどまっており、市の新ビジョンを伝える重要メッセージが支援技術利用者に伝わらない。また、各操作ボタンの代替テキストに Previous や Next といった英語表記が残されており、利用者に親しみやすい日本語表記への改修が望まれる。

広島市

スライド選択ボタンが画像の上に重なって配置されており、情報の取得を阻害している。また、PC表示では十分な大きさの画像であっても、スマートフォン表示では文字が小さく読みづらいものが存在する。単に「面積を稼ぐため」ではなく、「画像を適切に見せる」視点での調整が期待される。

岡山市

各スライドの表示時間が調査対象の中で最速となる 2.5秒 に設定されており、文字をじっくり読み取ることが困難である。また、スライド選択ボタン等のフォーカス枠が通常時と見分けにくく、再生/停止ボタン押下後にフォーカスが外れていることに気づきにくいため、利用者にストレスを与えやすい仕様となっている。

神戸市

自動切り替えを行わない手動カルーセルであり、スライド選択ボタンにはサムネイルとテキストの両方を採用する丁寧なインターフェースとなっている。しかし、選択後に表示されるメイン画像の代替テキストが「空(alt=””)」に設定されており、リンク画像としての認識可能なテキストが存在しない状態となっているため改善が必要である。

堺市

スライド選択ボタンを画像領域の「外側」に独立して配置しており、要素の重なりやコントラスト不足といった問題を回避する優れた設計となっている。また、各画像も情報を絞り込み要素を詰め込みすぎないグラフィックとなっており、詳細ページへ誘導するための事前提示として参考になる実装例と言える。

大阪市

現在のスライド表示時間の経過を「扇形のアニメーション」で表現しており、切り替えタイミングを予見できる工夫が見られる。しかし、画像が自動切り替えされるたびにスクリーンリーダーへ通知される仕様となっており、複数のカルーセルから高頻度に通知が発生するため、ユーザーの情報取得を阻害しないよう配慮が必要である。

京都市

スライド選択ボタンを押下した際、スライド切り替えアニメーションの途中で次の操作を行うと反応しない場合がある。また、最終スライド(5枚目)から1枚目に戻る自動ループの際に表示アニメーションの乱れが発生する。重大な障害ではないものの、トップページの主要な表示領域にあるコンテンツとして挙動の安定化が望まれる。

名古屋市

スライド選択ボタン「1.オアシス21」を選択した際、読み上げられる情報が「オアシス21の画像」のみであり、景観としての魅力が伝わりにくい。また、イベント関連のバナー画像がスマートフォン表示時に左右に余白を生じさせており、PCとスマホ双方の表示に適した画像アスペクト比の検討が望まれる。

浜松市

カルーセル内部の要素に対してフォーカス枠が表示されないため、キーボード操作時に現在位置を識別することが困難である。実際にはスライド選択ボタンにしかフォーカスが当たらず、キーボード操作で一時停止することもできないため、ボタンを設置している目的を果たせていない。誰のための機能なのかを意識した設計が求められる。

静岡市

自動切り替えのない手動カルーセルである。PC表示において、一定以上の画面幅になるとカルーセル画像の左下に別の操作ボタンが被さって表示され、画像内のコンテンツを遮ってしまう構造的な問題がある。また、代替テキストに必要な情報が含まれておらず、画像としての補完が不十分である点も改善が必要である。

新潟市

操作ボタン群の背景に座布団(半透明の背景色)を配置することで、背後にどんな画像が来ても一定のコントラストを維持できるよう工夫されている。一方で、代替テキストに「〜へのリンク画像」「クリックすると詳細ページにリンクします」といった冗長な説明が含まれる例があり、支援技術が自動補足する情報と重複するため、画像自体が伝えたい内容に注力することが望ましい。

相模原市

スライドの表示秒数が全調査対象の中で最長となる 8.5秒 に設定されている。しかし、掲載枚数が分からず任意のスライドへ移動する手段もないため、利用者は目的の情報が表示されるまで待つことを強いられる。重要な情報への導線となっている可能性も考慮し、使いやすさの改善が求められる。

川崎市

スライド画像ごとに代替テキストの詳細度や説明の方向性が異なっており、文字のみを拾ったもの、視覚的状況を説明したもの、画像外の付加情報を書いたものが混在している。「代替テキスト」の基本原則に立ち返り、過不足のない情報伝達を行うとともに、同一エリア内の情報群として一貫性のある運用が望まれる。

横浜市

自動切り替えを行わない手動カルーセル仕様である。しかし、サムネイル画像にホバーまたはキーボードフォーカスが当たった瞬間に画像が入れ替わる挙動となっているため、キーボード操作では最初と最後の項目以外にアクセスすることが困難である。フォーカスではなく「ボタン押下」で項目選択となるよう設計を改めるべきである。

千葉市

豪雨災害への対応としてカルーセル表示を一時的に絞っている状態が確認された。PC表示ではスライド選択ボタンにサムネイルを採用し、スマホ表示ではボタンを非表示にするなど、機器特性に合わせてレイアウトを切り替える配慮がなされている。

さいたま市

自動切り替えを行わない手動カルーセルを採用している。スライド選択ボタンにPCでサムネイル、スマホでドットと使い分けているが、画像の代替テキストが「ゆるバース」など簡潔すぎる。「投票の呼びかけ」という最も重要な主旨が代替テキストから抜け落ちており、伝えるべき内容を適切に反映させることが求められる。

仙台市

スライド選択ボタンにドットではなく「サムネイル画像」を採用しており、次に表示される内容の予見性を高める工夫が見られる。しかし、小さな画面領域にサムネイルを並べることで読み取りの負荷が高くなっており、過度な情報の詰め込みにならないよう配慮が必要である。

札幌市

画面上に表示されていない裏のスライド画像にキーボードフォーカスが当たってしまうため、利用者が意図しないリンク先へ遷移させられる懸念がある。また、スライド選択ボタンのコントラスト比が選択中・非選択ともに 1.7:1 を下回っており不足している。JIS X 8341-3 改正により非テキストのコントラストも要件に含まれるため、適切な対応が進められることが期待される。

沖縄県

写真を見せる目的のカルーセルとなっているが、スライド選択ボタンの代替テキストと表示画像の代替テキストが同一の文字列となっており、支援技術利用者に対して画像の内容を十分に伝えられていない。画像の特徴や掲載されている情報など、実際に伝えるべき内容を踏まえて代替テキストを設定することが望まれる。

鹿児島県

PC表示において、ブラウザ画面の大部分をカルーセルの写真が覆い尽くし、さらにその上に特設サイト紹介のカルーセルが重なるという情報密度の高いレイアウトとなっている。また、画像の代替テキストに直下のキャプションと全く同じ文字列が設定されており、画像の説明として機能していない。

宮崎県

PC表示において、画像の左右がトリミングされて表示される設計となっているため、画像内に配置された必要な文字情報が途中で欠損してしまう。拡大表示しても情報自体が存在しないため解決にならず、PCとスマホ・タブレットで異なる縦横比の画像を準備するなど、情報保障の観点から適切な対応が不可欠である。

大分県

再生/停止ボタンの英語表記に Play/Stop、前後移動ボタンに Preview/Next という英語が使用されている。特に「Preview」は「Previous(前へ)」とは意味が異なり、前のスライドへの移動を示すラベルとして適切ではない。利用者の混乱を避けるためにも、正確な日本語表記へ改めることが望ましい。

熊本県

調査時は通常トップページ(index2.html)の「ピックアップ」を調査対象とした。画像内の文字がスライド選択ボタン等と重ならないよう配置されている点は評価できる。一方で、キーボード操作時に再生/停止ボタンを押下するとフォーカスが外れてしまい、再度の操作が困難になる現象が発生する。

長崎県

視覚的には「Pick up!!」という見出しのエリアに対し、aria-label で「県政情報スライダー」という名称を付与している。非表示スライドには aria-hidden により支援技術から隠す処理がなされているが、キーボード操作ではフォーカスが当たってしまうため、意図しない操作結果につながる懸念がある。

佐賀県

選択中のスライドと非選択のスライドを重ねて表示する構造になっているため、視覚的に見えていない裏のスライドにキーボードフォーカスが当たり、予期せぬ動作を引き起こす。非表示のスライドは、視覚的に隠すだけでなく、キーボード操作や支援技術からも操作対象とならないよう適切に制御すべきである。また、「別ウィンドウで開きます」の情報は代替テキストだけでなく視覚的にも明示すべきである。

福岡県

スライド選択ボタンのコントラスト比が 1.38:1 と不足している。領域を区分けするための背景色と同系統の色が使われているが、操作可能なボタンとしてしっかり識別できる色を用いたい。なお、スマートフォン表示時にはスライド選択ボタン自体が表示されない設計となっている。

高知県

再生/停止ボタンにテキストラベルや明確なアイコンが記述されておらず、角丸の四角形が表示されるのみであるため、それが操作ボタンであることが利用者に伝わらない。同ページ内の別カルーセル「こうち旬のトピックス」では「停止」と明記されているだけに、デザインの一貫性の欠如が目立つ。

愛媛県

画像の代替テキストがイベント名やサイト名にとどまり、開催日・場所・主要なメッセージなど、画像内に含まれる重要な情報が反映されていない。そのため、支援技術利用者は視覚的に提示された情報の一部を取得できない。また、キーボード操作で再生/停止ボタンを押すとフォーカスがカルーセル領域外へ移動し、連続して操作することが困難になる。代替テキストの内容を充実させるとともに、操作後も適切な位置にフォーカスを維持できるよう改善することが望まれる。

香川県

上部のサブサイト用手動カルーセルを避け、再生/停止ボタンを備えた「ピックアップ」領域を調査対象とした。画像内の情報量は比較的多く作り込まれているものの、切り替え速度が3.5秒とハイスピードであるため熟読が難しい。さらに、代替テキストに大まかな記述が散見され、コンテンツの豊富さに対応が追いついていない。

徳島県

調査対象のカルーセルの中で最多となる12枚のスライドが内包されている。スライド数が多すぎる上にキーボード操作で希望のスライドを表示させることができない。また、サムネイル画像が小さすぎて何が描かれているか認識できず、代替テキストの記述も不十分である。

山口県

スライド選択ボタンが白色で描かれているため、背後の画像によってはコントラスト比が著しく低くなり視認できなくなる。また、スマートフォン表示に切り替えるとスライド選択ボタン自体が画面から消失するため、希望のスライドへ移動する際の手数が増え、全体の掲載枚数も把握しづらくなる。

広島県

キーボード操作において、STOPボタン選択後に再度Enterキーを押下するとフォーカスがSTARTボタンから外れてしまい、意図した動作にならない(マウス操作時は正常に動作する)。また、前後移動ボタンの透明度が高いため、背景画像によっては視覚的にボタンとして認識しづらい。

岡山県

「stop」や「start」ボタンが非常に小さな円形の中に配置されており、内部の文字が小ぶりで視認・操作が難しい。また、スライド選択ボタンのコントラスト比が 1.3:1 と不足しており、選択中(カレント)の表示においても 1.57:1 と低いため、状態の識別が困難な実装となっている。

島根県

中央の画像の両脇に前後のスライドが半透明で表示されフォーカス可能となっているが、それらを選択するとボタン配置が乱れたり、視覚的なフォーカス位置と実際のフォーカス位置が乖離する不具合が発生する。また、再生と停止が別ボタンでありながら、現在の選択状態が視覚的に判別できない。

鳥取県

ボタンの表示に「停止」の対として「再生」ではなく「再開」という語彙を選択している点に独自性が見られる。スマホ環境でのスワイプ操作に非対応であるほか、ボタン配置や画像周辺の余白、掲載画像のクオリティなど調整の余地が見られる。アクセスが集中する主要領域として更なる質の向上が期待される。

和歌山県

再生/停止ボタンを操作した際の音声通知が Pause auto play や Start auto play、選択ボタンが Go to slide 1 と英語のまま読み上げられる。さらに画像の代替テキストが空(alt=””)であるため、操作はできても得られる情報が存在しない。英語のラベルがそのまま残っており、日本語サイトとしての配慮に課題がある。

奈良県

自動切り替えを行わず、ユーザーの手動操作によってのみ切り替わる仕様を採用しており、都道府県では唯一の全面手動カルーセルとなっている。PCとスマホで画面特性に応じて構成を変えている点は評価できるが、「イベント情報」等のカルーセルにおいて画像の代替テキスト設定が非常に簡易的である点が惜しまれる。

兵庫県

スライド選択ボタンの通常時のコントラスト比が 1.4:1 と不足している(選択中は 3:1 以上を確保)。また、画像の代替テキストが直後に配置された本文テキストと全く同一であり、画像としての情報補完が行われていない。単なる装飾ではなく、写真やバナーを用いる固有の意義を整理した運用が期待される。

大阪府

サムネイルの押下によるリンク遷移は可能だが、メインの大きな画像に対してキーボードフォーカスが当たらない。また、画像内の情報量が多く文字が小さい場合、縮小されたサムネイル内では情報を識別することが困難となる。読みにくいサムネイルは配置せず、用いている仕組みに適したコンテンツ表現方法を模索すべきである。

京都府

操作ボタンが画像の上に重なって配置されており、結果的に読み取れはしたものの画像内の二次元コードの一部が隠れてしまう状態となっていた。画像作成時および組み込み時に最終的な表示状態を考慮することが求められる。また、前後移動ボタンや再生/停止ボタンを操作した際の挙動がスクリーンリーダーに通知されない。

滋賀県

PC版・スマホ版を通じて、今回調査した全自治体の中で唯一トップページにカルーセルを採用していない。カルーセルは動的制御や視認性、フォーカス移動などアクセシビリティ上の課題が生じやすいUIであるため、「使わずに済むのであれば使わない」という設計選択自体が、利用者の認知負荷を抑える有効なアプローチとなっている。

三重県

PCでは、画像の左右に余白を設けることで「危機管理・救急情報」などのコンテンツを重ねて配置している。しかし、スマートフォン表示に切り替わるとレイアウトが変わり、その余白が無駄な空間として残ってしまう。面積を効率的に活用するというカルーセルのメリットを損ねており、レイアウトの再検討が求められる。

愛知県

各画像内に記載されている情報量が多いにもかかわらず、代替テキストの記述は不十分である。また、トップページ内に調査対象以外にも4つのカルーセルが設置され、それぞれ14枚、9枚、10枚、20枚と多数のスライドが内包されている。「一定の面積に情報を集約する手段」としてカルーセルが多用されており、コンテンツの量や構成を含めた運用面の整理が必要である。

静岡県

各画像右下にテキストで「詳しく見る」が添えられているが、文脈補足としての効果は薄い。スマホ環境でのスワイプ操作に非対応である点が惜しまれる一方、スライド選択ボタンの代替テキストに移動先スライドの具体的内容(画像の説明)を含めている点は丁寧なアクセシビリティ対応として評価できる。

岐阜県

操作ボタンの構成がシンプルで分かりやすい。一方で、PC向けにかなり横長の画像が採用されているため、スマホ表示時に縦幅が極端に縮小され可読性の低下を招いている。PCとスマホで縦横比の異なる画像を準備するなど、閲覧環境に依存せず読みやすい設計が望まれる。なお、キーボード操作時に再生/停止ボタンを押下するとフォーカスが外れる現象が確認された。

長野県

掲載されているバナー画像は品質が高く、画像内の文字がスライド選択ボタンと重ならないようレイアウト上の配慮がなされている。しかし、そうした視覚面の丁寧さに対して代替テキストの記述が不十分であり、トップバナーであることの表記よりも画像内に記された情報を的確に代替テキストへ反映させることが重要である。

山梨県

PC版サイトではカルーセルを使用せず、スマホ版の「ポータルサイトxPICKUP!」領域でのみ採用している。スマホ版におけるボタン操作や挙動自体には大きな問題が見られないものの、現在の代替テキストが簡潔すぎるため、画像に含まれる情報を網羅した丁寧な説明に改善することが望まれる。

福井県

1スライドの表示時間が全調査対象の中で最長となる 8.5秒 に設定されている。スライド選択ボタンの選択中表現に円の大きさや位置の変化を取り入れ、色以外でも区別できるよう配慮されているが、拡大の中心点が不適切なためレイアウトに不自然さが生じている。PCとスマホの画面幅の違いを踏まえ、表示画像点数を変える工夫がされている。

石川県

全体枚数と現在の表示位置をテキストで提示している点は評価できる。しかし、緊急対応に関する画像の代替テキストに 「ooamenityuui」「hukkouzennsinn」といったローマ字がそのまま使用されている。緊急時の情報発信だからこそ、支援技術利用者にも正しく伝わる適切なテキスト設定が不可欠である。なお、別箇所のカルーセルでは正しい代替テキストが設定されている。

富山県

掲載枠に対して縦横比の合っていない画像が多く採用されており、左右に無駄な余白が生じて表示品質を損ねている。さらに、代替テキストに「gazou」や「kodomomannnaka」といったファイル名等の不適切な文字列が設定されており、トップページの情報掲載枠やアクセシビリティ対応を十分に活かせていない。

新潟県

スライド画像内の文字がスライド選択ボタンと被らないよう配慮して配置されている点は良い。しかし、代替テキストが「クマ注意」や「Go to Eat」などと簡潔すぎるため、本来伝えるべきメリットや詳細が伝わらない。また、キーボード操作時に再生/停止ボタンを押下するとフォーカスが外れてしまい、連続した操作が困難になる。

神奈川県

画像内の文字をもれなく代替テキストへ反映させようとする配慮が窺える。一方で、キーボード操作で前後移動ボタンを操作できない点や、領域右下に配置された「>」という用途が明確でない記号の存在、カルーセル領域全体がクリッカブルになっていない点など、操作設計における細かな違和感が残る実装となっている。

東京都

キーボード操作において前後移動ボタンを操作できない点に課題がある。一方で、aria-roledescription を用いた構造定義が行われているほか、画像にホバーまたはフォーカスした際に自動再生が停止し、連動して再生/停止ボタンの表示も「停止」に切り替わる制御が組み込まれており、調査対象の中では他に見られない細やかな自動停止制御が実装されている。

千葉県

カルーセル周辺のフォーカス移動順序が視覚的な配置と一致しておらず、利用者に戸惑いを与える。また、選択中と選択されていない状態の色の差が小さく見分けにくい。デザイン面では、画像・タイトル・説明文の間の余白よりもコントロール(操作ボタン)との距離の方が狭くなっており、スライドとコントロールの距離制御をより精緻に行うことが期待される。

埼玉県

メインビジュアルのほか、県民向け・事業者向けの事業PRなど計3箇所のカルーセルが設置されている。画像内の文字をもれなく代替テキストへ反映できている点は評価できる。メインビジュアルについては画像そのものの補足説明を追加することも検討されたい。ただし、情報設計の観点から、そもそも該当コンテンツをカルーセル構造にする必然性があるのかについての整理も望まれる。

群馬県

キーボード操作時に再生/停止ボタンを押下するとフォーカスが外れてしまい、再度の操作が困難になる。代替テキストも不十分で画像内容を説明できておらず、枚数表示や選択ボタンもないため全体の把握がしにくい。また、aria-live=”polite” が記述されているため、6秒ごとに自動更新された情報の割り込みが発生し、他のコンテンツ閲覧の妨げとなっている。

栃木県

スライド選択ボタンの選択中(カレント)表示におけるコントラスト比が 1.42:1 と不足しており、状態の判読が困難である。また、ボタンの高さが低いためクリック等の操作がしづらい。さらに、画像の代替テキストが設定されていない箇所があり、テキストに記されていない情報が支援技術利用者に伝わらない状態となっている。

茨城県

バナー画像内に記載されている情報量に対して代替テキストの記述が少なすぎ、「いばべじスタイルバナー」といった名称のみの提示にとどまっているため、どのような内容なのか伝わらない。さらに、直後に配置された本文テキストと全く同じ文字列を重複して設定している例も見られ、適切な情報伝達に向けた代替テキスト付与ルールの策定と運用が求められる。

福島県

視覚的にはページ上部に配置されているが、HTMLの記述順(DOM構造)ではページ終盤に配置されており、見た目とコード上の順序が大きく乖離している。キーボード操作において再生/停止ボタンが操作できず、前後移動ボタンにも認識可能なテキストがないため音声での内容理解が困難である。また、スマートフォンでのスワイプ操作にも対応していない。

山形県

最上部のメインビジュアル(動画)を除外し、「山形を知る」セクションのカルーセルを調査対象とした。画像とテキストを組み合わせた構成となっているが、画像内に記載されている情報については代替テキストへ丁寧に反映させることが求められる。また、キーボード操作時にフォーカス枠がクリッカブルな領域全体ではなくテキスト部分のみに表示される点に操作上の違和感が残る。

秋田県

トップページのメインビジュアルにおいて、キーボード操作時に画面上非表示となっている画像にフォーカスが当たってしまう問題が確認された。また、操作の途中で再生/停止ボタンやスライド選択ボタンが画面上から消失する現象が発生するほか、フォーカス移動順と画面上の配置順にも違和感が生じている。キーボード操作時の挙動について全体的な再確認が必要である。

宮城県

県内の写真を常時スクロール表示する領域は装飾目的と判断し、「トピックス」エリアのカルーセルを調査対象とした。写真とテキストで構成されているが、スライドの切り替え間隔が3.5秒と短いため、利用者が落ち着いて情報を読み取るには慌ただしい。また、選択中と選択されていないボタンの色の差が小さく見分けにくいため、色だけでなく大きさや形状の変化を組み合わせた視認性の向上が求められる。

岩手県

HTMLの記述には大きな問題が見られないものの、スクリーンリーダーの読上げ挙動を踏まえた属性値の設定が望まれる。一方で、スライド選択ボタンの代替テキストに表示される画像の説明を含めている点は特徴的で丁寧な対応と言える。なお、UIの操作性としてスマートフォン環境でスワイプ操作によるスライド切り替えができない点は改善の余地がある。

青森県

トップページの「注目情報」領域にあるカルーセルでは、前後移動ボタンやスライド選択ボタン(左右キー操作時含む)によって画像が切り替わる際、スクリーンリーダーへの音声通知が行われない。スライド選択ボタンは色が薄く、サイズも小さいため、操作性に課題がある。さらに、画像内に記載されている重要な文字情報が代替テキストに反映されておらず、十分な情報伝達が行われていない。

北海道

トップページ最上部のメインビジュアル領域にカルーセルが配置されている。「再生」と「停止」がそれぞれ独立したボタンとして置かれており、aria-pressed 属性による状態記述はあるものの、どちらが選択されているかが視覚的に判別しにくい。また、スライド選択ボタンは背景色に対するコントラストが不足している上、表示位置に画像内の要素が重なっており、ボタンおよび画像双方の可読性や視認性に影響を与えている。