Einfache Websites und Apps

Entwickeln Sie schnelle, zugängliche Websites und Apps mit klarer Navigation und hilfreichen Inhalten.

54 Artikel · Zuletzt aktualisierter Artikel

Die Suche erfasst alle Artikel dieses Themas, einschließlich Archiv und Artikeltext.

Verstehen Sie das Thema.

Ein praktischer Leitfaden zu diesem Thema.

Die Entwicklung einer Website oder App bedeutet, eine Aufgabe zu ermöglichen, nicht nur Bildschirme zu erstellen. Diese Kategorie verbindet Inhaltsstruktur, Benutzeroberfläche, Barrierefreiheit, Leistung, Sicherheit und Wartung zu einem ganzheitlichen Nutzererlebnis.

Was ist zu prüfen?
  • Beschreiben Sie Aufgaben und Zielgruppen, bevor Sie Komponenten und Technologien auswählen.
  • Testen Sie Navigation, Formulare und Fehlermeldungen auf verschiedenen Geräten und Interaktionsmodi.
  • Planen Sie Aktualisierungen, Backups und die Weiterentwicklung von Inhalten von Anfang an.
  • Öffnen, Bewegung, Schließen und Kontextwiederherstellung in Schnittstellen überprüfen, die eine Aufgabe unterbrechen.
  • Bewegungsdaten erfassen, reduziertes Verhalten anbieten und testen, ob Fortschritt, Status und Navigation auch ohne Animation verständlich bleiben.
  • Eine abgebrochene Anfrage kann serverseitig bereits ausgeführt sein.
  • Zellbeziehungen müssen auch auf kleinen Bildschirmen verständlich bleiben.
  • Suche, Speicherung, Fortschritt und Fehler visuell, per Tastatur und mit Screenreader wahrnehmbar machen.
  • Die heruntergeladene Datei hängt von Darstellungsgröße und Gerät ab.
  • Trennzeichen und Datumsreihenfolge können verschiedene Deutungen erzeugen.
Hilfreiche Fragen.
  • Welcher Pfad führt zu einer erfolgreichen Aktion?
  • Welche Zustände oder Inhalte sind schwer verständlich?
  • Wie werden Korrekturen auf Regressionen geprüft?
  • Erklärt das Formular nach einem Fehler die Korrektur, während gültige Werte erhalten bleiben?
  • Ist ein Modal erforderlich?
  • Schließt reduziertes Verhalten jegliche Animation aus?
  • Bei erneuter Verbindung automatisch wiederholen?
  • Sind Karten immer zugänglicher als Tabellen?
  • Soll jede Änderung angesagt werden?
  • Muss sizes immer 100vw sein?
  • Reicht ein Wechsel der Oberflächensprache?

Beispiel einer Entscheidung.

Situation.
Fiktives Beispiel: Diese Daten beschreiben keine Kunden oder beobachteten Ergebnisse. Eine Bestätigung wird durch eine Animation dargestellt, deren Bewegung manche Personen reduzieren möchten.
Prüfen.
Die Systemeinstellung für reduzierte Bewegung aktivieren. Prüfen, ob Text oder ein statischer Zustand das Handlungsergebnis weiterhin vermittelt.
Handeln.
Information und Kontrolle in der reduzierten Variante bewahren. Bei anhaltender Bewegung gegebenenfalls geeignete Steuerelemente anbieten.

Motion Design als Erfolgsfaktor in der UX: Nutzer gezielt führen und begeistern

Animation: reduzierte Bewegung, Pause und Verständnis überprüfen

W3C — WCAG 2.3.3 Animation from Interactions (AAA)

Entwerfen Sie Wartezeiten und Wiederherstellung.

Ein Nutzererlebnis ist unvollständig, wenn nur der Erfolg geplant ist. Berücksichtigen Sie fehlende Antworten, unbekannte Zustände und verlustfreie Wiederherstellung; verknüpfen Sie jede Meldung mit einem verifizierten Zustand und testen Sie das Verständnis und die Navigation.

