Storyline 360: So entwerfen Sie einen barrierefreien Kurs

Letzte Aktualisierung des Artikels:

Dieser Artikel gilt für:

Beim E-Learning stellt Barrierefreiheit sicher, dass Ihre Inhalte für alle Lernenden konzipiert sind, unabhängig von ihren Fähigkeiten. Die Erstellung eines barrierefreien Kurses ist nicht nur etwas, was Sie tun müssen, um Standards wie die Web Content Accessibility Guidelines (WCAG) und Abschnitt 508 zu erfüllen. Wenn Sie die Barrierefreiheit Ihrer Inhalte verbessern, profitieren alle davon.

In diesem Artikel erfahren Sie, wie Sie Lernenden helfen können, vollständig mit Ihren Storyline 360-Kursen zu interagieren.

Denken Sie bei der Gestaltung Ihres Kurses an Barrierefreiheit

Sie möchten, dass alle Lernenden, auch solche mit Seh-, Motor-, Hör-, Sprach- oder kognitiven Behinderungen, Ihren Kurs verstehen, sich darin zurechtfinden und mit ihm interagieren. Machen Sie die Lernenden sofort mit dem Layout und dem Design vertraut, indem Sie zu Beginn Ihres Kurses Anweisungen zur Barrierefreiheit bereitstellen.

Im Folgenden finden Sie einige bewährte Methoden, auf die Sie sich bei der Gestaltung Ihres Kurses stützen können.

  • Verwenden Sie ein einheitliches Design. Ein einheitliches Design erleichtert die Navigation und das Verständnis einer Website. Formatieren Sie Textstile und Folienmaster so, wie Sie es möchten, und verwenden Sie sie dann im gesamten Kurs wieder.
  • Beseitigen Sie Ablenkungen. Vielfältige Designs können dazu führen, dass Menschen mit kognitiven Behinderungen wichtige Informationen übersehen. Sie sollten Unordnung vermeiden, animierte Objekte auf ein Minimum reduzieren, den Vollbildmodus des Player aktivieren und Leerraum verwenden, um die Lesbarkeit und Lesbarkeit zu verbessern.
  • Verwenden Sie einfache Sprache. Eine einfache und klare Sprache, die zu Ihren Inhalten passt, hilft Ihrem Publikum, die Informationen zu lesen und zu verstehen.
  • Verwenden Sie barrierefreie Schriften. Formatieren Sie Ihr Design mit einfachen und geraden Schriften, wie z. B. serifenlosen Schriften, um die Lesbarkeit zu verbessern. Verwenden Sie keine Formatierung nur in Großbuchstaben, da dies schwierig zu lesen ist.
  • Verwenden Sie beschreibende Links. Geben Sie den Lernenden Hyperlinks mit dem richtigen Kontext und geben Sie an, wohin sie durch Klicken auf den Link gelangen. Zum Beispiel sagt „hier klicken“ den Lernenden nicht, was der Link bewirkt. Verlinken Sie stattdessen auf einen bestimmten Satz: „Lesen Sie unsere Grundsatzerklärung“.
  • Geben Sie den Lernenden klares Feedback. Die Lernenden müssen eine Bestätigung erhalten, wenn sie eine Aktion abgeschlossen haben, und Fehlermeldungen sollten klare Anweisungen geben.
  • Stellen Sie textbasierte Alternativen bereit. Verwenden Sie Text, um wichtige Details zu kommunizieren. Wenn Sie Bilder oder Animationen verwenden, um wichtigen Kontext bereitzustellen, bieten Sie textbasierte Alternativen für Lernende mit Blindheit oder eingeschränktem Sehvermögen an. Verwenden Sie zum Beispiel alternativen Text (Alt), um Bilder zu beschreiben. Oder fügen Sie einen optionalen Link zu einer animierten Folie hinzu, der eine statische, textbasierte Ebene mit denselben Informationen für Lernende öffnet, die Screenreader verwenden.
  • Verwenden Sie keine blinkenden Inhalte. Bei lichtempfindlicher Epilepsie kann das Blinken Anfälle auslösen. Animationen, GIFs und Videos sollten nicht öfter als dreimal pro Sekunde blinken, blinken oder flackern.

