Guía básica de WPO para acelerar la carga de tu web
De los más de 200 factores que Google tiene en cuenta a la hora de adjudicar las posiciones en sus resultados de búsqueda, mejorar la velocidad de carga es uno de los más importantes, ya que no solo afecta al posicionamiento en buscadores, sino que también influye en las conversiones o cualquier otro objetivo que pueda tener tu sitio. De hecho, según diversos estudios, cuando el tiempo de respuesta supera los 3 segundos, la tasa de abandonos ronda el 40%. Por eso, es de vital importancia mantenerse por debajo de ese límite.
Afortunadamente no es muy difícil mejorar la velocidad de carga de cualquier web para situarla dentro de unos límites aceptables. En esta entrada vamos a compartir algunas acciones sencillas que pueden hacer mucho por la velocidad de tu sitio.
1. Optimiza todas las imágenes
Uno de los principales problemas que influyen en la velocidad de carga de muchos sitios son sus imágenes. Una imagen mal optimizada puede llegar a pesar varios MB, lo que empeora mucho el tiempo de respuesta, eso sin tener en cuenta los dispositivos móviles, donde además el volumen de datos está limitado mensualmente.
Para optimizar las imágenes lo primero es darles unas dimensiones apropiadas, no tiene sentido subir al servidor una imagen de 2600 x 1200 si luego la vamos a mostrar escalada a 800 x 600. Esto es muy importante pues aunque las imagenes se muestren redimensionadas, se va a seguir cargando la imagen completa.
El siguiente paso es comprimir esas imágenes para que ocupen aún menos espacio. Para ello podemos usar algún compresor online del tipo:
https://compressor.io/
https://kraken.io/
http://compressjpeg.com/es/
http://webresizer.com/resizer/
2. Especifica la caché del navegador para todos los recursos
Muchos de los recursos que se sirven desde una página web, como imágenes, archivos JS y CSS o los propios textos, permanecen invariables a lo largo del tiempo, o no suelen cambiar a menudo. Debido a esto es posible fijar su fecha de caducidad, para que el navegador de los visitantes, cargue en sucesivas visitas, los recursos que tenga guardados o cacheados durante un tiempo determinado, en lugar de volver a descargarlos del servidor.
Para especificar la caché del navegador tan solo tendremos que añadir las siguientes líneas al final del archivo .htaccess de nuestro servidor. Este fichero por lo general se encuentra en la raíz del directorio donde se encuentran los archivos de la web.
* PRECAUCIÓN: un error en el archivo .htaccess puede hacer que tu página deje de funcionar. No olvides hacer una copia de seguridad antes de empezar a modificarlo.
* NOTA: haz clic en las imágenes para copiar el código.
3. Habilita la compresión
Otra acción importante, que nos va a permitir mejorar la velocidad de carga considerablemente, es comprimir la información antes de enviarla. De esta manera lograremos que las páginas lleguen antes a su destino y se muestren más rápido, ahorrando ancho de banda en el servidor.
La mayoría de servidores pueden ser fácilmente configurados para servir la información comprimida mediante alguno de los métodos disponibles, como gzip o deflate. Además, existen funciones en php que permiten comprimir el contenido antes de enviarlo, aunque esta opción solo es recomendable si no tenemos acceso a la configuración del servidor.
Como en el caso anterior, para habilitar la compresión gzip en el servidor, tendremos que añadir las siguientes líneas al archivo .htaccess:
Si el código anterior no tiene ningún efecto, es posible que tu servidor no tenga el módulo gzip activo. En este caso podríamos probar con deflate, que básicamente hace lo mismo. Para comprimir con deflate tendremos que sustituir las líneas anteriores por estas otras:
4. Minifica y unifica la entrega de CSS y Javascript
Por cada recurso que se usa en una web (como archivos JS, CSS, fuentes, imágenes…) se realiza una petición al servidor, y cada una de estas peticiones supone un tiempo de espera entre que se solicita el recurso y el servidor responde con la descarga. De hecho, en alguna ocasión, el tiempo de la petición puede ser superior al de la propia descarga. Por tanto, es muy recomendable reducir el número de peticiones al mínimo.
Una buena práctica para reducir las peticiones, es unificar todo el contenido CSS en un solo archivo “.css” y todo el código Javascript en un solo archivo “.js”. De esta forma, lograremos reducir a 2 todas las peticiones de archivos js y css que pueda tener la web. Además, el código de estos archivos se pueden comprimir o minificar, ahorrando una gran cantidad de bytes y por tanto acelerando los tiempos de descarga y procesado de los mismos.
Artículos relacionados
Agustín
Últimos artículos de Agustín (Ver todos)
- 5 Herramientas online para conocer tu posición en Google - 8 noviembre, 2016
- Tipos de certificados SSL para tu migración a HTTPS - 4 octubre, 2016
- ¿Responsive design, sitio móvil o dynamic serving? ¿Cuál elegir? - 10 agosto, 2016