本文へ移動
  1. 高校情報
  2. さわって学ぶアクセシビリティ
  3. ターゲットのサイズ

2.5.8 ターゲットのサイズ (最低限) レベルAA 原則2 操作可能

小さすぎるボタン

「いいね」を押したつもりが「削除」だった。小さなボタンがくっついて並んでいると、指ではねらった方だけを押すのが難しくなります。手がふるえる人、片手で持っている人、揺れる電車の中のあなたも。

さわってみよう

スマートフォンの画面の「いいね」(ハートの印)だけを、指で押すつもりでクリックしてみよう。

https://example.jp/photo-club

写真部

文化祭の展示の写真を公開しました。

指で押すとどうなる?

チェックを入れると、クリックした点を中心に直径44pxの円を出し、円にかかったボタンを全部太い枠で囲み、いくつにふれたかを文字でも出します。円は指先が画面にふれる広さのおおまかな目安です(実際の指の大きさは人によって違います)。

ボタンの大きさは 12 × 12px、2つの間はたった 2px です。

直してみよう

ボタンの大きさ(と間隔)をスライダーで変えて、達成基準 2.5.8 を満たそう。

https://example.jp/photo-club

写真部

文化祭の展示の写真を公開しました。

青い点線の円:それぞれのボタンの中心に置いた直径24pxの円

24×24px 以上
—
24pxの円
—
44×44px 以上
—

分かったこと

例外のくわしい条件は、WCAG 2.2 の日本語訳で確かめよう。