9 maneres de millorar la velocitat de càrrega del vostre lloc web

Cansat d’un lloc web lent? Obteniu més informació sobre com es pot solucionar i millorar el rendiment del vostre lloc web per obtenir velocitats de càrrega de pàgines més ràpides, espectadors més feliços, & millors taxes de conversió.


Com arreglar un lloc web de càrrega lenta

És possible que ja hagueu dedicat molt temps a treballar en la usabilitat i l’experiència d’usuari del vostre lloc, que és fonamental per al negoci en línia actual, però sense optimitzar la velocitat de càrrega de la pàgina del vostre lloc, en última instància, fallareu. La velocitat és una part important tant de la usabilitat del lloc com de l’experiència de l’usuari i, sense que hi hagi risc de perdre visitants.

A ningú li agrada lloc web lent. Les velocitats de càrrega de pàgina lentes poden allunyar els usuaris més ràpidament que … com a mínim més ràpid que el temps que es triga a carregar la pàgina!

NOTA RÀPIDA: Els estudis han demostrat triga UNA segona perquè el flux de pensaments de l’espectador es mantingui ininterromput. Cada segon, el lloc web corre el risc de perdre l’interès d’aquest espectador. El vostre objectiu és aconseguir que el vostre lloc web es carregui un segon o menys.

El temps de càrrega del lloc web és important!

Als primers dies de la web, molts llocs web eren HTML estàtic, bàsicament un document de text senzill, de manera que teòricament es trigaria molt poc temps a carregar-se. Tot i això, les velocitats de connexió també eren baixes (si sou massa joves que recordeu la navegació per xarxa en un mòdem de 28,8, això és com ser obligat a conduir 1 milla per hora a la carretera). Va ser molt important tenir en compte la mida de la imatge i el nombre de gràfics en una pàgina web, sense oblidar que els llocs web dinàmics es carregaven mitjançant CGI; cosa que va frenar les coses considerablement. Ara, l’amplada de banda ha augmentat. Podem fer molt més a la xarxa i, per descomptat, ho fem.

Tanmateix, és important recordar que les regles antigues encara s’apliquen.

Tot i que les nostres velocitats d’internet i els dispositius que utilitzem (com ordinadors portàtils, tauletes), & telèfons intel·ligents) cada cop són més ràpids i ràpids, sembla que la nostra paciència s’acaba més. És mai és suficient. Volem el que volem i el volem ara. Per això és molt important que les empreses en línia optimitzin el temps de càrrega del seu lloc web.

En aquest article, discutirem les bones pràctiques i tecnologies actuals utilitzades per optimitzar la velocitat de càrrega de pàgines d’un lloc web perquè pugueu aplicar-les al vostre lloc web..

Llegiu també: La velocitat també és important per a SEO.

Eines de prova

Abans d’iniciar res, haureu de tenir un mètode per determinar què redueix la reducció del lloc i es fa un punt de referència de la velocitat actual del vostre lloc web per mesurar millores. Els problemes que es mostren a continuació poden ser o no la seva principal qüestió, però no tindreu manera de saber-ho a menys que pugueu supervisar el procés.

Heu de ser conscients que hi ha moltes aportacions i propostes. Algunes de les solucions a continuació poden semblar que es contradiuen. Això passa perquè de vegades la solució a un problema pot augmentar un problema de velocitat cap a un altre aspecte del vostre lloc. Per exemple, crear sprites d’imatges podria provocar la necessitat de carregar una imatge gran al principi, cosa que, tot i reduir la necessitat de carregar moltes altres imatges, podria retardar el temps de càrrega inicial (aprofundiré en aquests mètodes més endavant).

Per aquest motiu, hauríeu de mesurar els resultats d’un canvi vers l’altre de manera que pugueu determinar quins són els millors resultats.

