トグルスイッチ

Microsoft「Guidelines for toggle switch controls - Windows apps」。トグルスイッチを、機器の物理的な電源スイッチのようなものと考えるよう書いています。変えたその場で効く2択の設定に使い、「送信」や「次へ」を押してはじめて効くならチェックボックスを使うよう勧めています。

W3C「Understanding WCAG 2.2: 1.4.11 Non-text Contrast」。部品とその状態を見分けるのに必要な見た目は、となりの色と3:1以上のコントラストにするよう求めています（レベルAA）。状態どうしの色の差には、この値を求めていません。無効の部品は対象外です。

Apple「Human Interface Guidelines: Toggles」2024年更新。状態の見た目の違いをはっきりさせること、見分けられない人もいるので色の違いだけで状態を伝えないことを勧めています。

Alita Kendrick「Toggle-Switch Guidelines」Nielsen Norman Group、2018年。トグルスイッチはその場で効くべきで、保存や送信を求めないとしています。送信ボタンの要るほかの入力欄とトグルを混ぜると、効いたのかどうかわからなくなると書いています。

W3C WAI「ARIA Authoring Practices Guide: Switch Pattern」。スイッチはオンとオフの2つだけを持ち、フォーカスがあるときSpaceキーで切り替えるとしています（Enterキーは任意）。状態が変わってもラベルを変えないことが大切だと書いています。

Microsoft「microsoft-ui-xaml: ToggleSwitch_themeresources.xaml」と Google「material-web tokens: _md-comp-switch.scss」。Windows 11 の標準のスイッチは押している間つまみを横に伸ばし、Material Design 3 は押している間つまみを大きくします。なぜそうするかは書かれていません。

IBM Carbon Design System「Toggle」。無効の状態を、操作の機能を完全に取り除くものとしています。

Jakob Nielsen「Response Times: The 3 Important Limits」Nielsen Norman Group、1993年。0.1秒は、システムがすぐに反応したと感じる限界のおよそだとしています。この速さなら結果を見せるだけでよいとしています。経験にもとづく目安で、トグルスイッチで測った値ではありません。

Page Laubheimer「Executing UX Animations: Duration and Motion Characteristics」Nielsen Norman Group、2020年。チェックボックスやトグルのような手ごたえを返す動きは、ぜんぶで100ミリ秒ほどにするとすぐ反応したように感じられるとしています。動き始めを速くする ease-out を勧めています。実験で示した値ではなく、推奨です。

Google「Material Components for Android: Switch」。スイッチの効果は、保存しなくてもすぐに始まるべきだとしています。

Heydon Pickering「Toggle Buttons」Inclusive Components、2017年。押した状態とラベルを一緒に変えてはいけないと書いています。ラベルは、オンやオフにする対象を示すためのものだとしています。

WHATWG「HTML Living Standard: 4.10.4 The label element」。ラベルを押すと、結び付いたフォームの部品を押したのと同じになるプラットフォームがあるとして、チェックボックスを例に挙げています。プラットフォームによっては、フォーカスするだけか、何もしないこともあると書いています。

W3C「Understanding WCAG 2.2: 2.5.8 Target Size (Minimum)」。ポインターで押す的は、少なくとも24×24 CSSピクセルにするよう求めています（レベルAA）。まわりとの間隔が十分なときなどの例外があります。

Catherine Plaisant, Daniel Wallace「Touchscreen Toggle Switches: Push or Slide? Design issues and usability study」University of Maryland、1990年。タッチ画面で6種類のトグルを15人で試し、押す型（1ボタン型）は、つまみをずらす型（スライダー型、レバー型）より有意に使いやすいと評価されました。考察で、スライダーのつまみはもっと大きくすべきだとしています。人数が少なく、好みの個人差が大きいとも書いています。

W3C「Understanding WCAG 2.2: 1.4.1 Use of Color」。色を、情報を伝えるただひとつの見た目の手段にしないよう求めています（レベルA）。トグルスイッチについて直接は書かれていません。

Apple「iPhone ユーザガイド：画面表示とテキストサイズ」。「オン/オフラベル」をオンにすると、スイッチはオンのとき縦線、オフのとき丸の印を出すと説明しています。

J. A. H. Murray ほか「A New English Dictionary」（オックスフォード英語辞典の初版）の "Toggle, sb."、WEHD の再録。もとは船の言葉だと言われているとし、綱の輪に通す短いピンを第1の意味にしています。1908年の『Installation News』に、スイッチのつまみを toggle と呼んだ用例を載せています。いまの版の記述はたしかめていません。

William J. Newton「Flush switch」米国特許 US1233597、1915年出願、1917年発行。表の板から突き出た操作のつまみを「toggle or handle」と書いています。

The Henry Ford「Hubbell Toggle Switch, 1917-1920」。トグルスイッチは外に出たレバーで、ばね仕掛けの機構を動かすと説明しています。カチッという音とともに、回路を素早く力強く開け閉めすると書いています。

Apple「UISwitch」。オンとオフのような2択を示す部品で、iOS 2.0 から使えるとしています。

Android Developers「Android 4.0 APIs」2011年。新しい Switch ウィジェットを、どちらかの側へドラッグするか、タップして切り替える2状態のトグルだと紹介しています。

W3C「Accessible Rich Internet Applications (WAI-ARIA) 1.1」2017年勧告。switch の役割を、チェックの有無ではなくオンとオフの値を表すチェックボックスの一種としています。変更履歴では2015年1月に加わりました。

Anne van Kesteren, Jon Davis「An HTML Switch Control」WebKit、2024年。Safari 17.4 で、チェックボックスに switch 属性を付けるとスイッチになると紹介しています。2026年10月の時点で HTML の標準には入っておらず、MDN の互換性データでも対応しているのは Safari だけです。

Richard Frantz Jr.「Togglesw2.jpg」Wikimedia Commons、2005年投稿。1/4インチ方眼の方眼紙の上で撮ったトグルスイッチの写真です。メーカーと作られた年は書かれていません。作者がパブリックドメインにしています。