Progressive Enhancement is een webontwikkelingsstrategie die ervoor zorgt dat uw site toegankelijk is voor een zo groot mogelijk publiek. Het kernprincipe is dat de basisinhoud en paginafunctionaliteit alleen afhankelijk mogen zijn van de meest fundamentele webtechnologieën. Verbeterde ervaringen, zoals geavanceerde styling met behulp van CSS of interactiviteit met behulp van JavaScript, kunnen er bovenop worden gelaagd voor browsers die deze technologieën ondersteunen. Maar de basisinhoud en paginafunctionaliteit mogen niet afhankelijk zijn van CSS of JavaScript.
Hoe de Lighthouse fallback-contentaudit mislukt
Lighthouse markeert pagina's die bepaalde inhoud niet bevatten wanneer JavaScript niet beschikbaar is:
Lighthouse schakelt JavaScript op de pagina uit en inspecteert vervolgens de HTML van de pagina. Als de HTML leeg is, mislukt de audit.
Hoe u ervoor kunt zorgen dat uw pagina inhoud bevat zonder JavaScript
Progressieve verbetering is een groot en controversieel onderwerp. Eén kamp zegt dat pagina's, om te voldoen aan de strategie van progressieve verbetering, gelaagd moeten zijn, zodat de basisinhoud en paginafunctionaliteit alleen HTML vereisen. Zie Progressive Enhancement van Smashing Magazine: wat het is en hoe je het kunt gebruiken voor een voorbeeld van deze aanpak.
Een ander kamp is van mening dat deze strikte aanpak onhaalbaar of onnodig is voor veel moderne, grootschalige webapplicaties en stelt voor om inline critical-path CSS in het document <head> te gebruiken voor absoluut kritische paginastijlen.
Gezien deze overwegingen voert deze Lighthouse-audit een eenvoudige controle uit om ervoor te zorgen dat uw pagina niet leeg is wanneer JavaScript is uitgeschakeld. Hoe strikt uw app zich houdt aan progressieve verbeteringen is een onderwerp van discussie, maar er bestaat brede overeenstemming dat alle pagina's op zijn minst enige informatie moeten weergeven wanneer JavaScript is uitgeschakeld, zelfs als de inhoud slechts een waarschuwing voor de gebruiker is dat JavaScript vereist is om de app te gebruiken. bladzijde.
Voor pagina's die absoluut op JavaScript moeten vertrouwen, is één aanpak het gebruik van een <noscript> -element om de gebruiker te waarschuwen dat JavaScript vereist is voor de pagina. Dit is beter dan een blanco pagina, omdat de blanco pagina gebruikers onzeker maakt of er een probleem is met de pagina, hun browser of hun computers.
Als u wilt zien hoe uw site eruitziet en presteert wanneer JavaScript is uitgeschakeld, gebruikt u de functie JavaScript uitschakelen van Chrome DevTools.
Bronnen
- Broncode voor Biedt geen fallback-inhoud wanneer JavaScript niet beschikbaar is
- Progressieve verbetering: wat het is en hoe u het kunt gebruiken
- Kritiek weergavepad
- Schakel JavaScript uit met Chrome DevTools
Progressive Enhancement is een webontwikkelingsstrategie die ervoor zorgt dat uw site toegankelijk is voor een zo groot mogelijk publiek. Het kernprincipe is dat de basisinhoud en paginafunctionaliteit alleen afhankelijk mogen zijn van de meest fundamentele webtechnologieën. Verbeterde ervaringen, zoals geavanceerde styling met behulp van CSS of interactiviteit met behulp van JavaScript, kunnen er bovenop worden gelaagd voor browsers die deze technologieën ondersteunen. Maar de basisinhoud en paginafunctionaliteit mogen niet afhankelijk zijn van CSS of JavaScript.
Hoe de Lighthouse fallback-contentaudit mislukt
Lighthouse markeert pagina's die bepaalde inhoud niet bevatten wanneer JavaScript niet beschikbaar is:
Lighthouse schakelt JavaScript op de pagina uit en inspecteert vervolgens de HTML van de pagina. Als de HTML leeg is, mislukt de audit.
Hoe u ervoor kunt zorgen dat uw pagina inhoud bevat zonder JavaScript
Progressieve verbetering is een groot en controversieel onderwerp. Eén kamp zegt dat pagina's, om te voldoen aan de strategie van progressieve verbetering, gelaagd moeten zijn, zodat de basisinhoud en paginafunctionaliteit alleen HTML vereisen. Zie Progressive Enhancement van Smashing Magazine: wat het is en hoe je het kunt gebruiken voor een voorbeeld van deze aanpak.
Een ander kamp is van mening dat deze strikte aanpak onhaalbaar of onnodig is voor veel moderne, grootschalige webapplicaties en stelt voor om inline critical-path CSS in het document <head> te gebruiken voor absoluut kritische paginastijlen.
Gezien deze overwegingen voert deze Lighthouse-audit een eenvoudige controle uit om ervoor te zorgen dat uw pagina niet leeg is wanneer JavaScript is uitgeschakeld. Hoe strikt uw app zich houdt aan progressieve verbeteringen is een onderwerp van discussie, maar er bestaat brede overeenstemming dat alle pagina's op zijn minst enige informatie moeten weergeven wanneer JavaScript is uitgeschakeld, zelfs als de inhoud slechts een waarschuwing voor de gebruiker is dat JavaScript vereist is om de app te gebruiken. bladzijde.
Voor pagina's die absoluut op JavaScript moeten vertrouwen, is één aanpak het gebruik van een <noscript> -element om de gebruiker te waarschuwen dat JavaScript vereist is voor de pagina. Dit is beter dan een blanco pagina, omdat de blanco pagina gebruikers onzeker maakt of er een probleem is met de pagina, hun browser of hun computers.
Als u wilt zien hoe uw site eruitziet en presteert wanneer JavaScript is uitgeschakeld, gebruikt u de functie JavaScript uitschakelen van Chrome DevTools.