Oriëntatievergrendeling
Silktide controleert of je pagina's bezoekers niet dwingen hun apparaat op een bepaalde manier vast te houden. Een pagina moet zowel in staande als liggende oriëntatie werken, omdat sommige mensen hun scherm niet kunnen draaien.
Twee veelvoorkomende patronen vergrendelen de oriëntatie van een pagina: code die de functie voor het vergrendelen van de oriëntatie van de browser aanroept, en stijlen die de hele pagina verbergen met een bericht als "draai je apparaat" totdat het apparaat wordt gedraaid.
Waarom dit belangrijk is
Veel mensen kunnen hun apparaat fysiek niet draaien: een tablet die aan een rolstoel is bevestigd, een telefoon in een vaste houder of een scherm dat aan hardware voor is bevestigd, wordt vaak permanent in één oriëntatie geïnstalleerd. Anderen hebben beperkte grip of motorische controle, waardoor het draaien van een apparaat moeilijk is. Voor deze bezoekers is een pagina die op één oriëntatie staat simpelweg onbruikbaar: ze zien een leeg scherm of een prompt om het apparaat te draaien waaraan ze nooit kunnen voldoen.
Zo los je dit op
- Verwijder code die de oriëntatie vergrendelt, zoals aanroepen van
screen.orientation.lock():
// Probleem: dwingt de liggende oriëntatie af en werkt niet voor gebruikers die hun apparaat niet kunnen draaien
screen.orientation.lock("landscape");
- Verwijder stijlen die de pagina in één oriëntatie leeg maken:
/* Probleem: verbergt alles totdat het apparaat wordt gedraaid */
@media (orientation: portrait) {
body { display: none; }
}
- Ontwerp in plaats daarvan de lay-out zo dat deze zich aan beide oriëntaties aanpast. Mediaquery's voor de oriëntatie zijn prima om de lay-out aan te passen, maar gebruik ze nooit om de pagina te verbergen.
Zo test Silktide dit
- Onderzoek de scripts die in elke pagina zijn opgenomen en rapporteer alle
scripts die een functie voor het vergrendelen van de oriëntatie aanroepen,
zoals
screen.orientation.lock()of het ouderelockOrientation(). - Onderzoek de stijlen die in elke pagina zijn opgenomen en rapporteer elke
mediaquery voor de oriëntatie die de hele pagina verbergt door
display: nonein te stellen op de body van de pagina. - Stijlen die de lay-out alleen per oriëntatie aanpassen, worden niet gerapporteerd: is geen vergrendeling.
Problemen oplossen
Mijn vergrendeling van de oriëntatie staat in een extern bestand
Silktide onderzoekt de scripts en stijlen die in de pagina zelf zijn opgenomen. Een vergrendeling die vanuit een afzonderlijk script- of stylesheetbestand wordt toegepast, wordt niet gedetecteerd, maar heeft wel hetzelfde effect op bezoekers: de bovenstaande richtlijnen blijven van toepassing.
Mijn inhoud heeft echt één oriëntatie nodig
Een paar dingen zijn essentieel in één oriëntatie, bijvoorbeeld een piano-app of een scanner voor bankcheques. Als dat voor jouw situatie geldt, kun je de bevinding .