Standaard wordt de Eye-Able® assistentiesoftware in een website geïntegreerd als een vast pictogram ten opzichte van de viewport. Deze prominente positie in combinatie met pictogrammen met een hoog contrast heeft in gebruikerstests bewezen gebruiksvriendelijk te zijn, zelfs voor gebruikers met een ernstig verminderd gezichtsvermogen. Eye-Able® kan echter ook zonder problemen rechtstreeks in de website worden geïntegreerd. Dit maakt integratie in de navigatiebalk of andere bestaande containers mogelijk.
Elk element op de pagina kan worden gebruikt als alternatief voor het gewone pictogram. De "open en sluit" functies van het gewone pictogram zijn gekoppeld aan dit element. Het nieuwe doelelement moet hiervoor worden gemaakt of aangepast!
Om de link te maken, moet de CSS ID"eyeAble_customToolOpenerID" worden toegevoegd aan het nieuwe doelelement. Zodra een element met deze ID bestaat op een pagina, wordt het gewone logo verborgen en wordt een overeenkomstige EventListener toegevoegd aan deze gebeurtenis. De positie van de werkbalk is nog steeds waar deze zou zijn met het gewone logo.
Als er meerdere knoppen voor openen/sluiten moeten worden ingesloten, moet de CSS-klasse "eyeAble_customToolOpenerClass" ook worden gebruikt. Het gedrag is identiek aan de CSS ID methode.
Opmerking: op alle subpagina's waarop geen dergelijk element met de ID eyeAble_customToolOpenerID of eyeAble_customToolOpenerClass klasse wordt het gewone logo verder weergegeven!
Als Eye-Able moet worden gekoppeld aan een element op de pagina zonder het hoofdlogo te verbergen, moet de "eyeAble_customToolOpenerNoHideClass" CSS-klasse worden gebruikt.
Het is ook mogelijk om de Eye-Able werkbalk direct via een link te openen. Om dit te doen, stel je gewoon "javascript:EyeAbleAPI.toggleToolbar()" in als het doel van de link .
Zorg ervoor dat het toegangspunt voor Eye-Able bereikbaar is met het toetsenbord en tekst bevat die toegankelijk is voor schermlezers. Een mogelijke labeling zou zijn: "Open software voor visuele assistentie. Toegankelijk met het toetsenbord via ALT + 1".
Voor demonstratiedoeleinden wordt deze insluiting uitgevoerd op deze pagina met het volgende logo:
U kunt het Eye-Able logo hier downloaden en invoegen (of als SVG hier):
![Eye-Able Logo - mannetje voor zwarte achtergrond](https://eye-able.com/wp-content/uploads/2021/05/Eye-Able-Icon-150x150.png)