Text Scramble
Text durcheinander
Eine dekorative Textänderung, die kurz zufällige Symbole zeigt und sich dann auf die echten Wörter einpendelt.
Ein echtes Beispiel
Ein Hero im Terminal-Stil mischt beim Laden ein kurzes Rollen-Label. Screenreader können die echte Überschrift von Anfang an lesen.
Hauptteile
- 01Auslösen
- 02Property change
- 03Timing model
- 04Reduced-motion result
Verwenden Sie es, wenn
Verwenden Sie es selten und nur bei kurzem, dekorativem Text. Zeigen Sie die endgültigen Wörter schnell an und zeigen Sie sie auf einmal, wenn reduzierte Bewegung aktiviert ist.
Nutze es nicht, wenn
Verwürkle keinen Text, keine sich ändernden Zahlen und keine Formular-Beschriftungen und nichts, das man braucht, um die Seite zu verstehen oder zu nutzen.
In Code verwendeter Name
aria-hidden animated copy + stable accessible text Vor dem Ausliefern
Check content order, shared design values, component consistency, contrast, zoom, and layout changes by screen size. Verify every theme, language, and state. If there is motion, offer an equal reduced-motion experience.
Outcome: Complete the task with Text durcheinander (Text Scramble). User context: Ein Hero im Terminal-Stil mischt beim Laden ein kurzes Rollen-Label. Screenreader können die echte Überschrift von Anfang an lesen. Design concept to apply: Text durcheinander (Text Scramble). Why it fits: Verwenden Sie es selten und nur bei kurzem, dekorativem Text. Zeigen Sie die endgültigen Wörter schnell an und zeigen Sie sie auf einmal, wenn reduzierte Bewegung aktiviert ist. Do not use it when: Verwürkle keinen Text, keine sich ändernden Zahlen und keine Formular-Beschriftungen und nichts, das man braucht, um die Seite zu verstehen oder zu nutzen. Design requirements: Set the content order, shared design values, and reusable components. Define how the layout changes by screen size and state. Keep useful design choices separate from decoration. Inclusion and resilience: Check contrast, zoom, languages, themes, and reduced motion when needed. Do not use color or effects as the only way to show meaning. Acceptance criteria: The design stays clear on phones and desktops, at zoom, in every theme, and in all supported languages. Interactive states stay clear and consistent. Evidence and limits (evidence boundary): Dies ist kein normativer Standard. Sein Name, seine Grenzen und erwartetes Verhalten können von einer Quelle zur anderen variieren. Unknowns to confirm: Brand limits, amount of content, supported themes and languages, target devices, and design-system rules.
Diese Anfrage prüfen
Review how Text durcheinander (Text Scramble) is used now. Definition: Eine dekorative Textänderung, die kurz zufällige Symbole zeigt und sich dann auf die echten Wörter einpendelt. Release checks: Check content order, shared design values, component consistency, contrast, zoom, and layout changes by screen size. Verify every theme, language, and state. If there is motion, offer an equal reduced-motion experience. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.