Share
Edge is de nieuwe webbrowser van Microsoft met een nieuwe rendering-engine - EdgeHTML - en een onderliggend besturingssysteem om op te starten in Windows 10. Aangezien upgrades van Windows 7, 8 en 8.1 voor de meeste gebruikers gratis zijn, kunt u een enorme toestroom van Edge-gebruikers op sites verwachten in de komende maanden.
Edge is een afwijking van het verleden, eigenlijk een complete herschrijving van eerdere versies van Internet Explorer, en ik weet zeker dat veel webontwikkelaars dat zullen verwelkomen. Met dat in gedachten wilde ik vijf manieren delen waarop u uw site kunt voorbereiden op moderne webinteroperabiliteit en tegelijkertijd kunt testen op Microsoft Edge..
Veelgebruikte bibliotheken zoals jQuery worden vaak bijgewerkt om bugs aan te pakken wanneer nieuwe browserversies worden uitgebracht. Door eenvoudigweg uw JS-frameworks bij te werken, kunt u vele compatibiliteitsproblemen met Edge voorkomen.
In ons interne onderzoek hebben we vastgesteld dat 57% van de 20.000 sites JavaScript-frameworks gebruiken die problemen hebben die zijn opgelost in nieuwere versies van dezelfde bibliotheek. U kunt de sitescanner gebruiken om te bepalen of u verouderde JavaScript-kaders op uw sites gebruikt.
CSS-prefixen worden door browserleveranciers gebruikt om nieuwe, nieuwe CSS-functies te implementeren voordat ze volledig zijn geratificeerd door het W3C. Als een leverancier een CSS-voorvoegsel implementeert, ziet het eruit als het onderstaande voorbeeld (dit is een IE-specifieke implementatie van de functie 'koppeltekens' om tekst over meerdere regels af te breken):
-ms-koppeltekens: auto;
Het is heel gebruikelijk dat sites ontbrekende leverancierspecifieke voorvoegsels bevatten of leverancierspreferenties hebben geïmplementeerd wanneer ze niet vereist zijn in algemene CSS-eigenschappen. Dit kan ertoe leiden dat een webpagina verkeerd wordt weergegeven in Microsoft Edge of andere moderne browsers.
Verkopers van browsers gebruiken nu veel minder voorvoegsels omwille van de beheerproblemen die hiermee samenhangen. Sommige browsers, Microsoft Edge inbegrepen, gebruiken zelden of nooit voorvoegsels.
Vermijd waar mogelijk het gebruik van leverancierspecifieke voorvoegsels. Als u echter absoluut voorvoegsels van leveranciers moet gebruiken, gebruikt u Grunt PostCSS om het beheer van voorvoegsels in uw CSS te automatiseren.
Sommige webpagina's gebruiken browsedetectietechnieken om te bepalen hoe de webpagina moet worden weergegeven in veel verschillende browserversies. We raden aan feature-detectie te gebruiken, een praktijk die eerst bepaalt of een browser of apparaat een specifieke functie ondersteunt en vervolgens de beste ervaring kiest om te renderen op basis van deze informatie.
Functiedetectie is een geweldig alternatief voor browserdetectie en wordt vaak gebruikt via populaire JavaScript-bibliotheken zoals Modernizr, of via functiedetectiecode. Functiedetectie wordt vaak gebruikt met Polyfills om moderne functies in oudere browsers te implementeren die ze niet native ondersteunen.
Voor meer informatie over het gebruik van Modernizr, Polyfills en andere compatibiliteitstechnieken, zie Martin Kearn's artikel 'Stem, moderniseer en optimaliseer uw website'.
Edge biedt geen ondersteuning voor plug-ins, dus het is een goed moment om na te denken over hoe u afstand kunt nemen van eigen plug-ins zoals Flash en Silverlight. Edge ondersteunt Flash, maar in plaats van een plugin-architectuur te gebruiken, wordt Flash geleverd met de browser en wordt het bijgewerkt en gecentraliseerd door het Edge-team in samenwerking met Adobe..
Voor sommige sites is het vrij eenvoudig om van plug-ins weg te gaan. Veel sites zullen dit echter moeilijk vinden, vooral degene die media-inhoud leveren. Het Edge-team heeft richtlijnen gegeven voor het verplaatsen naar HTML voor premium-inhoud via de Edge Blog.
Als het de richtlijn ontbreekt of geeft geen op standaarden gebaseerd documenttype aan, kan Edge uw pagina ten onrechte weergeven. De scanner voert een eenvoudige test uit om te bepalen of uw site correct is ingesteld, dus voer de URL van uw site in en ontdek snel of deze wordt doorgegeven. Als u wilt zien hoe de daadwerkelijke test eruit ziet, kunt u de code voor de scanner bekijken op GitHub.
Dit artikel maakt deel uit van de webontwikkelingsserie van Microsoft-techevangelisten over praktisch JavaScript-leren, open-sourceprojecten en best practices voor interoperabiliteit, waaronder Microsoft Edge-browser en de nieuwe EdgeHTML-weergavemotor.
We raden u aan om te testen op verschillende browsers en apparaten, waaronder Microsoft Edge, de standaardbrowser voor Windows 10, met gratis hulpprogramma's op dev.modern.IE:
Diepgaande technologische kennis van Microsoft Edge en het webplatform van onze ingenieurs en evangelisten:
Meer gratis platformonafhankelijke hulpprogramma's en bronnen voor het webplatform:
Accentsconagua