Storyline 360 ermöglicht es Ihnen, Kurse zu erstellen, die WCAG 2.1 Level AA support. Spezifische Einzelheiten zu den Erfolgskriterien finden Sie in unserer Vorlage zur Barrierefreiheit von Produkten (Voluntary Product Accessibility Template, VPAT). Ausnahmen: Storyline 360 support 1.3.5 Identify Input Purpose für Dateneingabefelder oder 3.1.2 Language of Parts für mehrere Screenreader-Sprachen im selben Kurs nicht.

Machen Sie Inhalte für Bildschirmlesegeräte und Tastaturen zugänglich

Lernende mit Blindheit oder eingeschränktem Sehvermögen verwenden häufig Screenreader, um sich in E-Learning-Kursen zurechtzufinden. Storyline 360 unterstützt JAWS-, NVDA-, VoiceOver- und TalkBack-Screenreader mit unseren unterstützten Browsern. Andere Lernende verlassen sich möglicherweise ausschließlich auf Tastaturen oder Tastaturalternativen, um in Online-Inhalten zu navigieren. Klicken Sie hier, um Informationen darüber zu erhalten, wie Ihre Lernenden mit einer Tastatur oder einem Screenreader durch Folieninhalte navigieren.

Seheinschränkungen decken ein breites Spektrum ab, darunter Sehschwäche, Farbenblindheit und totale Blindheit. Dazu gehören auch Lernende, die aufgrund von Lernschwierigkeiten oder weil die Kurssprache für sie eine zweite Sprache ist, Schwierigkeiten haben, Text auf dem Bildschirm zu lesen. Zum Glück gibt es mehrere Möglichkeiten, Ihre visuellen Inhalte barrierefrei zu gestalten, wie unten beschrieben.

Passen Sie die Fokusreihenfolge an, um einen aussagekräftigen Kontext bereitzustellen

Die Fokusreihenfolge, die Sie für jede Folie in Storyline 360 definieren, steuert die Lesereihenfolge für Screenreader und die Tabulatorreihenfolge für interaktive Elemente wie Schaltflächen, Hotspots und Dateneingabefelder. Passen Sie die Fokusreihenfolge für jede Folie so an, dass sie am sinnvollsten ist.

Identifizieren Sie die Kurssprache

Storyline 360 fügt Ihrer veröffentlichten Datei story.html einen Sprachcode für Screenreader hinzu, der auf der Sprache basiert, die Sie für Ihre Textbeschriftungen auswählen. Sie können problemlos zu einer anderen Sprache oder einem anderen Satz von benutzerdefinierten Textbeschriftungen wechseln.

Passen Sie die Textbeschriftungen an

Bildschirmlesegeräte verwenden Textbeschriftungen, um Schaltflächen, Nachrichten, Screenreader-Anweisungen und andere Player-Bedienelemente zu beschreiben. Hier finden Sie alles, was Sie über die Arbeit mit Textbeschriftungen in Storyline 360 wissen müssen.

Erlauben Sie Lernenden, Navigationselemente von Playern zu überspringen

Ermöglichen Sie es den Lernenden, sich wiederholende Navigationen während des gesamten Kurses zu überspringen. Wenn Benutzer, die nur mit der Tastatur arbeiten, und Benutzer von Bildschirmleseprogrammen das letzte Objekt auf einer Folie hinter sich lassen, können sie zum Anfang der Folie zurückkehren und dabei alle Bedienelemente des Player umgehen. Sie können die Leertaste oder die Eingabetaste drücken, um die Tastenkombination zum Überspringen der Navigation zu aktivieren und zum Anfang der Folie zurückzukehren. Oder sie können die Tabulatortaste drücken, um zur Spielersteuerung zu gelangen.

