-
Notifications
You must be signed in to change notification settings - Fork 0
Accessibility ja
🌎 言語: 日本語 — 33言語すべてを見る
LockedIn CLIはジョークですが、そのアクセシビリティはジョークではありません。 グラデーションのワードマーク、罫線で描いたカード、点字パターンのスピナー、絵文字 ——ここまで視覚に寄せたターミナルUIは、最初から設計しておかないと支援技術での利用が 本当に困難になります。このページでは、CLIが何をしているか、どう有効にするか、 そしてその背後にある一般的なベストプラクティスを説明します (後者はこのプロジェクト以外でも役に立つはずです)。
| モード | フラグ | 環境変数 | 何をするか |
|---|---|---|---|
| スクリーンリーダー |
--accessible(--a11y, --screen-reader) |
LOCKEDIN_ACCESSIBLE=1、または TERM=dumb
|
素直な一直線のプレーンテキスト。罫線なし、アスキーアートなし、スピナーの動きなし、装飾記号なし。色はオフ、プロンプトは短く、意味的な目印(「投稿:」…「(投稿ここまで)」)付き。 |
| ハイコントラスト |
--high-contrast(--hc) |
LOCKEDIN_HIGH_CONTRAST=1 |
ロービジョン向けの高コントラスト配色。副次テキストは純白、アクセントは明るく、暗い装飾はなし。コントラストの低いグラデーションの代わりに単色のアクセントを使用。 |
| 低刺激 |
--low-distraction(--calm, --reduce-motion) |
LOCKEDIN_LOW_DISTRACTION=1, LOCKEDIN_REDUCE_MOTION=1
|
モーション低減(スピナーのアニメーションなし)、装飾絵文字なし、落ち着いた単色。視覚的なレイアウトはそのまま維持します。認知的・感覚的な負荷を下げたい人向け。 |
| モノクロ |
--plain(--mono, --monochrome) |
LOCKEDIN_PLAIN=1、または NO_COLOR=1
|
レイアウト・罫線・絵文字は保ったまま、すべての色を無効化。色の再現性が乏しい端末、ログ用途、あるいは好みで。FORCE_COLOR より優先されます。 |
これらは組み合わせられます。--high-contrast --low-distraction なら、明るくて
静かで絵文字のないUIになりますし、TERM=dumb の端末でスクリーンリーダーを使っていれば
自動的にアクセシブルモードになります。モード同士が衝突する場合は、より制限の強い方が
勝ちます。モノクロは配色より優先され、スクリーンリーダーモードはモノクロより優先されます。
lockedin --accessible post
lockedin --high-contrast
lockedin --plain post
LOCKEDIN_LOW_DISTRACTION=1 lockedin aura最初に決め打ちする必要はありません。対話セッションの中では、/a11y
スラッシュコマンドが本当に動くコントロールパネルとして使えます
(アクセシビリティは風刺の対象ではありません)。
| 入力 | 結果 |
|---|---|
/a11y |
4つのモードの現在の状態(オン/オフ)を表示 |
/a11y <モード> |
1つを切り替え: screen-reader, high-contrast, low-distraction, plain(sr / hc / calm / mono などの別名も可) |
/a11y reset |
すべてのモードをオフにする |
状態は必ずオン/オフの語として明示されます。色だけで示すことはありません。 まさにこの機能を必要とする利用者が、その色を知覚できるとは限らないからです。 パネルは全言語に対応しています。
ここで適用した原則を挙げます。どれも、ターミナルツール全般に当てはまります。
- 装飾より意味を。 スクリーンリーダーは文字を読み上げます。罫線は 「横線、横線……」になり、アスキーアートのワードマークは雑音です。 アクセシブルモードでは、視覚的な構造を言葉に置き換えます。スプラッシュは 「LockedIn CLI」とテキストで名乗り、カードには目印(日本語では「投稿:」と 「(投稿ここまで)」)が付いて、ブロックの始まりと終わりが分かるようにしています。
- 色やアイコンだけに意味を持たせない。 色や絵文字だけで伝えている情報は、 一部の利用者にはまったく届きません。色を切っても文章として意味が通るように保ちます。 たとえば「Connected with Ava」は、✔ が消えても問題なく読めます。
- 代替テキストを用意し、雑音は削る。 装飾絵文字は冗長に読み上げられます (「📥」→「インボックストレイ」)。アクセシブルモードは純粋に装飾的な記号を取り除いて 言葉を残し、低刺激モードは派手な絵文字だけを外してレイアウトは維持します ——見えてはいるが静かに使いたい人のためです。
-
モーション低減を尊重する。 アニメーション(点字スピナー)は気を散らすもので、
人によっては前庭系の不調を誘発します。アクセシブルモードと低刺激モードでは
アニメーションしません。状態を一度だけ静的に表示します。Webの
prefers-reduced-motionと同じ考え方です。 - ハイコントラストを用意する。 コントラストの低い「くすんだグレー」の副次テキストは、 多くの利用者にとって WCAG のコントラスト 基準を満たしません。ハイコントラストモードでは純白に置き換え、アクセントも明るくします。
- 認知的な負荷を下げる。 視覚以外の理由で、より少ない表示を必要とする人もいます。 装飾を減らし、動きをなくし、絵文字を消す。ここではそれを後付けではなく、 一級のモードとして用意しています。
-
プラットフォームの慣習に従う。 このCLIは
NO_COLORをすでに尊重しています。加えて、多くの スクリーンリーダー環境やEmacsのシェルが設定するTERM=dumbを「アクセシブルにせよ」の 合図として扱い、LOCKEDIN_REDUCE_MOTIONも読みます。利用者が既に発している信号を 検出するほうが、また新しい設定をさせるより優れています。 - テスト可能にし、テストし続ける。 テストゲートに入っていないアクセシビリティは 風化します。このスイートは、アクセシブルモードの出力に装飾記号が1つもないこと、 目印が存在すること、ハイコントラストで配色が入れ替わること、低刺激モードでも罫線が 揃ったままであることを——全言語について——検証しています。
方向制御も安全側に倒します。アラビア語・ペルシャ語・ヘブライ語・ウルドゥー語は、isolate対応を確認済みの
ターミナル向けに利用者が LOCKEDIN_BIDI=on を明示しない限り、bidi制御文字を出しません。
スクリーンリーダーモードでは有効時にも除去します。TTYプローブや端末の許可リストが
この既定値を上書きすることはありません。
-
a11yFilter(s)は装飾用のUnicode(罫線素片、ブロック、幾何学記号、技術記号、 装飾記号、点字、絵文字)を取り除き、テキストを左詰めにします。アクセシブルモードでは すべての出力に適用されます。 -
emojiFilter(s)は低刺激モード用の、より軽いフィルタです。派手な絵文字・記号だけを 取り除き、罫線・箇条書き記号・矢印・ANSI色は残すので、視覚的なレイアウトは 保たれます。 - 配色オブジェクト
Cは、その場でハイコントラスト配色に差し替えられます。 ハイコントラストまたは低刺激が有効なとき、グラデーションは単色のアクセントに フォールバックします。モノクロモードではCの全要素を空にし (FORCE_COLORがあっても色は完全にオフ)、レイアウトはそのまま残します。 -
renderSplash、スピナー、renderPrompt、cardには、アクセシブルモード用の 意味重視の分岐があります(プレーンテキスト、動きなし、目印付き)。 - 判定は
detectAccessible/detectHighContrast/detectLowDistraction/detectPlainにあり、エントリポイントが描画前に適用します。セッション内の/a11yコマンド(handleA11y+renderA11yStatus)は、同じモジュールレベルの 状態をその場で切り替えます。
チュートリアルのレビュー用チェックリストには アクセシビリティの項目が入っています。これはどんなプロジェクトでも良い習慣です。
lockedin --accessible <あなたのコマンド>を実行し、きれいなプレーンテキストとして 読めること——フィルタをすり抜けた新しい装飾記号がないこと——と、新しく追加した 構造ブロックに目印が付いていることを確認しましょう。続いて--high-contrast、--low-distraction、--plain(色コードを一切出さず、レイアウトは保つこと)も 試します。ユーザーに見える文字列を追加したら、/a11yパネルとヘルプが翻訳された 状態を保てるよう、すべての言語バンドルにキーが必要です。
風刺作品です。LinkedInとは一切関係ありません。GPL-3.0-or-later。
Tutorial
- 1 · Orientation
- 2 · How the Code Works
- 3 · Your First Agent Task
- 4 · Prompting & Reviewing
- 5 · Localization
Reference
Satire · Sátira · 風刺. Not affiliated with LinkedIn. GPL-3.0-or-later.