Um was geht es?
Das Lernziel dieses Leitfadens ist es, die Verwendung des Blocks "Barrierefreiheit überprüfen" zu vermitteln, um die Barrierefreiheit von Kursräumen in campUAS zu überprüfen. Der Leitfaden enthält Informationen zur Verwendung des Tools und zur Interpretation des resultierenden Berichts, um Fehler in Kursaktivitäten zu identifizieren und zu beheben.
Der Block "Barrierefreiheit prüfen", den die Lehrenden ihrem Kurs hinzufügen können, überprüft Ihren Lernraum auf einige Kriterien der Barrierefreiheit. Das Tool analysiert den Kursraum und stellt Ihnen einen Bericht zur Verfügung, in dem die Fehler in Ihren Aktivitäten aufgelistet sind.
Wie geht das?
Wie benutze ich das Tool?
Um den Kurs mit dem Tool zu analysieren, fügen Sie den Block "Barrierefreiheit prüfen" hinzu. Dazu schalten Sie den Bearbeiten-Modus in Ihrem Kurs ein. Wählen Sie in der Blockleiste auf der rechten Seite die Option "Block hinzufügen" und anschließend aus der angezeigten Liste die Option "Barrierefreiheit prüfen" aus.
In der Blockleiste wird Ihnen der Barrierefreiheitsblock angezeigt und Sie können Ihren Kurs zur Analyse einreichen, indem Sie auf die Schaltfläche "Zur Analyse einreichen" klicken.
Die Analyse dauert in der Regel einige Minuten. Danach wird das Ergebnis als Anzahl der Fehler pro Inhaltstyp angezeigt: Bild, Darstellung, Link, Medien, Tabelle und Text.
Sie sehen auch eine Heatmap im Kurs, die anzeigt, welche Aktivitäten den Test bestanden haben. Sie können diese Heatmap jederzeit deaktivieren, indem Sie auf das Augensymbol im Barrierefreiheitssblock klicken. Bitte beachten Sie, dass die Heatmap derzeit nicht im Kachelformat angezeigt wird.
Über das Diagramm-Icon unten im Barrierefreiheitsblock können Sie sich die Liste der Fehler mit den Details anzeigen lassen.
In der Fehlerliste wird Ihnen angezeigt, welche Aktivitäten in Ihrem Kurs betroffen sind und welcher Fehler vorliegen. Über die Fehlerliste können Sie auch direkt die betroffene Aktivität bearbeiten. Einige Fehler sind weniger kritisch als die anderen. Sehen Sie dafür den Abschnitt "Mögliche Fehler und Ihre Behebung" oder kontaktieren Sie uns über unser Kundencenter.
Mögliche Fehler und ihre Behebung
Die nachstehende Tabelle enthält einige Fehler, die im Prüfbericht aufgeführt werden können.
| Fehlermeldung | Erläuterung | Lösung |
|---|---|---|
| Eine Überschrift 'h3 ... h5' muss Text enthalten, um wahrnehmbar zu sein. | Eine Stelle im Text wird als Überschrift markiert, ohne dass es sich um eine Überschrift handelt. In der HTML-Ansicht sieht der Code für solche Überschrift, z.B. so <h5><br></h5> aus. Dies kann passieren, wenn Sie z.B. vor oder nach dem Einfügen der Überschrift Leerzeilen einfügen. | Entfernen Sie das entsprechende Element. Dafür können Sie zur HTML-Ansicht im Editor wechseln, auf diese Weise erkennen Sie am besten, welches Element betroffen ist. Entfernen die leere Überschriftszeile, z.B. "<h5><br></h5>". |
| Überschriften, die nach h3-Überschriften folgen (große Überschriften im Editor), sollten die Hierarchie der Seitenüberschriften nicht durchbrechen. | Wenn die Überschriften in Ihrem Text nicht hierarchisch angeordnet sind, z.B. Überschrift der Ebene 4 → Überschrift der Ebene 3 → Überschrift der Ebene 5. | Passen Sie die Überschriften so an, dass die Hierarchie passt und keine Überschriftenebene übersprungen wird. |
| Der Farbkontrast zwischen Text und Hintergrund ist zu gering | Der geringe Farbkontrast zwischen dem Text und dem Hintergrund führt dazu, dass der Text schlecht / schwer lesbar ist. | Ändern Sie eine der beiden Farben (oder beide), sodass der Text besser lesbar wird. Mit dem Kontrastrechner von Leserlich.info können Sie individuelle Farbwerte für Zeichen- und Hintergrundfarben auf ihre ausreichende Kontrastfähigkeit überprüfen |
| Links, die sich in einem neuen Fenster öffnen, sollten im Voraus einen Hinweis zeigen. | Sobald beim Link die Einstellung "im neuen Fenster öffnen" aktiviert ist, kommt dieser Hinweis. Grundsätzlich wird davon abgeraten, dass sich jeder Link in einem neuen Fenster öffnet, weil die Nutzerinnen nicht direkt zurücknavigieren können, was z.B. für die Screenreader-Nutzerinnen problematisch sein kann. | Sie können den Link im gleichen Fenster lassen. Manchmal ist es natürlich sinnvoll, dass sich bestimmte Links in einem neuen Fenster öffnen. Verwenden Sie in diesem Fall eine konsistente Verlinkung in Ihrem Kurs: Lassen Sie z.B. Links auf Inhalte innerhalb von campUAS im selben Fenster öffnen. Links zu externen Webseiten können in einem neuen Fenster geöffnet werden. Bei den Links, die sich in einem neuen Fenster öffnen, können Sie dem Link einen Hinweis hinzufügen, z.B. zur Handreichung Barrierefreiheit in der Online-Lehre (öffnet sich im neuen Link). Bei der aktuellen Version des Tools wird die Fehlermeldung weiterhin angezeigt. Sie können diese Fehlermeldung vorerst ignorieren. |
| Bei Tabellen sollten idealerweise die Header nicht fehlen. | Die Tabellen sollten Kopfzeilen enthalten, damit sie besser navigierbar sind. Grundsätzlich ist auch immer zu überlegen, ob die Tabelle eine geeignete Darstellungsform für die Vermittlung der Lerninhalte ist. | Versehen Sie Ihre Tabelle mit Kopfzeile. |
Fehlende Überschriften machen Inhalte weniger strukturiert und schwerer lesbar. | Diese Meldung kommt, wenn Sie einen längeren Text haben, der mit keinen oder nur ganz wenigen Überschriften versehen ist. | Sie können passende Überschriften hinzufügen, wenn dies zu Ihrem Lerninhalt passt. |
Der alternative Text 'alt' bei Bildern sollte bei Bildelemente immer vorhanden sein, außer die Bilder sind rein dekorativ oder haben keine Bedeutung. | Dieser Fehler kommt vor, wenn Sie die Bilder aus anderen Quellen direkt in ein Textfeld mit Strg + V einfügen. Wenn Sie die Bilder über die entsprechende Schaltfläche im Texteditor einfügen, tritt dieses Problem in der Regel nicht auf, da Sie beim Einfügen aufgefordert werden, den Alternativtext zu hinterlegen. | Nutzen Sie am besten immer die Option zum Hochladen des Bildes im Text-Editor. Sollte der Alternativtext beim eingefügten Bild jedoch fehlen, können Sie das Bild anklicken und in den Bildeigenschaften den Alternativtext anpassen. |
Die Gesamtlänge des Seiteninhalts sollte 500 Wörter nicht überschreiten. | Diese Meldung bezieht sich nicht auf Textdokumente, die Sie als Dateien hochladen. | Wenn Ihr Text nicht verkleinert werden kann oder sollte, können Sie diese Meldung vorerst ignorieren. |
| Bold-Elemente 'b' sollten nicht verwendet werden Besser ist stattdessen 'strong. | Der fett markierte Text ist auf der HTML-Ebende mit einem <b>-Tag statt des empfohlen <strong>-Tags versehen. Das kann passieren, wenn man den Text aus anderen Quellen kopiert, z.B. aus Word oder von anderen Websites. Wenn der Text direkt im Text-Editor fett markiert wird, wird er auf der HTML-Ebene mit einem richtigen Tag versehen. Es handelt sich um keinen kritischen Fehler. | Auch wenn es um keinen kritischen Fehler handelt, können Sie eine Korrektur vornehmen. Wechseln Sie dafür zur HTML-Ansicht im Editor und finden Sie die Textteile, die mit dem Tag <b></b> markiert sind und ersetzen Sie diese durch die Tags <strong></strong> an den entsprechenden Stellen. Die Korrektur ist auch außerhalb der HTML-Ansicht möglich. Dazu können Sie fettmarkierte Textteile auswählen, die Fettmarkierung über Text-Editor deaktivieren und danach wieder anklicken. Dadurch werden auf der HTML-Ebene die richtigen Tags auch gesetzt. |
| Italic-Elemente 'i' sollten nicht verwendet werden. Besser ist stattdessen 'em' (emphasis). | Der kursiv markierte Text ist auf der HTML-Ebene mit <i>-Tag statt des empfohlenen <em>-Tags markiert. Das kann passieren, wenn man den Text aus anderen Quellen kopiert, z.B. aus Word oder von anderen Websites. Wenn der Text direkt im Text-Editor kursiv markiert wird, wird er auf der HTML-Ebene mit einem richtigen Tag versehen. Es handelt sich um keinen kritischen Fehler. Grundsätzlich ist immer abzuwägen, ob kursive Schrift verwendet werden soll, da sie als schlecht lesbar gilt. | Auch wenn es um keinen kritischen Fehler handelt, können Sie eine Korrektur vornehmen. Wechseln Sie dafür zur HTML-Ansicht im Editor und finden Sie die Textteile, die mit dem Tag <i></i> markiert sind und ersetzen Sie diese durch die Tags <em></em> an den entsprechenden Stellen. Die Korrektur ist auch außerhalb der HTML-Ansicht möglich. Dazu können Sie kursiv markierte Textteile auswählen, die Kursivmarkierung über Text-Editor deaktivieren und danach wieder anklicken. Dadurch werden auf der HTML-Ebene die richtigen Tags auch gesetzt. |
Deaktivierungs des Tools
Die Deaktivierung der Prüfung auf Barrierefreiheit ist durch Entfernen des Blocks in der Blockleiste möglich.
Grenzen des Tools
An der Frankfurt University of Applied Sciences wird das Brickfield-Tool in einer kostenlosen Version mit eingeschränktem Funktionsumfang zur Verfügung gestellt. Auch dieses Tool kann prinzipiell keine vollständige Überprüfung der Barrierefreiheit durchführen und ist ein unterstützendes Werkzeug, eine zusätzliche manuelle Überprüfung bleibt wichtig.
Außerdem prüft das Tool nicht die Dateien, die in den Kurs hochgeladen werden, wie z.B. PDFs, Word-Dokumente oder PowerPoint-Präsentationen. Um auch diese Lernmaterialien barrierefrei zu gestalten, ist es wichtig, die Grundsätze der barrierefreien Gestaltung von Lernmaterialien zu beachten. Informationen zur barrierefreien Gestaltung von Lernmaterialien finden Sie in unserer Anleitung Barrierearme digitale Lernmaterialien (Text und Präsentationen) sowie in einem Selbstlernkurs Digitale Barrierefreiheit in der Lehre.
Brauchen Sie die Unterstützung oder Beratung zur Barrierefreiheit von Ihrem Kurs, können Sie mit uns einen Beratungstermin über unser Kundencenter vereinbaren.
