Geschrieben von Tobias Greiner am 01. August 2023

Integration mit dynamischen Nachladen

Accessibility

Integration mit dynamischen Nachladen

Code in different colours is depicted.Neben dem direkten Laden der Eye-Able Assets vom Eye-Able- oder lokalen Server gibt es auch die Möglichkeit die Daten von Eye-Able erst mit Klick auf das Icon zu laden. Dies hat den Vorteil, dass nur Nutzer der Seite die auch mit Eye-Able interagieren eine Verbindung zum Server aufnehmen und die Javascript Dateien laden. Auch Datenschutzrechtlich hat diese Einbindung Vorteile, da hierbei der Nutzer vor dem Kontakt zum Eye-Able Server auf diese ausgehende Verbindung hingewiesen wird.

Depiction of the Eye-Able visual Help logoHinweis für Nutzer die Eye-Able noch nicht verwendet haben

Mit der ersten Verwendung von Eye-Able wird ein Local Storage Eintrag gesetzt. Sobald dieser Eintrag gesetzt ist wird Eye-Able beim nächsten Besuch der Seite automatisch geladen.

 

Integration in das HTML der Seite

 Für die Einbindung von Eye-Able müssen Sie einfach nur die Javascript Datei über ein <script>-Element im HTML der Seite platzieren. Dafür können Sie entweder die Javascript Datei hochladen und diese dann referenzieren:

 Code to integrate Eye-AbleBeispiel der Einbindung der JavaScript Datei nach vorherigen Upload

Sie können den Code der Javascript Datei auch inline in einem <script>-Element integrieren:

 Beispiel einer inline Einbindung des formatierten Codes

Über die Javascript-Datei werden Funktionen für das dynamische Nachladen und das Eye-Able-Icon direkt in die Seite eingebunden. Sie können auch selbst die Position des Eye-Able Icons bestimmen. Ändern Sie hierzu folgende Variablen am Beginn des Codes ab:

  • eA_top : Ändert die Top-Position des Icons z.B. „15%“, oder „250px“

  • eA_side: Ändert die seitliche Position des Icons: „left“ oder „right“

  • eA_bottom: Ändert die Bottom-Position des Icons auf mobile Geräten z.B. „15%“

Depiction of CodeTeil des Integrationscodes zur Anpassung der Position

Sebastian Fjeld

Sebastian Fjeld gehört als professioneller Sprecher und Texter von Anfang an zum Eye-Able®-Team. Er hat "voice acting" an einer Universität studiert und wurde von Schauspielern ausgebildet. Derzeit absolviert er eine Ausbildung zum Dolmetscher für verschiedene Sprachen.

Weitere Beiträge

Falls es etwas mehr sein darf

Filter

Filter nach Kategorie

Bestätigen Sie nach Auswahl der Kategorien Ihre Eingabe mit dem Button am Ende der Liste

Filter zurücksetzen
Laptop mit Elektronik-Website, Schweden Flagge und Lupe mit Barrierefreiheitssymbolen

Schweden startet Prüfungen zur Barrierefreiheit von Online-Shops

Geschichte lesen
Frau mit Laptop mit Schriftzügen B2B, B2C und B2G

Gilt das BFSG auch für den B2B-Bereich?

Geschichte lesen
Frau mit Laptop und Weltkarte im Hintergrund.

Eye-Able als Alternative: Warum einzelne Tests nicht genug sind

Geschichte lesen
Illustration eines Eisbergs, umgeben von Symbolen für Prüfung, Technik, Feedback, Dokumentation und Auszeichnung – als Sinnbild für sichtbare und unsichtbare Aspekte digitaler Barrierefreiheit.

Wie erkennt man eine wirklich barrierefreie Website?

Geschichte lesen

Sie benötigen weitere Informationen?

Schreiben Sie uns und wir helfen Ihnen gerne weiter.

A man and a woman look at a monitor and laugh