So funktioniert es

Ein realer Rundgang durch SiteNorma mit einer Demo-Website: Sie analysieren, verstehen ein Problem, wenden die Korrektur an und prüfen das Ergebnis. Ohne Anmeldung und mit den echten Bildschirmen der Plattform.

Die Demo-Website

Beispielanalyse in SiteNorma

Demo-Website
Zapatillas Norte (fiktiv)
Datum der Analyse

Aufnahmen des echten SiteNorma-Dashboards mit einer Demo-Website, die für dieses Beispiel erstellt wurde. Die Daten der Website sind illustrativ und stammen von keinem Kunden.

  1. Website analysieren

    Sehen Sie die gefundenen Probleme und lokalisieren Sie die betroffenen Seiten.

    SiteNorma analysiert die Seiten der Website auf Desktop und Mobil. In diesem Beispiel durchläuft es 4 Seiten und findet 3 Barrierefreiheitsprobleme auf 3 davon: der Startseite, der Versandseite und der Schuhseite. Jede Seite erscheint mit Screenshot und Anzahl der Probleme.

    Übersicht: die Analyseübersicht und die analysierten Seiten. Screenshot vergrößern
    Detail: die Analysezahlen und die ersten Seiten, jeweils mit ihrer Anzahl von Problemen. Screenshot vergrößern

  2. Priorisieren und beheben

    Verstehen Sie, was zuerst zu prüfen ist, und sehen Sie einen Lösungsvorschlag zur Umsetzung auf Ihrer Website.

    Die drei Probleme im Beispiel haben hohe Priorität; das Dashboard ordnet die Liste nach Priorität und danach, wie viele Elemente und Seiten betroffen sind. Hier verfolgen wir ein einzelnes Problem: Das Sale-Banner auf der Startseite ist ein Bild mit Information (dem Rabatt) ohne Alternativtext, sodass ein Screenreader nicht sagen kann, was es zeigt. SiteNorma markiert es auf dem Seiten-Screenshot und schlägt die Schritte zur Behebung vor.

    SiteNorma ändert Ihre Website nicht. Der Vorschlag ist eine Anleitung: Sie oder Ihr Team setzen die Änderung auf der Website um und führen danach die Analyse erneut aus.

    Übersicht: das betroffene Element auf dem Seiten-Screenshot markiert, daneben die Lösung. Screenshot vergrößern
    Detail: das Problem, das betroffene Element und die Schritte der Lösung. Screenshot vergrößern
    Vorher (das Bild hat keinen Alternativtext)
    <img class="banner" src="/img/rebajas.svg"
     width="1040" height="300">
    Nachher (mit umgesetztem Vorschlag)
    <img class="banner" src="/img/rebajas.svg"
     width="1040" height="300"
     alt="Rebajas de otoño: 20 % de descuento en
          zapatillas de running hasta el 31 de octubre">

    Ein Beispiel des Vorschlags, umgesetzt auf der Demo-Website. Der Alternativtext beschreibt die Information, die das Banner liefert.

  3. Prüfen und nachkontrollieren

    Prüfen Sie die Korrektur und führen Sie die Analyse erneut aus, um zu sehen, ob das Problem noch erscheint.

    Das Team fügt den Alternativtext auf der Website hinzu und markiert die Korrektur als angewendet: Das macht sie noch nicht zu gelöst. Dann fordert es eine Prüfung dieser Seite an. Wenn die Analyse das Bild ohne Alternativtext nicht mehr erkennt, zeigt die Nachverfolgung „In der letzten Prüfung nicht erkannt“.

    Was das bedeutet und was nicht. Die Prüfung hat nur die korrigierte Seite geprüft: Die anderen beiden Probleme im Beispiel (Text mit geringem Kontrast und Feld ohne Beschriftung) sind noch offen. Und ein Problem, das nicht mehr erkannt wird, bedeutet nicht, dass die Website vollständig barrierefrei ist: Die automatische Prüfung muss durch eine manuelle Prüfung ergänzt werden.

    Übersicht: die Nachverfolgung der Korrektur nach der Prüfung. Screenshot vergrößern
    Detail: der Arbeitsstatus und das Ergebnis der Prüfung. Screenshot vergrößern

Grenzen dieser Demonstration

  • Es ist ein Beispiel mit einer fiktiven Website: Es ist weder die Analyse Ihrer Website noch eine Bewertung Ihrer Situation.
  • Die automatische Analyse erkennt einen Teil der Barrieren. Die automatische Prüfung muss durch eine manuelle Prüfung ergänzt werden.
  • Ein Problem, das nicht mehr erkannt wird, bedeutet nicht, dass die Website vollständig barrierefrei ist: nur, dass diese Prüfung es nicht mehr findet.

Das ist eine Demonstration, nicht Ihre Analyse

Wenn Sie die Adresse Ihrer Website im Formular eingeben, startet eine separate Analyse, unabhängig von diesem Beispiel und seinen Daten.

Eine Seite · Desktop und Mobil · Ohne Anmeldung

Mehr erfahren