Är din webbplats långsam? Var ärlig. Kan det bli snabbare? Användare kräver webbplatser som laddas snabbt och fortsätter att leverera innehåll utan fördröjning. Om din webbplats faller minst bakom för att möta denna efterfrågan kan användarna överge din webbplats (och de får aldrig återvända).
Idag ska vi titta på sätt att se till att ditt webbplatsgränssnitt är byggt för hastighet, så du behöver aldrig oroa dig för sidbelastningstider igen.
Testa din webbplats
Innan du slutar vid? Det finns inget sätt min hemsida är långsam ,? testa det. Google har ett bra verktyg som alla kan använda för att testa någon webbplats genom att ange webbadressen.
Du får en smidig rapport som berättar hur snabbt din webbplats flyttar och var den kan förbättras. Det är en bra idé att köra testet regelbundet för att säkerställa att allt fungerar smidigt. (Plus, det bryter ner prestanda på mobila och stationära enheter och erbjuder förslag till förbättringar.)
Rapporten gör tre rekommendationer - bör fixa, överväga fixa och godkända - för följande saker:
- Browserkachning
- Bildoptimering
- Serverrespons
- Skript och CSS över veckan
- Kompression
- omdirigeringar
- Minifiering av CSS, HTML och JavaScript
- Prioritering av synligt innehåll
Dumpa onödiga plugins
Håller du på plugins eller lägger till ons som du bara inte använder? Det är dags att dumpa dem.
Även element som inte är i bruk drar hastighet bort från din webbplats. (Detta gäller särskilt om du arbetar av ett system som WordPress.)
Gå in i uppreningsläge och ta bort alla oanvända plugins. Du bör överväga att tänka på plugins i bruk också och se till att du faktiskt använder dem eller att de bidrar till den övergripande användarupplevelsen, om inte hitta ett bättre alternativ.
Förutom antalet plugins är kvalitet också ett problem. Lägg inte bara till något gammalt plugin på din webbplats. Försök hitta element som ger verkligt värde och komma högt rankade. Gamla, föråldrade element kan också dra din webbplats ner.
Dela endast som behövs
Medan vi tänker på plugins, hur många sociala medier har du på din webbplats? Nu svarar ärligt: Hur många behöver du faktiskt?
Alltför många av dessa knappar kan vara förvirrande för användarna - hur många delar i själva verket dela på flera plattformar - och hoppa ner hastigheter och ladda tid. (Det här gäller särskilt de som försöker lista ut hur många gillar eller delar ett inlägg som redan har med frågor som körs i båda riktningarna.)
Välj ett eller två nätverk där du är aktiv och där användarna regelbundet kontaktar din webbplats och innehåller de här knapparna. Ditch resten. De kommer bara i vägen.
Var försiktig över bildöverbelastning
Video, illustrationer, bilder och animationer? åh, min! Alla dessa stora visuella element kan lägga till att ladda gånger. Välj vist.
Innan du lägger något visuellt i din webbdesign, väger du dess värde mot andra element. Ger det något för användarna? Om så är fallet, fortsätt. Om inte, varför använder du det designelementet?
Du bör optimera alla bilder på lämpligt sätt för webben. Som en allmän regel bör bilderna vara så stora som behövs. Gå inte överbord och ladda upp fullstora bilder. Det tar lite arbete på framsidan, men du kommer att vara glad att du gjorde det senare (speciellt om din webbplats fortsätter att växa).
Dra nytta av andra knep också. Prova ikonfonter snarare än bildbaserade ikoner. Konvertera element till SVG (skalat vektorformat) om ett ikonfont inte fungerar. Använd så mycket HTML och CSS? Magi? som du kan och inte mossa webbplatsen med element som laddas som foton som knappar, pilar och andra användargränssnitt verktyg.
Ta av med krympverktyg
Små filer är nyckeln till topphastighet. Balansen ligger i tanken att högupplösta skärmar låter dig dela och visa upp innehåll i högsta kvalitet. Det är där krympande verktyg kommer in.
Om du inte känner dig säker på din förmåga att storlek och krympa - eller du inte får det önskade resultatet - försök med ett av dessa alternativ att få filer ner till de minsta användbara storlekarna.
- WP Smush krymper bilder för WordPress-användare
- Kraken komprimerar bilder för alla användare
- TinyPNG minskar storleken på det gemensamma formatet ännu mer
- Gzip paketfiler för optimal komprimering
- Minifiera din CSS reducerar den totala kodstorleken och inkluderar ett API
- SpriteMe gör bakgrundsbilder till en CSS-sprite för att spara HTTP-förfrågningar
- CSS Compressor minskar den totala kodstorleken
Bara cache det
Aktivera caching på din webbplats.
Om du inte gör det här betalar dina användare priset. Det finns fortfarande ett fåtal personer där ute som kan argumentera annars, men värdet för användarna överstiger dessa argument. Din webbplats måste vara snabb.
En cache skapar en temporär fil från sidor så att webbläsaren? Kommer ihåg? webbplatsen när en användare returnerar. Det minskar bandbreddsanvändning, serverbelastning och fördröjningstid (aktuell eller uppfattad). Användarna kommer att tacka, särskilt när det gäller att komma åt mer massiva webbplatser.
Rengör det regelbundet
Precis som att du måste städa ditt hem regelbundet måste du städa upp och behålla din webbdatabas, länkar och filer.
Dessa är objekten på din webbplats rengöring checklista:
- Optimera din databas. Med tiden kan din databas bli igensatt med revisioner, användarbilder och sparade data. Du behöver inte behålla allt. Rengöringselement som inte längre ingår i din webbplatsplan.
- Koppla inte samman bilder. Att dra bilder från någon annans webbplats (och server) till din är bara en dålig idé. Och det är långsamt. Samma sak gäller nästan alla andra externa filförfrågningar. Använd dem endast vid behov.
- Fix länkar. Brutna länkar kan inte sakta ner din webbplats, men det saktar ner anslutningen användare gör från din webbplats till andra platser, vilket kan vara lika dåligt.Få vana att söka efter och korrigera brutna länkar.
- Håll allt uppdaterat. Om du kör på en plattform som WordPress, ta uppdateringarna. Om du använder ett tema eller boxade element av vilken typ som helst, är detsamma sant. Uppdateringar kan innehålla korrigeringsfiler som bidrar till snabbhet samt håller din webbplats säker från potentiella hot. (Och ingenting är långsammare än en webbplats som har hackats eller smittats med skadlig kod.)
Slutsats
Arbeta nu genom listan ovan och gå tillbaka till Googles Pagespeed Insights-verktyg. Kör det igen. Märker du en skillnad?
Ingenting kommer att göra en användare lyckligare och mer sannolikt att återvända till din webbplats än en bra och snabb upplevelse. Under alla faser av den visuella designen, kom ihåg att tänka på gränssnittet så bra så att din webbplats är byggd för hastighet.