La velocidad de tu página web es parte crucial del SEO (puedes saber un poco más sobre SEO aquí), y a medida que más empresas deben trabajar de forma virtual, la optimización se vuelve más importante que nunca. Esta también es una parte fundamental de tu estrategia de Marketing Digital que debes cuidar.
El 53% de los usuarios abandona una página si ésta tarda más de 3 segundos en cargar. según un estudio realizado por Google, con 3.700 datos anónimos de Google Analytics.
Google se ha diferenciado por poner las necesidades de los usuarios primero. Por eso, dan prioridad a los sitios web más rápidos y con mejor rendimiento
¿Qué significa esto? que si tu web es rápida tendrá más posibilidades de estar entre los primeros resultados de Google. Esto ha ganado importancia desde la aparición de los smartphones.
¿Cuáles son los aspectos más importantes que debes comprender acerca de la velocidad de tu página y cómo puedes mejorarla? Aquí te damos más detalles.
Cómo se carga una página web
Para entender por qué un sitio puede ser más lento, es importante conocer qué pasa al cargar una web:
- Un usuario va a un navegador, ingresa a tu sitio web y genera una solicitud de DNS.
- Esto apunta a tu proveedor de nombre de dominio, por ejemplo Godaddy.
- Luego se dirige a tu servidor o hosting donde se encuentran tus archivos.
- El Document Object Model o DOM (“Modelo de Objetos del Documento” o “Modelo en Objetos para la Representación de Documentos”) comienza a cargar todo tu HTML, tu CSS y tu JavaScript. Pero muy raramente, este extrae todos los scripts necesarios o el código necesario para representar o cargar una página web.
Por lo general, el DOM necesitará solicitar recursos adicionales de tu servidor para que todo suceda, y aquí es donde se puede ralentizar tu sitio.
¿Qué podría estar ralentizando tu sitio?
Los problemas más comunes que pueden hacer un sitio web más lento son:
- Las imágenes grandes: son el mayor culpable de las páginas web de carga lenta.
- Problemas con el hosting.
- Complementos, aplicaciones y widgets, básicamente cualquier script de terceros también puede ralentizar el tiempo de carga.
- El tema y cualquier archivo grande pueden ralentizar el sitio.
- La cantidad de saltos o redirecciones necesarias para acceder a una página web pueden ralentizar el proceso de carga.
- Un sitio web con grandes bases de datos que no estén correctamente optimizadas.
- Si estás usando un sistema de gestión de contenidos (CMS) como WordPress, tener muchos plugins puede hacer que tu web tenga un desempeño pobre en velocidad.
Herramientas y recursos relacionados con la velocidad de página
Estas herramientas son las más recomendadas para analizar tu página y las de tus competidores y que puedas realizar los cambios necesarios para mejorar:
Informe de experiencia del usuario de Chrome
Esta es la métrica de usuario real de Chrome. Desafortunadamente, solo está disponible para sitios web más grandes y populares, pero permite obtener algunos datos muy buenos. Está alojado en BigQuery, por lo que se necesitan algunos conocimientos básicos de SQL.
Lighthouse
Lighthouse está disponible en Chrome Dev Tools. Si estás en una página web y haces clic en “Inspeccionar elemento” y abres Chrome Dev Tools, en la pestaña de la derecha donde dice “Auditoría”, puedes ejecutar un informe de Lighthouse directamente en tu navegador.
Page Speed Insights
PageSpeed Insights es realmente interesante. Esta herramienta verá cómo está configurado tu sitio y proporcionará comentarios de acuerdo con eso y lo puntuará. Además permite probar la velocidad y el rendimiento de tu sitio web móvil.
TestMySite de Google
En esta herramienta, Google aprovecha las métricas del mundo real, vinculándolas al porcentaje de personas que estás perdiendo debido a la lentitud de tu sitio
Otras herramientas muy útiles con Pingdom y GTmetrix.
Métricas de velocidad del sitio
¿Cuáles son algunas de las métricas que debes analizar para conocer la velocidad de tu página y mejorarla?
First paint
First Paint es la primera pintura que no está en blanco en una pantalla. Podría ser solo el primer cambio de píxel. Ese cambio inicial se considera primera pintura.
¿Qué es First Paint con contenido? Es cuando aparece el primer contenido. Esto podría ser parte del navegador o la barra de búsqueda o lo que sea.
¿Qué es First Paint significativo? Es cuando el contenido primario es visible. Cuando obtienes esa reacción de “Sí, esto es para lo que vine a esta página”, esa es la First Paint significativa.
Tiempo para interactuar
Todos hemos ido a una página web y parece que está lista, pero todavía no podemos usarla. Ahí es donde entra esta métrica. Entonces, ¿cuánto tarda la página en poder ser utilizada por el usuario?
Contenido DOM cargado
Es cuando el HTML está completamente cargado y analizado.
Formas de mejorar la velocidad de tu página
Existen muchas formas de mejorar la velocidad de tu página y darle a tus usuarios una experiencia positiva:
HTTP/2
HTTP/2 definitivamente puede acelerar las cosas. Se basa en SPDY, un protocolo presentado en 2009 por Google con la intención de acelerar las webs. En ese entonces se hablaba de un aumento del 22-60% de la velocidad de carga de las webs convencionales y un aumento del 39-55% en el caso de las webs con SSL.
Preconectar, captar previamente, precargar
La conexión previa, la captación previa y la carga previa son muy importantes para acelerar un sitio. Vemos a Google haciendo esto en sus SERPs. Si inspeccionas un elemento, puedes ver que Google obtiene previamente algunas de las URL para que lo tengas más rápido si haces clic en algunos de esos resultados. De manera similar, puedes hacer esto en tu sitio. Ayuda a cargar y acelerar ese proceso.
Habilitar el almacenamiento en caché y usar una red de entrega de contenido (CDN)
El almacenamiento en caché es muy importante por eso debes asegurarte de que está configurado correctamente. Lo mismo con la red de entrega de contenido o CDN
Comprimir imágenes
La forma más fácil y probablemente más rápida de acelerar tu sitio es comprimir las imágenes. Hay todo tipo de herramientas gratuitas disponibles para guardar para Web y comprimir correctamente.
Minificar recursos
La minificación es el proceso de eliminar caracteres innecesarios del código sin cambiar la forma en que funciona.
Estos caracteres innecesarios suelen ser cosas como:
- Caracteres en espacios en blanco
- Nuevos saltos de línea
- Comentarios
- Delimitadores de bloque (corchetes)
¿Por qué debes acelerar tu sitio web?
Existen 3 aspectos fundamentales que deben darte razones suficientes para preocuparte por la velocidad de tu sitio web. Estos son:
Usabilidad: se trata de permitir que tus usuarios tengan una experiencia más intuitiva y sencilla en la web. Al tener un sitio que se tarda demasiado en cargar, los usuarios se irán a otro que les permita navegar de una forma más fácil.
Ranking de Google: como ya mencionamos, Google le da prioridad en sus resultados a los sitios que cargan con más rapidez. Estar aquí es muy importante ya que aumentan tus posibilidades de conversión y venta.
Experiencia de usuario de dispositivos móviles: una encuesta de Google apunta que el 61% de los usuarios de Smartphone son más propensos a irse a otro sitio si no encuentran lo que están buscando rápidamente. Eso significa que si el sitio de tu negocio es lento y no está adaptado para dispositivos móviles, esta no será una buena experiencia y puedes perder ventas y clientes. Es por esto que la experiencia de usuario cada vez es más importante.
Una experiencia de usuario negativa no solo hará que pierdas un cliente o venta, también puede afectar considerablemente la reputación online de tu marca, tomando en cuenta que, hoy en día, los usuarios acuden a internet para dar su opinión sobre todo lo que compran (o intentan comprar). Las malas referencias se popularizan y la labor para limpiar tu nombre puede ser más cara que poner en práctica estas optimizaciones.
Como ves, lograr un sitio optimizado requiere de cuidar varios detalles y tener algunos conocimientos técnicos. En el mundo tecnológico y digital es muy importante mantenernos actualizados y saber que constantemente nacen nuevas tendencias y herramientas diseñadas para que las marcas y negocios aprovechen al máximo las ventajas del internet.
Contar con un equipo capacitado en temas de programación y diseño web puede ser la clave para lograr una web que le dé a tus usuarios la experiencia que merecen y a tu negocio, las ventas que siempre soñaste. (Fuentes: Woorank, Moz, Xataka, HostGator)