Weiß der Nutzer, was zu tun ist, ohne eine unsichere Operation wiederholen zu müssen?

Erkunden Sie die Methoden.

Daten lesen und entscheiden

Formulare: den gesamten Fehlerweg prüfen

Eine Meldung beweist keinen Aufgabenabschluss.

Abgeschlossene Aufgaben
12 / 2060 %
Blockierte Aufgaben
8 / 2040 %
Getestete Zustände
4Leeres Pflichtfeld · Abgelehntes Format · Erneutes Senden · Bestätigung

Fiktiver Lehrfall: Die Zahlen beschreiben weder CIE noch Kunden.

Fragen zur Vorbereitung Ihrer Entscheidungen

Antworten und praktische Prüfpunkte finden Sie in den Analysen dieser Rubrik.

Im Archiv weiterlesen

Weitere Analysen zu diesem Thema außerhalb der aktuellen Artikelliste.

Referenzen: Daten, Nutzung und Grenzen

Dokumentation geprüft am .

Ausführliche Hinweise stehen in dieser Ausgabe auf Englisch zur Verfügung.

Referenzen: Daten, Nutzung und Grenzen
Quelle und ZweckGeprüfte Daten oder RichtwertePraktische NutzungZu beachtende Grenze
W3C · WCAG 2.2

Evaluate accessibility criteria for web content.

WCAG 2.2 is a W3C Recommendation. Success criteria have A, AA and AAA levels. Define tasks, pages and states, then combine inspection, keyboard, zoom and relevant assistive technology. Keep reproduction steps for barriers.

Methode vertiefen →

An automated scanner does not establish conformity of a complete journey. Evaluation must cover interactive states and actual content.
Google · Core Web Vitals

Distinguish loading, responsiveness and visual stability.

Good thresholds are LCP ≤ 2.5 s, INP ≤ 200 ms and CLS ≤ 0.1 at the 75th percentile, segmented by mobile and desktop. Separate field measurement from laboratory tests. Record period, URL, device, population and sample size before comparing changes.

Methode vertiefen →

These thresholds are not measured results for this site. A good lab score alone does not establish visitor experience.

CISA-KEV-Katalog durchsuchen

Ausführliche Hinweise stehen in dieser Ausgabe auf Englisch zur Verfügung.

Bring vulnerability tracking into maintenance

An added entry starts a work item, rather than automatically closing one. Connect tracking to inventory, a change window and service verification after intervention.

  • Assign decision and change owners.
  • Separate patch availability, deployed patch and successful verification.
  • Keep the source, observed result and remaining limits.

Katalog und Methode ansehen →

CISA KEV · 2026.10.21 · Documentary review : 2026-10-22

Formulare: Kriterien, Fehler und Kontrast

Ausführliche Hinweise stehen in dieser Ausgabe auf Englisch zur Verfügung.

Review states, not just the initial page

A form may look clear before entry and become difficult after an error. A useful review retains task context and connects each finding to a version and state.

  • Test waiting, error, correction and confirmation.
  • Separate colour calculation, keyboard navigation and status presentation.
  • Keep steps that reproduce the barrier.

Open the WCAG review grid and contrast calculator →

W3C WAI · Forms Tutorial · User Notifications · Practical guidance · consulted 2026-10-23

CSP: Direktiven, Rückfall und Abläufe

Ausführliche Hinweise stehen in dieser Ausgabe auf Englisch zur Verfügung.

Deploy CSP with journey evidence

A monitored policy and an enforced policy have different effects. Server, CDN and proxy transformations may also result in several received policies.

  • Preserve raw policies, mode, delivery and page version.
  • Test sign-in, forms, payment and recovery within scope.
  • Connect reports, defects and stop criteria before deciding on enforcement.

Read CSP fallback orders and explore eight scenarios →

W3C · Content Security Policy Level 3 · Mike West, Antonio Sartori · Working Draft · 2026-09-16 · work in progress · §2.2.1, §3, §6.8.3–6.8.4, §8.1

Weiterführende Quellen

Originaldokumente der Organisationen, die diese Methoden und Standards verantworten.