A continuació hi ha algunes eines útils:

  • Google Page Speed ​​Insights – Aquesta eina gratuïta de Google comprovarà qualsevol URL i executarà una prova al vostre lloc pel seu rendiment. Proporciona resultats diferents sobre el funcionament del vostre lloc tant a l’escriptori com a les plataformes mòbils. Abordarà moltes de les àrees que es discuten en aquest article i oferirà suggeriments sobre què podria ser que el seu lloc es faci alentir. Tanmateix, sembla que aquesta eina és molt agressiva i, de vegades, poc realista, així que cal tenir-ho en compte.
  • Prova de velocitat del lloc web Pingdom – Pingdom també disposa de solucions de gran velocitat de prova que poden provar el vostre lloc des de diverses ubicacions del món (aquesta és una de les raons per les quals és una bona idea utilitzar un CDN; més informació a continuació). Proporciona moltes solucions pràctiques per millorar la vostra velocitat.
  • Yslow – Aquest és un complement gratuït per al vostre navegador que us proporcionarà una qualificació en funció del nombre de peticions HTTP, mides d’imatge, tant si s’utilitza un CDN, etc..
  • Calculadora del pressupost de rendiment – Aquesta és una petita eina útil per esbrinar quin tipus de contingut es pot “permetre” (basat en ample de banda) per mantenir el vostre lloc en funcionament òptim..

CAVEAT: Una altra cosa important a tenir en compte és quin enfocament millora millor l’experiència de l’usuari. Heu d’esbrinar si els temps de càrrega addicionals davant els temps de càrrega gradual són més efectius. La millor manera de fer-ho és amb proves d’usabilitat i específicament proves A / B.

Com fer que el vostre lloc web sigui més ràpid

D’acord, així que ara que teniu algunes eines de prova, aprofundeixem en les coses reals que podem fer per agilitzar els nostres llocs web!

UTILITZEU PARAULES? Hi ha molts plugins & Les optimitzacions específiques de WordPress disponibles per fer moltes de les tasques que s’enumeren aquí. Consulteu el nostre article destinat exclusivament a millorar WordPress més ràpidament.

1. Els vostres fitxers són massa grans o heu de tenir molts

Recordeu anteriorment com parlàvem de la importància de la mida del fitxer als primers dies de la web? Encara és important. Tot i que això pugui semblar evident, encara cal dir-ho. Els fitxers grans es triguen a carregar-se.

Utilitzeu fitxers més petits i menys (també pot augmentar l’experiència dels usuaris. Mentre que a la gent li agraden les imatges, moltes també poden crear una sobrecàrrega d’informació)

Moltes vegades, no calen imatges molt grans. Tot i que és fàcil redimensionar una imatge amb CSS, si ho feu per reduir el fitxer, perdreu l’amplada de banda. Redimensiona les teves imatges abans les pengeu És sorprenent quant més petits els pugueu fer.

2. Activeu la compressió GZIP

Fins i tot després d’haver reduït la mida del fitxer, és una bona idea comprimir-los juntament amb la resta del lloc abans d’enviar-lo a l’usuari. Probablement ja coneixeu aquest concepte. De vegades, necessiteu una manera d’enviar molts fitxers a una xarxa, de manera que heu de “comprimir-los” fins que tinguin una mida que permetrà el vostre proveïdor. Bé, la compressió HTTP és la mateixa cosa.

La majoria de servidors web permetran comprimir fitxers amb una utilitat anomenada gzip. Gzip prendrà tots els fitxers del vostre lloc, els comprimirà a mida molt inferior abans d’enviar-lo al navegador de l’usuari. Això funcionarà amb tots els fitxers del vostre lloc. A continuació, es mostren algunes altres eines útils de compressió d’imatges en línia disponibles per comprimir els fitxers del vostre lloc.

3. Cache

També podeu donar instrucció als navegadors sobre quan hauria d’utilitzar una versió caché del vostre lloc versus una versió nova. Mitjançant l’ús de Expira les capçaleres podeu dir a l’usuari que utilitzi contingut en memòria cau si és estàtic, però també pot aprofitar quan necessiti carregar contingut nou, com ara amb contingut dinàmic..

