Werken tooltips op mobiel?
Tooltips werken op mobiel alleen als je ze op een tik laat reageren. Zweven bestaat op een aanraakscherm niet, dus een tooltip die daarop wacht verschijnt nooit.
Dat is de belangrijkste beperking.
En het raakt inmiddels de meerderheid van je bezoekers.
Wat er misgaat
Een tik op een element met een tooltip opent soms de tooltip, soms de link eronder. Dat verschilt per browser.
Meer daarover lees je bij mobile first.
Het titelattribuut
Dat toont op een telefoon helemaal niets. De informatie is er dus wel, maar niemand ziet hem.
Meer daarover lees je bij frontend.
Hoe je het oplost
Laat je tooltip openen bij een tik en sluiten bij een tik daarbuiten. Dan is hij bereikbaar.
Meer daarover lees je bij accessibility.
Mijn vuistregels
- Openen bij zweven én bij tikken.
- Sluiten bij een tik daarbuiten.
- Raakvlak van minstens vierenveertig pixels.
- Of gewoon: zichtbare tekst gebruiken.
Die laatste is bijna altijd de betere keuze op een telefoon.
Het ruimteprobleem
Een ballonnetje op een smal scherm valt vaak half buiten beeld. Zorg dat hij zich naar binnen verplaatst.
Meer daarover lees je bij navigatie.
De eerlijke conclusie
Op een telefoon is een tooltip zelden de beste oplossing. Zichtbare tekst is duidelijker en kost je niets.
Meer daarover lees je bij wanneer je een tooltip gebruikt.