Pasos básicos para mejorar la velocidad de carga de una web sin perder dinero

Pasos básicos para mejorar la velocidad de carga de una web
9 min. de lectura

Hoy tengo el placer de publicar un artículo de mi compañero en Webescuela Josep Gonzàlez, un crack del desarrollo de webs en WordPress y optimización WPO. Nos va a dar unos consejos para mejorar la velocidad de carga de una web y que no nos duela a nuestros bolsillos, os dejo con el.

¿Os habéis parado a pensar en que si vuestra web no carga bien estáis perdiendo dinero? Pongamos un ejemplo práctico: Imaginaos que alguien entra en vuestra web y ésta tarda 3, 4, 5 segundos en cargar y la persona al otro lado de la pantalla se busca la vida y cambia de página.

Habéis perdido una visita, un posible lector, un suscriptor, un pedido, un proyecto a largo plazo, una boda que organizar o un cliente fiel que compre todas las semanas… Para que no os pase, voy a explicar algunos pasos básicos para mejorar la velocidad de carga de una web sin perder dinero.

¿Cuánto debe tardar una web en cargar?

Una web debe tardar en cargar de 1 a 3 segundos, lo ideal sería que no llegase a 2 segundos. Aunque en mi blog os lo explico todo más detalles sobre cómo medir la velocidad de carga de una web, aquí os pondré lo que tenéis que hacer paso a paso para que vuestra web cargue bien, sin fallos y rápido.

PASO 1: Comprobar la velocidad de nuestra web

Antes de meternos a modificar nuestra web, tendremos que saber en realidad cuánto tarda nuestra página en cargarse. Así que lo que haremos es ponernos en manos expertas o, más bien, en webs expertas.

Existen muchas páginas que analizan nuestros sitios gratuitamente, indicando los diferentes tiempos de carga para que nosotros sepamos y podamos analizar la velocidad y si tenemos que preocuparnos o no.

Vamos a ver si tenéis que seguir leyendo este post o no.

Os voy a dejar unas webs que a mí personalmente me van muy bien:

Gtmetrix

velocidad de carga con gtmetrix

Empiezo con mi favorita. Muy intuitiva y personalizable, con opciones de métrica y desde qué país se ve la web. Nos podemos registrar para poder ver la evolución de los datos al cabo del tiempo.

Pingdom Tools

Comprobar lweb pingdom tools

Muy parecida a Gtmetrix, más visual y hay quien las complementa. Ambas son igual de fiables y recomendables.

Page Speed Insights

Google Page Speed Insights

La que Google prefiere y, ya sabéis que lo que dice Google siempre nos interesa. Normalmente para analizar webs utilizamos más de uno, para verificar sus datos así que ésta siempre deberéis complementarla con una de las de arriba, la que prefiráis.

Como veis, mi página sí que pasa la prueba de la velocidad (ufff), ¿y la vuestra? Si es que sí, podéis estar tranquilos y dejar de leer el artículo y seguir con vuestras vidas. Si la velocidad está por encima del 3 o se acerca demasiado al 3, os recomiendo que sigáis leyendo para ir mejorando y restarle cifras.

PASO 2: ¿Mi web está alojada en un servidor lento?

Este apartado, aunque parezca muy técnico, en realidad es muy simple.

Como sabéis, para tener una web tenemos que haber contratado un hosting y un dominio (.com, .es, .eu,…). Si ya lo hemos comprado podemos verificar ciertos aspectos básicos y, si estamos a punto de comprarlo, hay que tener en cuenta cosas como… ¿dicen que es rápido? Bien. Nos interesa que se promocionen como una empresa que ofrece un hosting rápido porque si lo venden así es que, en realidad, es así.

Además, entrando ya en ciertos aspectos más técnicos, tiene que tener una versión de PHP 7.0 o superior y que cuente con servidor con caché propia. Pero antes de que os tengáis que preocupar por este tema, hay que mencionar que el mundo del hosting hoy en día es uno de los negocios que más crece así que son muchas las empresas que ofrecen este servicio y a ninguna le interesa quedarse atrás.

Así que, como conclusión a la pregunta: ¿mi web está alojada en un servidor lento? Es muy poco probable pero nunca imposible. Comprobarlo no cuesta nada y si detectas que podría ser así, no te va a costar nada hablar con el servicio técnico de la empresa de hosting o cambiarte.

Una vez que hemos mirado cómo está nuestra web, sin haber tocado nada, y vemos que, efectivamente, necesita unos cambios, vamos a ver qué tenemos que hacer para mejorar la velocidad de carga de nuestra web sin perder dinero.

PASO 3: Optimizar imágenes

Me imagino que a estas alturas os estáis preguntando cuál es el motivo por el que una web vaya lenta. Pues para simplificarlo, se diría que cuánto más pese una web, más lenta irá. Una web no sólo está compuesta de código, ya que también hemos subido imágenes, hemos comprado una plantilla, complementos (o plugins),… y todo esto, si no lo hemos hecho bien, pesará y ralentizará el tiempo de carga de nuestra web.

tipos de imagenes para web