4. Teniu massa trucades al servidor (sol·licituds HTTP)

Aquesta és una de les coses més importants a tenir en compte a l’accelerar el vostre lloc. Cada vegada que sol·liciteu un fitxer nou o redirigiu el lloc per qualsevol motiu, això alenteix el procés. Amb cadascun d’ells, el navegador de l’usuari ha de realitzar el viatge al servidor, que després trobarà el recurs i transmetre’l de nou a l’usuari. Tot i que això està bé en petites dosis, cada trucada al servidor (sobretot si es produeix a la mateixa pàgina) retardarà el vostre lloc dràsticament.

Cada fitxer que sol·liciteu o tingueu al vostre lloc envia una trucada al servidor. Si teniu 20 imatges al vostre lloc, això és 20 vegades el que s’ha de trucar al servidor. Podeu reduir algunes coses per reduir-les.

  • Utilitzeu sprites d’imatges CSS – es tracta d’imatges soles que inclouen un conjunt de totes les imatges del vostre lloc com a una sola imatge. Podeu utilitzar CSS per proporcionar només la part del fitxer que cal mostrar en una ubicació concreta. Això vol dir que en lloc de 20 trucades per a 20 imatges, només cridarà una imatge gran. Tanmateix, aneu amb compte, mentre que això redueix el nombre de trucades al db que acceleraran definitivament el vostre lloc, la mida de la imatge encara pot ser un problema.
  • Arregleu els enllaços trencats – cada vegada que intenteu enviar algú a una pàgina que ja no existeix al vostre lloc, fa que el servidor enviï una pàgina 404. Essencialment això vol dir que busca la pàgina, rep un missatge no trobat i que després ha de recuperar un error personalitzat. Cadascuna d’aquestes trucades al servidor us pot retardar.
  • Reduir les redireccions – intenteu reduir la quantitat de vegades que trieu que el vostre servidor enviï algú a una pàgina diferent. Tot i que això pot semblar útil (per exemple, per a SEO) tenir pàgines configurades amb aquest propòsit, si feu massa trucades al servidor, això pot retardar el vostre lloc i repercutir negativament en l’experiència de l’usuari..

Exemple d’un Image SpriteUn exemple d’un Image Sprite. Font de la imatge

6. Optimització de les necessitats de codificació del vostre lloc web

  • Minimitzeu el vostre CSS i el vostre javascript – L’espai en blanc significa alguna cosa per al navegador web. Pot semblar buit per a tu o per a mi, però cada espai en blanc és un personatge que cal llegir i presentar. En molts casos no és necessari, de manera que utilitzeu algunes eines per minimitzar els fitxers per comprimir aquests fitxers perquè funcionin, però poden llegir-los amb més rapidesa. Google té algunes bones eines disponibles per ajudar-vos minimitzar el vostre JavaScript i el vostre CSS
  • Utilitzeu HTML en lloc de PHP, si no és contingut dinàmic, Tot i que bona part del vostre codi pot ser dinàmic, de vegades és bo anar a la vella escola i només cal utilitzar codi HTML senzill. PHP s’ha d’executar mitjançant un processador. El HTML és interpretat directament pel navegador. Si només publiqueu contingut estàtic, envieu-lo de forma estàtica.
  • Poseu el CSS a la part superior i el JavaScript a la part inferior – Aquesta és una regla antiga, però encara s’aplica. Cal que el CSS es mostri ràpidament, però JavaScript només s’ha d’executar un cop s’ha carregat la pàgina. També potser no desitgeu dependre massa de trucar JavaScript des d’un fitxer extern. Si no n’hi ha gaires, incloure’l directament a la pàgina, ja que cal fer una sol·licitud HTTP menys.