Tipp: Die Tastenkombination „Navigation überspringen“ ist standardmäßig aktiviert, sodass die Lernenden nicht durch alle Player-Funktionen navigieren müssen, um den Folieninhalt erneut zu hören. Wenn Sie sie ausschalten müssen, können Sie die Tastenkombination zum Überspringen der Navigation deaktivieren.

Wählen Sie „Farben der sichtbaren Fokusanzeige“

Wenn Lernende mithilfe einer Tastatur navigieren, wird das aktuell ausgewählte Objekt durch eine Gliederung, die als Fokusanzeige bezeichnet wird, hervorgehoben. Ohne einen Fokusindikator wissen diese Lernenden nicht, wo sie sich auf der Seite befinden — das ist also wichtig.

In Storyline 360 können Sie zwei Fokusfarben wählen. Eine zweifarbige Fokusanzeige hilft den Lernenden, das Fokusrechteck auf dunklem und hellem Hintergrund zu erkennen.

Erhöhen Sie die Schriftgröße des Players

Als Kursautor haben Sie die vollständige Kontrolle über die Größe des Folientextes, aber was ist mit Player-Elementen wie Schaltflächen, Seitenleisten-Tabs und Popup-Meldungen? Es ist ganz einfach, die Schriftgröße in Ihren Player-Einstellungen auf einen beliebigen Prozentsatz zwischen 75 und 200% einzustellen.

Machen Sie Bilder barrierefrei

Fügen Sie alternativen Text hinzu

Inhalte, die nicht aus Text bestehen, benötigen alternativen Text (Alt-Text), um Lernenden, die unterstützende Technologien wie Bildschirmlesegeräte verwenden, ihre Bedeutung zu beschreiben. Die gute Nachricht ist, dass es einfach ist, Alternativtext in Storyline 360 hinzuzufügen.

Sie müssen nur Alt-Text zu Objekten hinzufügen, die dem Lernenden eine Bedeutung oder einen Kontext vermitteln. Verstecken Sie rein dekorative Bilder und Formen in den Tools für Barrierefreiheit, wenn sie nicht zum Zweck des Inhalts beitragen. Andernfalls werden Benutzer von Screenreadern durch unnötige Ankündigungen ermüden.

Schauen Sie sich diese Tipps zum Schreiben eines guten Alternativtextes an (Auszug aus Seite 8 unseres E-Books zur Barrierefreiheit):

  • Vermitteln Sie dieselben Inhalte und Informationen, die durch das Objekt oder Bild dargestellt werden, ohne dass Sie Text auf dem Bildschirm hinzufügen müssen.
  • Seien Sie präzise, ohne auf relevante Informationen zu verzichten.
  • Geben Sie nicht „Bild von“ und „Grafik von“ an und geben Sie nur die benötigten Informationen an.
  • Verwenden Sie keine Abkürzungen und übertriebene Satzzeichen wie ***, die Bildschirmleser nervig als „Sternchen, Sternchen, Sternchen“ lesen könnten.

Machen Sie Audio- und Videoinhalte zugänglich

Spielen Sie nicht automatisch ab

Nutzer von Screenreadern navigieren durch Zuhören. Lassen Sie also nicht zu, dass Audio- oder Videoinhalte automatisch abgespielt werden. Lassen Sie Ihre Lernenden die Playback steuern. So passen Sie die Videoeigenschaften an.

Nutzen Sie die Vorteile barrierefreier Videosteuerungen

Aktivieren Sie die barrierefreien Videosteuerungen von Storyline 360 im modernen Player, um allen Lernenden ein umfassenderes Erlebnis zu bieten.

Fügen Sie Untertitel hinzu

Untertitel sind eine Textversion des Audiomaterials, die benötigt wird, um den Inhalt zu verstehen. Importieren Sie Untertitel oder erstellen Sie Untertitel direkt in Storyline 360 mit dem integrierten Editor. Das ist einfach zu bewerkstelligen und bringt große Dividenden.

