Edit

Page

Page title:

Page body:

* [CODE[role=switch]] (ARIA)

[3] [[ARIA]] の [CODE[role]]
である
[DFN[[CODE[switch]]]]
は、オンとオフを切り替えられる[[ウィジェット]]を表します。

** 仕様書

[REFS[
- [4] [CITE@en-US[Accessible Rich Internet Applications (WAI-ARIA) 1.2]], [TIME[2020-11-05T23:55:39.000Z]], [TIME[2020-11-27T12:23:29.393Z]] <https://w3c.github.io/aria/#switch>
]REFS]

* 歴史

** WA1

[10] [CITE@en-GB-hixie[Web Applications Markup Language 1.0]], [TIME[2004-04-07T17:39:12.000Z]], [TIME[2024-09-01T06:05:55.241Z]] <http://www.hixie.ch/specs/html/apps/web-apps-1>

>1.1. Requirements and ideas

>
-    Equivalent of <switch>, so that e.g. selecting radio buttons changes the view

[11] 
>>10 ここでいう <switch> とは何か。 [[XUL]] かと思ったのだけど [[XUL]]
には [CODE[<switch>]] [[要素]]がない (と思うのだけどどうだろう、
[[XUL]] のドキュメントは散逸していてよくわからない)。

** [CODE[role=switch]]

[REFS[
- [1] [CITE@en[Modify description of the new "switch" role and identify as ARIA 1.1. · w3c/aria@e8ce919]] ([TIME[2015-05-30 22:58:09 +09:00]] 版) <https://github.com/w3c/aria/commit/e8ce91965715fb244e02fb8dbcdb17e91b5270ed>
]REFS]

- [2] [CITE@en-US[Accessible Rich Internet Applications (WAI-ARIA) 1.1]] ([TIME[2015-05-27 23:06:49 +09:00]] 版) <http://w3c.github.io/aria/aria/aria.html#switch>
-- 移転確認 [TIME[2020-11-27T12:23:45.000Z]] 
-- >>4

[5] [CITE@en[Modify description of the new "switch" role and identify as ARIA 1.1. · w3c/aria@e8ce919]]
([TIME[2015-09-22 11:09:38 +09:00]] 版)
<https://github.com/w3c/aria/commit/e8ce91965715fb244e02fb8dbcdb17e91b5270ed>

** [CODE[std-switch]]

[12] [CITE@en[tkent-google/std-switch: Explainer and demo for <std-switch>]]
([TIME[2020-07-20 11:55:42 +09:00]])
<https://github.com/tkent-google/std-switch/>

[14] [CITE@en[A toggle switch control element · Issue #384 · w3ctag/design-reviews]]
([TIME[2020-07-20 12:13:06 +09:00]])
<https://github.com/w3ctag/design-reviews/issues/384>

[13] [CODE[std-*]]

[FIG(data)[ [216] [[HTML要素概説]]

:[F[要素名]]:[CODE[std-switch]]
:日付:[TIME[2019]]
:説明:
[TIME[2019]]頃、
[[Google]] 
が
[CODE[std-switch]]
を提案していた[SEE[>>16]]。
現在の
[CODE[input]] 要素の [CODE(HTMLa)[switch]] 属性に当たる。
:出典:
[REFS[

-
[CITE@en[A standard 'Switch' form control]], 
[DATA(.author)[[[Kent Tamura]]]],
[TIME(.published)[Sep 13, 2019][2019-09-13]],
[TIME[2024-08-24T09:29:32.000Z]] <https://github.com/tkent-google/std-switch>

]REFS]
:注釈:
-
[16] 
[CODE(HTML)[std-]] は同時に [[Google]] 
が提案していた[[標準ライブラリー]]機構を通じて提供されることを表している。

]FIG]

** [CODE[<input switch>]]

[15] [CITE@en[Switch (Explainer) | Open UI]], [TIME[2024-09-08T07:58:24.000Z]] <https://open-ui.org/components/switch.explainer/>

[7] [CITE[An HTML Switch Control | WebKit]], [TIME[2024-03-15T04:59:34.000Z]] <https://webkit.org/blog/15054/an-html-switch-control/>

[6] [CITE[WebKit Features in Safari 17.4 | WebKit]], [TIME[2024-03-15T04:57:22.000Z]] <https://webkit.org/blog/15063/webkit-features-in-safari-17-4/>

[8] 
オンなのかオフなのかわからないことで定評がある[[糞UI][デザインの失敗]]だけど、
これだけ普及してるから対応しないわけにいかないよなあ

[9] >>6

>[SNIP[]]On macOS, if you enable “Differentiate Without Color”, or on iOS, if you enable “On/Off Labels”, the switch will show accessibility indicators.

なぜこれがデフォルトの挙動になっていないのか。

Historical Legal Sensitive Parent: [Help / License]

Edit

Page

Page name(s)