Chrome heeft zich aangepast aan het Android-tabletecosysteem door de desktopmodus standaard in te schakelen op premium tablets. In deze blogpost wordt uitgelegd wat de desktopmodus is en wat ontwikkelaars moeten weten over het leveren van hoogwaardige gebruikerservaringen op premium tablets.
Websites moeten zich aanpassen aan verschillende schermformaten, vormfactoren, invoermethoden en apparaatmogelijkheden. Als alternatief voor responsieve ontwerptechnieken kijken webontwikkelaars vaak naar de user-agent van de browser om verschillende websites voor mobiele en desktopapparaten te presenteren.
Historisch gezien is een mobile User Agent de standaard voor Chrome op Android. In deze modus worden sites die alleen voor desktops zijn ontworpen (dat wil zeggen, er is geen metaviewport ) weergegeven met een standaard vaste virtuele viewport van 980 px voor comfortabel lezen op verschillende telefoonschermen. In gevallen waarin de gebruiker alleen de desktopversie van de site wil laden (omdat de site verschillende versies van de site weergeeft op basis van de User Agent), kan een gebruiker de desktopmodus inschakelen. Deze verandert de User Agent in een desktopversie en zorgt ervoor dat de viewport 980 px is.
Nu er in het Android-tabletecosysteem steeds meer grote en krachtige apparaten beschikbaar zijn, hebben we ontdekt dat de desktopwebsite vaak een betere ervaring biedt dan de mobiele site. Mobiele websites die ontworpen zijn voor kleine schermen en weinig RAM maken niet altijd optimaal gebruik van de mogelijkheden van het grote scherm en andere krachtige apparaten . Daarom is de desktopmodus nu de standaard voor premium tablets.
Met deze wijziging is de User-Agent standaard een desktop User-Agent en wordt een viewport gebruikt die overeenkomt met de vensterbreedte. Er wordt geen standaard virtuele viewportgrootte van 980 px gebruikt.
Informatie voor ontwikkelaars over de desktopmodus
Chrome-gebruikers op Android kunnen de desktopmodusinstellingen wijzigen om standaard een desktopsite of mobiele site op te vragen. Dit verandert niet, dus veel gebruikers zullen al bekend zijn met het wijzigen van de modus.
Op premium tablets (met minimaal een 10 inch beeldscherm en 8 GB RAM) vraagt Chrome standaard om de desktopversie. Webontwikkelaars moeten ervoor zorgen dat hun website goed werkt in de desktopmodus op tablets.
Met deze wijziging naar de desktopmodus wordt de standaardgebruikersagent voor de meeste Android-tabletgebruikers gewijzigd ten opzichte van de mobiele versie, zoals:
Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36
naar een desktopversie, zoals deze:
Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36
Bovendien rapporteren de HTTP-headers SEC-CH-UA-MODEL en SEC-CH-UA-PLATFORM niet langer "Pixel Tablet" en "Android", maar respectievelijk "" en "Linux".
Test uw websites op deze verandering
Nu desktopmodus de standaard wordt op premium tablets, is het een goed moment om te bevestigen dat alle interacties met de desktopversies van uw site goed werken voor gebruikers met en zonder een bijgevoegd fysiek toetsenbord, een touchscreen , muis of trackpad.
Als u erop vertrouwt dat de User Agent detecteert of uw gebruikers Android gebruiken, bijvoorbeeld met Google Analytics, verwachten we dat deze wijziging gevolgen kan hebben voor uw site. Omdat Chrome voor desktop en Chrome voor Android niet exact dezelfde Web Platform API's delen, is het bovendien cruciaal dat u functiedetectie gebruikt voordat u een apparaatfunctie gebruikt.
Als u erop vertrouwt dat de User Agent uw gebruikers de mogelijkheid biedt uw app te installeren, kunt u onbedoeld een Linux-bestand downloaden. We raden u aan een webappmanifest te gebruiken in combinatie met de eigenschap related_applications . Dit gebruikt dan het standaardmechanisme van Chrome op Android om de gebruiker te vragen uw app te installeren.
U kunt uw website testen met de desktopmodus in- en uitgeschakeld door de volgende stappen te volgen. Als alternatief kunt u Chrome DevTools Device simulation en User-Agent overrides gebruiken.