Außerdem sind Untertitel nicht nur für taube oder schwerhörige Lernende geeignet. Wenn es sich bei Ihrem Kurs um eine zweite Sprache für Lernende handelt, können Untertitel ihnen helfen, den Inhalt vollständig zu verstehen. Und auch Lernende in lauter Umgebung werden Bildunterschriften zu schätzen wissen.

Stellen Sie ein Transkript zur Verfügung

Transkripte sind Audiodateien, die in geschriebenen Text umgewandelt werden. Sie unterscheiden sich von Untertiteln, bei denen es sich um zeitkodierte Frames handelt. Generieren Sie automatisch synchronisierte Videotranskripte aus Untertiteln.

Text zugänglich machen

Verwenden Sie ein Kontrastverhältnis von 4, 5:1

Manche Lernende haben eher ein geringes Sehvermögen als eine totale Blindheit. Um Ihren Kurs auch für sehbehinderte Lernende zugänglich zu machen, verwenden Sie Bildschirmtext mit einem Kontrastverhältnis von 4, 5:1 oder höher zur Hintergrundfarbe.

Wenn Sie Text über ein Hintergrundbild legen, reduzieren Sie die Helligkeit und den Kontrast des Bildes, damit der Text besser lesbar ist. Oder platzieren Sie eine halbtransparente Form zwischen dem Bild und dem Text, um das Kontrastverhältnis zu erhöhen.

Um das Kontrastverhältnis schnell zu ermitteln, probieren Sie diesen webbasierten Kontrastprüfer aus oder laden Sie dieses Tool zur Kontrastprüfung herunter.

Bieten Sie eine Audioalternative für Text auf dem Bildschirm an

Einige Lernende können Ihren Kurs vielleicht sehen, hören aber lieber zu als zu lesen. Möglicherweise haben sie Lernschwierigkeiten wie Legasthenie, können nicht gut lesen oder befinden sich in einer geschäftigen Umgebung, in der sie sich nicht auf den Bildschirm konzentrieren können. Oder vielleicht ist Ihre Kurssprache eine zweite Sprache für sie. Erwägen Sie, diesen Lernenden eine Audioversion von textbasierten Folien anzubieten. Sie könnten beispielsweise eine optionale Erzählung abspielen, wenn die Lernenden auf ein Lautsprechersymbol klicken oder eine Tastenkombination drücken.

Lassen Sie Storyline 360 Ihren Text schnell in Sprache umwandeln, wenn das Aufzeichnen von Erzählungen überwältigend erscheint. Sie können sogar Stimme und Sprache wählen, um sicherzustellen, dass jedes Wort richtig klingt.

Verwenden Sie barrierefreien Text, Textstile und automatische Textanpassung

Der barrierefreie Text in Storyline 360 ermöglicht es den Lernenden, die Größe und den Stil des Textes mithilfe benutzerdefinierter Stylesheets oder Browsererweiterungen zu personalisieren, sodass er lesbarer und zugänglicher ist als je zuvor.

Barrierefreie Textstile in Storyline 360 sorgen für mehr Designkonsistenz und helfen Screenreadern. Das liegt daran, dass Textstile dieselbe Informationshierarchie wie Screenreader haben, sodass sie Überschriften, Hyperlinks, Zitate und Absätze identifizieren und ankündigen können.

Ein weiterer wichtiger Aspekt, den Sie berücksichtigen sollten, ist die Textgröße. Denn wenn Ihr Exemplar zu klein ist, könnten die Lernenden Schwierigkeiten haben, es zu lesen. Dank der Verbesserungen bei der automatischen Textanpassung können Sie Textfelder auf eine feste Größe festlegen, ohne dass der Text verkleinert wird, falls er zu lang wird. So können Sie sicher sein, dass Ihre Lernenden ihn problemlos lesen können.

Aktivieren Sie die Steuerung der Barrierefreiheit

