ūüéČ Early-Bird-Aktion: Spare nur noch im Juni 10% auf Deine Assistenzsoftware mit dem Code "Free10"!

Einbettung von Eye-Able direkt in die Seite

Teilen ist erw√ľnscht:

Share on linkedin
Share on facebook
Share on email
Dieses Bild zeigt einen Schreibtisch mit vielen Bildschirmen in k√ľhler Athmosph√§re.

Standardm√§√üig ist die Eye-Able¬ģ Assistenzsoftware als, relativ zum Viewport fixiertes, Icon auf einer Webseite eingebunden. Diese pr√§sente Position in Verbindung mit kontrastreichen Icons hat sich in Nutzertests als gut bedienbar bew√§hrt, auch bei stark seh-eingeschr√§nkten Nutzern. Eye-Able¬ģ l√§sst sich jedoch auch problemlos direkt in die Webseite einbetten. So wird eine Integration in die Nav-Leiste oder andere bestehende Container m√∂glich.

Als Alternative zu dem regul√§ren Icon kann ein beliebiges Element auf der Seite genommen werden. Mit diesem Element wird die ‚Äě√Ėffnen und Schlie√üen‚Äú Funktionen des regul√§ren Icons verkn√ľpft. Das neue Ziel-Element muss daf√ľr selbst erstellt bzw. angepasst werden!

Um die Verkn√ľpfung herzustellen muss dem neuen Ziel-Element die CSS-ID ‚ÄěeyeAble_customToolOpenerID‚Äú hinzugef√ľgt werden. Sobald ein Element mit dieser ID auf einer Seite existiert, wird das √ľbliche Logo ausgeblendet und diesem Event ein entsprechender EventListener hinzugef√ľgt. Die Position der Toolbar ist weiterhin dort, wo Sie sich mit dem regul√§ren Logo befinden w√ľrde.


Wenn mehrere Schalter zum √Ėffnen/Schlie√üen eingebettet werden sollen kann ebenfalls die CSS-Klasse ‚ÄěeyeAble_customToolOpenerClass‚Äú verwendet werden. Das Verhalten ist identisch zu der CSS-ID Methode.

 

Hinweis: Auf allen Unterseiten, auf denen es kein solches Element mit der eyeAble_customToolOpenerID-ID oder eyeAble_customToolOpenerClass-Klasse  gibt, wird weiter das regul√§re Logo angezeigt!

Wenn Eye-Able mit einem Element auf der Seite verkn√ľpft werden soll, ohne das Hauptlogo auszublenden, kann die ‚ÄěeyeAble_customToolOpenerNoHideClass‚Äú CSS-Klasse verwendet werden.


Zu Demonstrationszwecken ist diese Einbettung auf dieser Seite mit folgendem Logo durchgef√ľhrt:

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht.

Interesse geweckt? Wir helfen Ihnen gerne weiter.

Mit √ľber 25 Funktionen rund um die digitale Barrierefreiheit hilft Eye-Able auch Ihnen dabei, Ihre Barrieren nachhaltig zu reduzieren. So machen Sie Ihre Informationen zug√§nglich f√ľr alle und schlie√üen keine Besucher*innen aus – kurzum: Sie erschlie√üen eine neue Zielgruppe, ganz ohne hohe Marketing-Volumina.

Unverbindliches Beratungsgespräch zur digitalen Barrierefreiheit im Allgemeinen

Erörterung möglicher Optimierungspotentiale auf Ihrer Website

Vorstellung der Assistenzsoftware direkt auf Ihrer Website

Weitere Beiträge

Falls es etwas mehr sein darf.

Das Bild zeigt Code in einer Computer-Konsole.

Integration mit dynamischen Nachladen

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