Así que primero nos vamos a centrar en las imágenes, que seguramente es uno de los factores de los que más pesan y en los que podemos notar una gran diferencia en la velocidad de carga. En mi blog dediqué un post a optimizar las imágenes de tu web únicamente a este apartado, pero os daré unos trucos muy útiles.

JPG o PNG

Os parecerá una tontería pero tenéis que entender que entre JPG o PNG para web tenéis que escoger la que contiene menos información y, por tanto, la que pesará menos: PNG. Eso no significa que perdáis calidad de imagen, la mayoría de las imágenes que encontraréis por la red son PNG y son de muy alta calidad, por no decir de la que más.

Redimensiona tus imágenes

Esta recomendación también sirve para el estilo, y es que para que visualmente vuestra web/blog sea corporativo y atractivo, las imágenes deberían ser del mismo tamaño o seguir una línea similar. Así que lo ideal sería crear una plantilla con los diferentes tamaños a utilizar en Photoshop en vez de subir cualquier imagen en distintos tamaños.

De este modo ya le estamos quitando cierta información, como es el tamaño original. E, incluso, si queremos mantener el tamaño original pero no nos hace falta que sea tan grande porque imaginaros que es una imagen de más de 5000 píxeles, pues podemos utilizar el Photoshop también para redimensionar la imagen y bajarla a 1000, no perderemos calidad, sólo la bajaremos de tamaño.

Guardar para web

Si no habéis utilizado nunca esta opción en Photoshop, a partir de ahora la vais a usar siempre. Tanto si hemos redimensionado una imagen, añadido letras, modificado luz/color/aspecto o lo que sea, cuando guardemos la imagen lo haremos con ‘Guardar para web’.

De este modo sacaremos la información extra que contiene la imagen y que, como el mismo nombre indica, será perfecto para subirla a nuestra página. ¿Os acordáis de lo que he hablado en el punto sobre JPG o PNG? Cuanta más información tenga una imagen, más pesará, así que lo ideal será ‘Guardar para web’ y en el formato escoger el ‘.png’.

guardar para web photoshop

TinyPNG

Por último, os recomiendo que cuando tengáis vuestra imagen ya preparada para subirla a vuestra web, os paséis antes por TinyPNG. Es una web muy simple que va a comprimir vuestro archivo .png (o .jpg, aunque ya os he recomendado que guardéis en el primero) y, aunque hayamos seguido todos los pasos previos y la imagen guardada pesará pocos KB, con esta herramienta online la reduciremos aún más.

Una imagen no debería pesar mucho, no puedo deciros un peso exacto porque no puedo juzgar sin ver pero hay quienes hablan sobre los 200 KB, pero a mí me parecen excesivos. Para una web, cuantos menos KB pese la imagen, mucho más rápido cargará la página. Recordad que en una web hay decenas (o centenares o miles) de imágenes, así que nos interesa que pesen lo mínimo posible.

PASO 4: Limpieza de plugins

En este paso necesitaré que utilicéis la lógica y que me respondáis con sinceridad: ¿todos los plugins que tenéis instalados son imprescindibles para el funcionamiento de vuestra web?

Muchas veces pecamos de instalar múltiples plugins y nos equivocamos, como he comentado al principio los plugins o complementos también pesan y hacen que nuestra web se ralentice y afecte a la velocidad de carga (a mayor velocidad, mayor será la probabilidad de pérdida de dinero).

Así que os recomiendo que os toméis un tiempo en analizar vuestra web y vuestros plugins para saber cuáles son útiles y cuáles no para realizar una correcta limpieza que os beneficie.

PASO 5: ¿Comprobamos de nuevo la velocidad de carga?

Si habéis hecho los deberes y seguido los pasos tal y como os los he explicado, no deberéis tener miedo por los resultados de las páginas de Gtmetrix, PingdomTools y PageSpeed.

Con la optimización de imágenes, comprobación de servidor y limpieza de plugins, vuestra página deberá haber menguado de tamaño notablemente y, por tanto, la velocidad de carga habrá mejorado muchísimo.

Si no es así y habéis seguido el paso a paso, quizás deberíamos profundizar más en el problema. Podéis dejar un comentario y tanto yo como José Luís miraremos de ayudaros encantados.

Si os ha gustado este post, podéis encontrarme y seguirme en las redes sociales y pedirle a José Luís que me deje participar más en este blog suyo que tanto me gusta y sigo desde hace años. Para mí es un placer ser su invitado y espero poder escribir para vosotros muchas veces más.

Nos leemos.

Pin It on Pinterest

¿Necesitas Enlaces? Aquí tienes 30

Suscríbete al newsletter para estar al día de todo lo que publico en el blog y recibirás un documento con 30 sitios + bonus donde poner tu enlace de forma gratuita.

Antes de enviar tu consulta, échale un vistazo a la información básica sobre protección de datos que tienes a continuación.


Responsable » José Luis López
Finalidad » Enviarte 30 enlaces para tu web y mi newsletter
Legitimación » Tu consentimiento
Destinatarios » Tus datos los guardará Raiola Networks, mi proveedor de email marketing
Derechos » Tienes derecho, entre otros, a acceder, rectificar, limitar y suprimir tus datos

Puedes consultar mi política de privacidad.