La velocidad de carga de las páginas web es crucial para la usabilidad del sitio. Google considera que la velocidad de carga de página es uno de los 200 factores que influyen en la posición del sitio web entre los resultados de búsqueda orgánica y, definitivamente, enriquece la experiencia de usuario. Debido a los numerosos sitios web existentes en tu mismo nicho, la competencia para obtener tráfico web e impresionar a las personas con una mejor usabilidad gana importancia día tras día. Si tu sitio web no carga rápidamente, es probable que pierdas visitas y que estas opten por algún sitio de la competencia en cuestión de segundos.
A continuación te presentamos 10 consejos rápidos para optimizar el tiempo de carga de tu sitio web:
1. Optimiza el formato y el tamaño de las imágenes
Las imágenes de tu sitio pueden consumir una gran cantidad de ancho de banda, que afecta al tiempo de carga de tu página. Reducir el tamaño de las imágenes de tu sitio web en el código HTML no es suficiente, pues así solo se modifica su apariencia, pero no su tamaño real. Utiliza herramientas de edición de imagen externas, como Photoshop, para modificar el tamaño de las imágenes y adapta la resolución a 72 dpi.
Además, puedes utilizar herramientas de optimización de imágenes, que comprimen la imagen para reducir aún más su tamaño:
- JPEG & PNG Stripper
- Smush.it
- Online Image Optimizer
- SuperGIF
Para conseguir que el tiempo de carga de tu página esté optimizado, se recomienda utilizar formatos de imagen estándar, como JPG, PNG y GIF.
2. Optimiza las dependencias
Complementos: Un sitio que requiere complementos puede reducir la velocidad de carga de tu página. No todos los complementos son innecesarios; por ejemplo, los complementos para compartir en redes sociales son imprescindibles hoy en día. Dicho esto, comprueba siempre si existe una alternativa mejor al complemento, como el uso de un sistema de gestión de contenidos con complementos sociales integrados.
Monitoreo de scripts:Aunque es recomendable hacer un seguimiento de las estadísticas de tráfico de tu sitio web, no conviene utilizar múltiples programas de monitoreo, pues pueden aumentar el tiempo de carga de la página. Si utilizas un sistema de gestión de contenidos como WordPress, deberías permitir ejecutar scripts o bien a WP-Stats o bien a Google Analytics, pero no a ambos.
Sistemas de gestión de contenidos:Si utilizas un sistema de gestión de contenidos como WordPress, se recomienda comprobar las actualizaciones de software con frecuencia, pero no cargarlas en un sitio web público. Aplica primero las actualizaciones en un servidor independiente para probarlas. Mantener las actualizaciones de software al día también mejora la velocidad del sitio.
3. Evita archivos JS y CSS internos
Es una buena práctica situar el código JS y CSS de tu sitio web en archivos externos. Cuando se carga la página, el navegador almacena estos archivos de forma externa en la memoria caché y reduce el tiempo de carga de la página en las solicitudes posteriores. Es más, tener el código JS y CSS en archivos externos facilita el mantenimiento del sitio.
4. Optimiza el almacenamiento en caché
Cada vez que un visitante carga un sitio, los archivos de imagen, CSS y Java de tu página web también se cargan, consumiendo gran parte de tiempo de carga de la página. Si el proceso de almacenamiento en caché está bien configurado, tu navegador puede almacenar estos recursos o archivos para las solicitudes posteriores. Al cargar varias veces la página, estos archivos pueden recuperarse de la memoria caché en lugar de descargarse de nuevo a través de la red. Esta opción reduce el coste de ancho de banda y de alojamiento.
Puedes utilizar encabezados "Expires para los componentes estáticos del sitio y encabezados "Cache-Control" para los dinámicos. El uso de estos encabezados permite almacenar en caché los distintos componentes de un sitio, incluidos scripts, contenido flash, imágenes y hojas de estilos, lo que a su vez minimiza el número de solicitudes HTTP y, por tanto, mejora el tiempo de carga de la página. Con el uso de encabezados «Expires » puedes controlar el tiempo máximo que pueden utilizar los componentes de una página web para almacenarse en caché, como se muestra en el siguiente ejemplo:
Expires: Wed, 20 Apr 2015 20:00:00 GMT
Si tu servidor es Apache, puedes establecer el tiempo para el contenido en caché con la directiva «ExpiresDefault », que define la fecha de caducidad como un número de años a partir de la fecha actual:
ExpiresDefault "access plus 15 years"
5. Evita los scripts que bloquean la renderización
Ubica los archivos JavaScript al final del cuerpo de la página o utiliza el atributo «async » para cargarlos de forma asíncrona.
6. Evita los redireccionamientos
Evitar redireccionamientos aumenta la velocidad del servicio. Algunos redireccionamientos son inevitables y deben utilizarse, pero debes recordar que utilizan solicitudes HTTP adicionales y, por tanto, aumentan el tiempo de carga de la página. Comprueba los enlaces rotos y soluciónalos inmediatamente.
7. Configura la codificación G-Zip
Del mismo modo que se empaquetan y comprimen los archivos en tu computadora para reducir su tamaño total en transferencias en línea, los archivos de gran tamaño de tu sitio web pueden empaquetarse mediante la compresión G-Zip. De esta forma se ahorra ancho de banda y tiempo de descarga, aumentando la velocidad de carga de tu página. Deberías configurar el servidor para que devuelva contenido comprimido.
8. Reduce las solicitudes HTTP
Utiliza CSS Sprites para reducir el número de solicitudes de imagen. Combina las imágenes de fondo en una sola imagen utilizando los elementos CSS «background-image » y «background-position ». Combina las imágenes internas con tus hojas de estilos almacenadas en caché. Del mismo modo, combina todos tus archivos JavaScript en un archivo individual, así como todos tus archivos CSS en otro.
9. Minifica el código JavaScript y CSS
El proceso de minificación consiste en la compresión del código mediante la reducción de nombres, reduciendo su tamaño y, por tanto, el tiempo de carga. Para ello recomendamos utilizar uglify.js.
10. Reduce el tamaño de las cookies
Las cookies se utilizan para almacenar datos que necesitan perdurar entre solicitudes. Estos datos se envían con cada solicitud y aumentan el tiempo de carga cuando son de gran tamaño. Por tanto, al reducir el tamaño de las cookies se reduce el tamaño de los datos que se transfieren y disminuye el tiempo de carga de la página. Elimina las cookies innecesarias o reduce su tamaño.