Hoewel er ongetwijfeld verschillende factoren zijn die van invloed zijn op de omzet, zeggen de meeste experts dat bedrijfslocaties die binnen 5 seconden worden geladen bijna het dubbele verdienen van de sites die dit doen in 19, de gemiddelde laadtijd van de site.
De studie heeft verder gevonden dat sites die binnen 5 seconden worden geladen:
- 25% hogere zichtbaarheid van advertenties,
- 35% lager bouncepercentage, en
- 70% langere gebruikerssessies.
Dat is precies waarom we ons moeten concentreren op oplossingen die voor het eerst mobiel zijn om onze bedrijven te helpen slagen. Mobiele snelheid is immers nog nooit zo belangrijk geweest.
$config[code] not foundLangzame laadsnelheid kan echt een probleem zijn
Volgens Google,
- 1 op de 2 mensen verwacht dat een pagina binnen minder dan 2 seconden wordt geladen.
- 53% van de bezoeken wordt eerder verlaten als de pagina meer dan 3 seconden nodig heeft om op een mobiel apparaat te laden.
- 46% van de mensen is ontevreden over het wachten op het laden van pagina's tijdens het surfen op internet op een mobiel apparaat.
De 3 belangrijkste factoren die sites op het mobiele internet vertragen, zijn het aantal serververzoeken, de bestandsgrootte en de volgorde van elementen voor het laden van pagina's. Dus nu hebben we de oorzaken benadrukt; laten we naar de oplossing gaan.
Hoe u de snelheid van uw mobiele site verhoogt
Meet en minimaliseer de reactietijd van uw server
De snelheid van uw mobiele pagina is niet alleen afhankelijk van uw code, maar is ook afhankelijk van een belangrijke technische tool die de server wordt genoemd.
Hoe langer uw server wacht om te reageren op een browserverzoek, hoe langzamer uw pagina op het apparaat wordt geladen. De meeste experts van Google adviseren dat uw server begint met het verzenden van de 1st byte van bronnen binnen tweehonderd milliseconden van een verzoek om een meer optimaal resultaat.
Doorgaans zijn er 3 belangrijke methoden betrokken bij het verhogen van de reactietijd van uw server:
- Verbetering van de configuratie of software van uw webserver.
- Verbetering van de reikwijdte en kwaliteit van uw hostingdienst, met name om ervoor te zorgen dat u over voldoende geheugen en CPU-bronnen beschikt.
- Het aantal benodigde bronnen voor uw webpagina's verminderen.
Gebruik CSS om afbeeldingen te laden
Als u uw inhoudsbestanden voor mobiele gebruikers wilt verbergen, laad ze dan als achtergrondafbeeldingen via CSS en gebruik mediaquery's om ze voorwaardelijk te verbergen.
Een variatie op deze techniek wordt door Amazon gebruikt om apparaatspecifieke beelden conditioneel te laden.
Minimaliseer het aantal omleidingen om uw mobiele paginasnelheid te verbeteren
Omleidingen zijn niets anders dan instructies die in staat zijn om bezoekers van de website automatisch van de ene pagina naar de andere te brengen.
Elke omleiding kan waardevolle milliseconden opeten, wat resulteert in een langzamere paginalading. Dit is met name problematisch voor mobiele apparaten, omdat ze vaak afhankelijk zijn van onbetrouwbare netwerken dan desktopgebruikers.
De eerste stap om dit probleem te verhelpen is om het aantal omleidingen op uw site te bekijken met behulp van tools zoals redirect mapper. Als het aantal te groot is, minimaliseer het, of in het ideale geval, breng het naar nul voor de beste resultaten.
Verklein JS- en CSS-bestanden
Meer gegevens betekent een hoger paginagewicht. Hierdoor gaan uw pagina's langer mee om te laden op een mobiel apparaat.
Dat is de reden waarom de meeste webontwikkelaars hun waarde weten te waarderen door de noodzaak van het optimaliseren en minimaliseren van assets om de laadsnelheid van de pagina te verhogen.
"Minificatie" elimineert redundantie zonder de weergave van een pagina te beïnvloeden. Een breed scala aan Google-hulpprogramma's kan u helpen dergelijke overtolligheden te elimineren, waaronder:
- CSSNano (voor CSS)
- UglifyJS (voor JS)
Gebruik CSS3 in plaats van afbeeldingen
Slagschaduwen, afgeronde hoeken en verloopvullingen - al deze functies kunnen worden gedaan via CSS in plaats van afbeeldingen.
Dit kan enorm helpen bij het verminderen van het aantal HTTP-verzoeken, waardoor de laadtijd op hetzelfde moment wordt versneld.
Gebruik inline SVG's in plaats van JPEG's
Net als gegevens-URI's kunnen SVG's (schaalbare vectorafbeeldingen) op een pagina worden ingesloten om het aantal HTTP-aanvragen te verminderen.
Deze bestanden kunnen worden gemaakt op een vectorgraphics-editor zoals Inkscape, Adobe Illustrator, enz. Zodra deze is gemaakt, kunt u deze openen in een teksteditor en deze in uw code plaatsen.
Opmerking: Als u een SVG in uw stylesheet wilt insluiten, moet u deze eerst converteren naar de gegevens-URI en vervolgens doorgaan naar de volgende stap.
Zodat dat meer of minder dingen opsomt. Ik hoop dat je een goede en verhelderende lezing hebt gehad.
Foto via Shutterstock
1