Ermöglichen Sie es den Lernenden, ihr Erlebnis zu personalisieren, indem Sie die Bedienelemente für die Barrierefreiheit im Kursplayer aktivieren. Diese Steuerungen ermöglichen es den Lernenden, den Zoom-Modus zu ändern, barrierefreien Text ein- oder auszuschalten und Tastenkombinationen umzuschalten.

Interaktive Inhalte barrierefrei machen

Durch die Erstellung interaktiver Inhalte bleiben Ihre Lernenden motiviert. Die beiden häufigsten interaktiven Elemente sind Navigationsfunktionen und Quizfragen. Darüber hinaus verfügt Storyline 360 über viele interaktive Objekte wie Schaltflächen und Dateneingabefelder, mit denen Sie interaktive Folien erstellen können.

Verlassen Sie sich nicht allein auf Farbe, um Bedeutung zu vermitteln

Wenn Sie Farben verwenden, um einen wichtigen Kontext oder eine Bedeutung zu vermitteln, bieten Sie farbenblinden Lernenden entsprechende Text-, Audio- oder Bilddateien an. Wenn Sie beispielsweise Grün verwenden, um eine richtige Antwort anzuzeigen, und Rot, um auf eine falsche Antwort hinzuweisen, fügen Sie Audio- oder Bildschirmtext hinzu, um Lernenden, die nicht zwischen Grün und Rot unterscheiden können, dieselben Informationen zu vermitteln.

Verlassen Sie sich bei der Identifizierung von Hyperlinks auch nicht allein auf die Farbe. Unterstreichen Sie beispielsweise Text mit einem Link und stellen Sie Anweisungen für Bilder mit Links bereit, damit die Lernenden wissen, dass sie interaktiv sind.

Idealerweise ist es am besten, mit jemandem zusammenzuarbeiten, der farbenblind ist, damit Sie die bestmögliche Erfahrung erzielen können. Color Oracle ist ein kostenloser Farbenblindheitssimulator, falls das keine Option ist. Es macht das Rätselraten beim Designen für Farbenblindheit überflüssig, indem es Ihnen zeigt, was die Leute in Echtzeit sehen werden.

Verlassen Sie sich bei der Anzeige von Details nicht nur auf Hover States

Hover-Zustände (d. h. Rollover-Effekte, für die eine Maus erforderlich ist) eignen sich zwar hervorragend, um Interaktivität zu vermitteln, aber verlassen Sie sich nicht darauf, dass sie wichtige Informationen anzeigen. Erwägen Sie die Bereitstellung einer Alternative, auf die über die Tastatur zugegriffen werden kann, wenn Sie den Mauszeiger über den Mauszeiger bewegen, um Text oder Bilder anzuzeigen. Es ist beispielsweise in Ordnung, die Farbe einer Schaltfläche zu ändern, wenn der Mauszeiger darüber bewegt wird, um anzuzeigen, dass es sich um ein anklickbares Objekt handelt. Dennoch möchten Sie Feedback-Text nicht anzeigen, wenn Sie mit der Maus darüber fahren, ohne eine andere Möglichkeit für den Zugriff auf die Informationen bereitzustellen. Eine Alternative für dieses Beispiel wäre eine Tastenkombination, mit der eine Audioversion des Feedbacks für Benutzer abgespielt wird, die keine Maus verwenden.

Legen Sie keine Zeitlimits fest

Timer können den Lernenden daran hindern, die von Ihnen hinzugefügten barrierefreien Alternativen zu nutzen, oder sie können zu einem Fokushindernis führen. Vermeiden Sie Quiz-Timer und verwenden Sie nach Möglichkeit keine Trigger, um zeitgesteuerte Interaktionen zu erstellen.

Bieten Sie Tipps zu Quizfragen an

Wenn für eine Quizfrage mehr als eine Antwortoption zulässig ist, fügen Sie Anweisungen für Benutzer von Bildschirmleseprogrammen hinzu. Zu den Beispieltipps gehören: Es sind mehrere Antworten möglich, Wählen Sie alle zutreffenden Antworten aus und füllen Sie die Lücke aus.

