Een aangepast opstartscherm zorgt ervoor dat uw Progressive Web App (PWA) meer aanvoelt als een app die voor dat apparaat is gebouwd. Wanneer een gebruiker uw PWA vanuit het startscherm start, geeft Android standaard een wit scherm weer totdat de PWA gereed is. De gebruiker kan dit lege, witte scherm maximaal 200 ms zien. Door een aangepast opstartscherm in te stellen, kunt u uw gebruikers een aangepaste achtergrondkleur en het pictogram van uw PWA laten zien, waardoor u een merkgerichte, boeiende ervaring krijgt.
Hoe de Lighthouse-splashscreen-audit mislukt
Lighthouse markeert pagina's die geen aangepast startscherm hebben:
Hoe u een aangepast opstartscherm kunt maken
Chrome voor Android geeft automatisch uw aangepaste opstartscherm weer, zolang u aan de volgende vereisten in uw webapp-manifest voldoet:
- De eigenschap
namewordt ingesteld op de naam van uw PWA. - De eigenschap
background_coloris ingesteld op een geldige CSS-kleurwaarde. - De eigenschap
theme_coloris ingesteld op een geldige CSS-kleurwaarde. - De
iconsspecificeert een pictogram dat minimaal 512x512 px is. - Het opgegeven pictogram bestaat en is een PNG-bestand.
Zie Een opstartscherm toevoegen voor geïnstalleerde webapps in Chrome 47 voor meer informatie.
Bronnen
Broncode voor Is niet geconfigureerd voor een aangepaste splashscreen -audit
,Een aangepast opstartscherm zorgt ervoor dat uw Progressive Web App (PWA) meer aanvoelt als een app die voor dat apparaat is gebouwd. Wanneer een gebruiker uw PWA vanuit het startscherm start, geeft Android standaard een wit scherm weer totdat de PWA gereed is. De gebruiker kan dit lege, witte scherm maximaal 200 ms zien. Door een aangepast opstartscherm in te stellen, kunt u uw gebruikers een aangepaste achtergrondkleur en het pictogram van uw PWA laten zien, waardoor u een merkgerichte, boeiende ervaring krijgt.
Hoe de Lighthouse-splashscreen-audit mislukt
Lighthouse markeert pagina's die geen aangepast startscherm hebben:
Hoe u een aangepast opstartscherm kunt maken
Chrome voor Android geeft automatisch uw aangepaste opstartscherm weer, zolang u aan de volgende vereisten in uw webapp-manifest voldoet:
- De eigenschap
namewordt ingesteld op de naam van uw PWA. - De eigenschap
background_coloris ingesteld op een geldige CSS-kleurwaarde. - De eigenschap
theme_coloris ingesteld op een geldige CSS-kleurwaarde. - De
iconsspecificeert een pictogram dat minimaal 512x512 px is. - Het opgegeven pictogram bestaat en is een PNG-bestand.
Zie Een opstartscherm toevoegen voor geïnstalleerde webapps in Chrome 47 voor meer informatie.
Bronnen
Broncode voor Is niet geconfigureerd voor een aangepaste splashscreen -audit