4
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

ちっちゃくアウトプットAdvent Calendar 2023

Day 10

ポインタのキャンセルに関するアクセシビリティ

Posted at

これはなに?

アクセシビリティの「操作可能」の中で入力モダリティのポインタのキャンセルに関するの項目についてまとめました。
このアクセシビリティはレベルAです。

入力モダリティとは
利用者がキーボード以外の様々な入力を通じて機能を操作しやすくすること。
モダリティとは、「様式」「様相」といった意味です。
マウス、タッチスクリーンの指、Apple Pencilのようなポインター入力デバイスなどがあります。

概要

クリックやタップで実行される機能の実行、完了のトリガーには、ダウンイベントを使わず、アップイベントやクリックイベントを使い、誤った操作を中断できるようにする。

ダウンイベントとは
コンテンツを押下したタイミングで実行されるようなイベント。
「タッチスタート」や「マウスダウン」と呼ばれることもある。

アップイベントとは
コンテンツから手を離したタイミングで実行されるようなイベント。
「タッチエンド」や「マウスアップ」と呼ばれることもある。

例えば「間違えてタップしたので、そのまま指をずらしてから離せばキャンセルされる」という経験はありませんか?
このアクセシビリティはそういった行動を定めています。

なぜこのアクセシビリティが必要なのか

誤タップや誤クリックなど、意図しない動作で操作されないようにするために必要とされています。

対応

  • ダウンイベントがない
    • コンテンツを押下したタイミングで機能が実行されない
  • 中止または元に戻すことができる
    • コンテンツから手を離したタイミング(アップイベント)で、ダウンイベントの中止か元に戻すことができる
  • アップイベントで反転

ダウンイベントがない

コンテンツを押下したタイミングで機能が実行されないように、アップイベントで実行されるようにします。

例えば a タグのテキストリンクは、アップイベントでページが遷移する状態になっています。

中止または元に戻すことができる

先に例で出した「間違えてタップしたので、そのまま指をずらしてから離せばキャンセルされる」が該当します。
間違ったアイテムを選択していることがわかった場合、ポインタまたは指を離す前にターゲットから動かすことで操作をキャンセルすることができます。

アップイベントで反転

例えば、ボタンを押下している間(ダウンイベント中)だけポップアップの表示や動画の再生がされる場合、ボタンから離したタイミング(アップイベント)でポップアップが消えたり、再生が停止される状態などが該当します。

例外

ダウンイベントが必要不可欠な場合は例外として認められます。
この場合元に戻す方法の提供は ダウンイベントが必要不可欠な例外において必須要件ではないです。
なんだか難解な言い回しです。
ただ、UXの観点では提供したほうが良いと考えます。

  • ダウンイベントが必要不可欠な例
    • ピアノツールの場合、鍵盤を押したら音がなる
    • Deleteボタンで文字が消える

参考

4
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?