Erstellen Sie barrierefreie Folien mit Quizergebnissen

Storyline 360 enthält barrierefreie Folienvorlagen für Quizergebnisse mit frischen Designs, die den Richtlinien für Farbe, Kontrast und Fokus entsprechen, sowie die Option, benutzerdefinierte Themenfarben für richtige und falsche Quizelemente zu definieren. Verwenden Sie die neuen Vorlagen für Ergebnisfolien, um schnell Quizergebnisse zu erstellen, auf die standardmäßig zugegriffen werden kann.

Stellen Sie Alternativen für Drag-and-Drop-Interaktionen bereit

Drag-and-Drop-Interaktionen erfordern eine Maus zur Navigation, was sie für Lernende mit eingeschränkter Mobilität schwierig oder unmöglich macht. Wenn Sie sie zu Ihrem Kurs hinzufügen, stellen Sie textbasierte oder tastaturgesteuerte Alternativen bereit. Sie könnten beispielsweise eine Interaktion verwenden, auf die über die Tastatur zugegriffen werden kann, z. B. eine passende Frage oder eine Slider-Interaktion. Sie könnten den Lernenden auch eine detaillierte Textbeschreibung der Informationen geben, die sie aus der Interaktion benötigen.

Möchten Sie eine Drag-and-Drop-Interaktion entwerfen, auf die über die Tastatur zugegriffen werden kann? Schauen Sie sich das herunterladbare Beispiel von Sarah Hodge und das kostenlose Webinar an, in dem sie erklärt, wie man es erstellt.

360°-Bildern Barrierefreiheit verleihen

Ein 360°-Bild ist ein Panoramafoto, das immersive Lernerlebnisse wie virtuelle Touren und Erkundungsaktivitäten ermöglicht.

Fügen Sie in 360°-Interaktionen Alternativtext zu den Medien, Schaltflächen, Markierungen und Hotspot-Beschriftungen hinzu, damit alle Lernenden dasselbe ansprechende Erlebnis haben. Wir haben eine integrierte barrierefreie Navigation integriert, sodass Ihre Lernenden eine Tastatur oder einen Screenreader verwenden können.

Verwenden Sie Dialogebenen

Verwandeln Sie eine Standardebene in eine Dialogebene, um Interaktionen noch intuitiver und umfassender zu gestalten. Wenn Lernende auf eine Dialogebene stoßen, bleibt der Tastaturfokus auf dem modalen Dialog und seinem Inhalt, indem alles andere im Browserfenster abgeblendet wird, sodass die Lernenden mit nichts anderem im Kurs interagieren können, solange die Ebene geöffnet ist.

Die Lernenden können mit einem Screenreader oder einer Tastatur durch die Dialogebenen navigieren. Verbessern Sie das Screenreader-Erlebnis für Dialogebenen, indem Sie Barrierefreiheitsattribute für einen alternativen Titel und eine alternative Beschreibung definieren.

Holen Sie sich Hilfe, wenn Sie sie brauchen

Willst du tiefer gehen? Schauen Sie sich unser Storyline 360 Voluntary Product Accessibility Template® (VPAT®), unseren Accessibility Index, unser kostenloses E-Book zur Gestaltung barrierefreier E-Learning-Angebote und Webinare zum Thema Barrierefreiheit an.

Besuchen Sie auch https://webaim.org für umfassende Lösungen zur Barrierefreiheit im Internet, einschließlich training, Tools und Community-Support.

Und wenn Sie Hilfe benötigen, stellen Sie einfach eine Frage bei E-Learning Heroes, der größten und engagiertesten E-Learning-Community der Welt. Es gibt über 1.000.000 Mitglieder, die gerne helfen. Die Chancen stehen gut, dass jemand bereits ein Problem gelöst hat, das Sie gerade haben, und wird die Weisheit haben, es mit Ihnen zu teilen.