Nota: Si utilitzeu grans biblioteques JavaScript populars, com JQuery, els consells són diferents. Voleu que es desitgi en un fitxer independent, però realista és una idea encara millor utilitzar el jQuery directament des d’un CDN. Això té un parell d’avantatges. Com que aquestes biblioteques són populars, hi ha una probabilitat molt alta que l’usuari ja tingui una versió en memòria cau d’aquesta biblioteca, de manera que la càrrega no necessita temps. Si el vostre servidor el proporciona, es tracta d’una altra trucada al servidor i caldrà que es carregui tota la biblioteca perquè funcioni. Això pot augmentar la lentitud del vostre lloc web.

Està bé, així que ara us heu fixat i arreglat tot el que pugueu internament, però encara sembla lent, sobretot des de llargues distàncies. Vegem algunes eines del servidor.

7. El vostre lloc és lent a causa de la latència

La latència és un terme que fa referència al temps que triga el servidor a respondre a una sol·licitud HTTP. Per això és important pel mateix motiu pel qual no voleu fer massa sol·licituds. Si podeu accelerar aquesta vegada, augmentarà dràsticament la velocitat del vostre lloc. La latència augmenta en funció de la distància física entre l’usuari final i el servidor que proporciona el contingut.

Exemple de latència del lloc web

Una de les millors maneres de manejar-ho és mitjançant les xarxes de lliurament de contingut o CDN. Aquestes còpies de cache del contingut del vostre lloc web a diversos llocs del planeta, de manera que es redueix la latència per a cadascuna d’aquestes ubicacions. Els proveïdors de CDN més coneguts inclouen Akamai, Cloudflare i Amazon AWS, però n’hi ha molts altres. Val la pena investigar amb un CDN, sobretot si teniu clients molt lluny de la ubicació del servidor.

8. La vostra base de dades és massa lenta

Actualment, la majoria de llocs web confien molt en el contingut emmagatzemat en una base de dades. Això és especialment cert per als llocs de comerç electrònic. Probablement tingueu molts productes i necessiteu emmagatzemar-los i proporcionar-los un clic. Tot i que les bases de dades són excel·lents i són el vostre amic, la base de dades podria estar poc organitzada o pot haver-hi una sèrie de consultes incorrectes. Recordeu que si un usuari ha d’esperar diversos segons entre cada consulta, s’afegirà. Si els usuaris no troben el producte exacte que volen de seguida o si triga massa, poden sortir sense comprar. Fins i tot si troben alguna cosa, les probabilitats de seguir navegant també disminuiran amb els segons que calgui.

Aquí hi ha un bé guia pas a pas sobre com començar amb això en una base de dades MySQL.

Nota: Si teniu una gran base de dades, potser haureu de contractar un professional de bases de dades per ajudar-vos, ja que això pot implicar-se una mica.

9. El vostre proveïdor d’allotjament web no és prou ràpid

Per molt que faci el joc i l’adaptació que feu al vostre lloc web, és tan ràpid com el seu enllaç més feble, que en aquest cas és el vostre servidor web. L’elecció d’un amfitrió web ràpid és la base d’un lloc web ràpid. De fet, podríeu dividir totes les optimitzacions en dues parts principals: 1) les optimitzacions del vostre lloc web i 2) les optimitzacions del servidor web. L’allotjament web és crucial i és per això que hem escrit àmplies guies al respecte. El vostre servidor web és realment complex i es necessita molta configuració tant per al maquinari com per al programari del servidor físic, però afortunadament, la majoria dels plans d’allotjament web es gestionen, el que significa que l’empresa d’allotjament web ho farà per vosaltres. Per obtenir una llista d’algunes companyies bones per utilitzar, hem publicat aquest article sobre els amfitrions web més ràpids.

Conclusió

Tot i que cadascuna de les categories esmentades es pot detallar amb molt més detall, si seguiu aquestes directrius, teniu una molt bona possibilitat de tallar el temps de càrrega del vostre lloc web a la meitat o més, i segur que millorareu la velocitat del vostre lloc. lloc Si voleu dubtes, feu-me saber a l’apartat de comentaris.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me