La velocidad de la página web es una métrica de clasificación esencial que influye en la experiencia del usuario Aquí le mostramos cómo probar y corregir correctamente la velocidad de su sitio web.
La investigación de Google encontró que las tasas de rebote del sitio web aumentan hasta en un 31% de los tiempos de carga de uno a tres segundos. 31%
En mi experiencia, los tiempos de carga de la página son uno de los errores técnicos más constantes que cometen los desarrolladores web y los administradores web, especialmente en dispositivos móviles.
El primer paso para resolver los errores de velocidad de la página es comprender cómo se cargan los sitios web e identificar las métricas más críticas, que conducen a tiempos de carga más rápidos.
Comprender la velocidad de la página: cómo se cargan los sitios web
Internet es muy complicado.
Entonces, para simplificar esta explicación, podemos dividir el proceso de carga de la página en dos componentes esenciales, que se comunican entre sí.
Clientes <> Servidores
- Clientes: un dispositivo web que envía una solicitud a través de Internet a un servidor para mostrar una página web Los ejemplos de clientes incluyen dispositivos informáticos conectados a WiFi, dispositivos móviles conectados a planes de datos y navegadores utilizados para ejecutar esta función.
- Servidores: una computadora que almacena direcciones web e intenta procesar solicitudes para que los clientes puedan ver una página web Los servidores también pueden llamarse DNS (sistema de nombres de dominio), que alberga todas las direcciones disponibles en Internet.
Comprender la relación entre los clientes y los servidores lo ayudará a descubrir posibles interrupciones o aumentos en la latencia que afectan la velocidad de la página de su sitio web.
Como todos saben, el primer paso para cargar una página web es escribir la URL Esta URL envía una solicitud a un DNS, que obtiene la dirección IP única y procesa la solicitud en el servidor de la aplicación web.
Una vez que se procesa la solicitud, el navegador del usuario enviará una respuesta HTML para comenzar a procesar el Modelo de objeto del documento (DOM) El tiempo para recibir esta información se conoce como el tiempo hasta el primer byte (TTFB), una métrica de carga de página vital.
Una vez que el navegador procese la respuesta HTML, mapeará el modelo de objetos DOM y CSS para ejecutar JavaScript.
Antes de que pueda comenzar la representación precisa de una página, un navegador debe mostrar todos los elementos CSS y JavaScript, lo que significa que si hay scripts de bloqueo externos, ese recurso deberá descargarse.
Luego, se debe realizar otra solicitud entre el navegador y el servidor (aumentando los tiempos de carga).
Una vez completado, se activará un evento de carga de ventana y la página se cargará por completo en la parte superior de la página.
Además, tenga en cuenta que las páginas con carga asíncrona continuarán cargando elementos incluso después de que se ejecuten los eventos de carga de ventana.
Sin embargo, los tiempos de carga de la página diferirán entre los dispositivos móviles y de escritorio, según la compatibilidad móvil del sitio web y la red que el dispositivo utilice para conectarse a Internet.
Por ejemplo, Google establece su punto de referencia para que las velocidades de las páginas móviles carguen al menos un segundo para todo el contenido de la mitad superior de la página, de modo que los usuarios puedan interactuar con los sitios lo antes posible. one second
Dado que la latencia de la red en una red 4G consumirá al menos 300 milisegundos de tiempo de carga de la página, tiene 700 milisegundos para optimizar una página para cargar contenido en la mitad superior de la página en al menos un segundo.
Alcanzar este punto de referencia es posible pero difícil.
Entonces, ¿por qué Google recomienda que las páginas se carguen al menos un segundo por encima del pliegue?
La importancia de la velocidad del sitio web
Dado que Google se basa en la experiencia positiva del cliente para retener su participación en el mercado, solo quiere servir sitios que se carguen de manera rápida y eficiente.
Como resultado, tiende a priorizar las páginas que cargan más rápido que otras. Además, sus análisis tenderán a reflejar esto, ya que las páginas más lentas incurrirán en tasas de rebote más altas que las páginas más rápidas.
En general, hay varias razones por las que es esencial monitorear la velocidad de su página:
- Experiencia del usuario: los usuarios esperan páginas de carga rápida en dispositivos móviles y de escritorio Cuanto más lenta sea su página, más tiempo tardará hasta la primera interacción y mayor será su tasa de rebote Esto no solo afecta las métricas clave de los usuarios, sino que también podría disminuir su tasa de conversión y podría afectar los ingresos de su sitio web.
- Funcionalidad y procesamiento: la velocidad de la página es otro componente importante de la funcionalidad del sitio web y puede impedir los procesos básicos, como cargar carritos de compras o publicaciones de blog, lo que provoca altas tasas de rebote.
- Autoridad y confianza: un sitio web de carga rápida comunica cierto nivel de confianza y autoridad, mientras que tener un sitio web de carga lenta podría indicar que su sitio web está mal construido o incluso contiene spam.
Con estos factores en mente, no podrá optimizar la velocidad de la página de su sitio web sin descubrir problemas que lo influyan negativamente.
Además, descubrirá que las velocidades de página difieren entre dispositivos y ubicaciones, lo que hace que la necesidad de realizar pruebas constantes sea aún más importante.
Consideraciones al ejecutar una prueba de página web
No todas las pruebas o herramientas de velocidad de página ofrecen los mismos resultados.
Por esta razón, equilibrar estos resultados y comprender qué métricas cuidar le brindará los resultados más imparciales.
almacenamiento en caché
En primer lugar, recomendaría probar sitios con almacenamiento en caché habilitado y deshabilitado para ver la diferencia.
La mayoría de las herramientas normalmente ignorarán el almacenamiento en caché, pero otras herramientas como WordPress le permiten probar las velocidades de página con el almacenamiento en caché habilitado. WordPress
Configure su almacenamiento en caché para ver si interfiere con sus resultados o los distorsiona de lo que encuentra en otras herramientas.
Ubicación
Muchas personas no tienen en cuenta la ubicación cuando prueban las velocidades de las páginas, pero las personas en diferentes países y regiones experimentarán diferentes tiempos de carga según la proximidad de su red y servidor.
Incluso he visto a personas reducir sustancialmente los tiempos de carga de su sitio web alojando su sitio en un servidor geográficamente más cercano o habilitando una red de entrega de contenido (CDN), una red de servidores distribuidos.
Ejecución de múltiples pruebas
Como experimentará, cada prueba de velocidad de página puede arrojar resultados diferentes según las anomalías en su sitio web o red.
Por esta razón, recomiendo ejecutar múltiples pruebas en múltiples herramientas para obtener los resultados más precisos de lo que experimentan los usuarios.
Métrica
Finalmente, debemos comprender las métricas más importantes para la velocidad de carga de nuestra página.
A continuación, describo algunos que influirán más en la velocidad de carga de la página.
Tiempo de carga de la página
Esta métrica representa el tiempo total que se tarda en cargar una página por completo.
Google Analytics proporciona un informe de tiempo de carga de la página para cada una de sus URL e incluso en diferentes navegadores.
Tiempo hasta el primer byte (TTFB)
Esto mide el tiempo que tardan los navegadores en recibir una solicitud HTML de un servidor.
Los puntajes bajos de TTFB podrían indicar que tiene muchos archivos grandes en su sitio web o que necesita mudarse a un nuevo servidor.
Número de solicitudes HTTP
Cada vez que su página necesita cargar un archivo, envía una nueva solicitud que podría afectar la velocidad de la página.
Vitales principales de la web
- Pintura con contenido más grande: el tiempo que lleva cargar la imagen o el elemento de texto más grande en una página Esta métrica mide qué tan rápido se muestra visualmente la carga real de su página.
- Retraso de la primera entrada: el tiempo que tarda un usuario en interactuar con una página (es decir, hacer clic en un enlace o desplazarse).
- Cambio de diseño acumulativo: qué tan estable es su página En otras palabras, mide si los elementos de la página cambian una vez que se carga la página.
campo contra Datos de laboratorio
Finalmente, al medir la velocidad de las páginas, es esencial diferenciar entre datos de campo y de laboratorio.
Los datos de campo tienen en cuenta el tiempo de carga histórico de una página, mientras que los datos de laboratorio proporcionan datos de una prueba simulada.
Google Analytics proporciona datos de campo y un registro histórico de cuánto tiempo lleva, en promedio, cargar páginas en su sitio.
Por otro lado, los datos de laboratorio, como Lighthouse de Google, brindan una medida aproximada de las velocidades de carga de la página bajo variables establecidas.
Los datos de laboratorio son excelentes para diagnosticar problemas específicos, mientras que los datos de campo son una excelente manera de trazar el progreso y la usabilidad de su sitio web a lo largo del tiempo.
Con estos consejos en mente, exploremos algunas de las mejores herramientas que recomiendo que cada sitio pruebe para probar la velocidad de su sitio web.
Las mejores herramientas para probar la velocidad del sitio web
Perspectivas de velocidad de página de Google
Google PageSpeed Insights es una herramienta gratuita diseñada para diagnosticar oportunidades específicas en las que falta velocidad de página. Google PageSpeed Insights
Estas sugerencias aumentarán los puntajes de velocidad de su página y aumentarán su clasificación de palabras clave.
Esta herramienta también proporciona métricas para Core Web Vitals, tiempo de interactividad y su índice de velocidad general.
PageSpeed Insights utiliza Lighthouse, que proporciona datos de laboratorio para estimar cómo se cargan las páginas en un dispositivo estándar con una buena conexión WiFi.
PageSpeed Insights es un primer paso útil para descubrir problemas superficiales que pueden resolverse fácilmente.
GT Metrix
GTMetrix es una excelente herramienta de auditoría para la velocidad de la página del sitio web que proporciona datos de laboratorio similares a los de Lighthouse de Google con herramientas de visualización aún mejores. GTMetrix
La pestaña Rendimiento le dice todo lo que necesita saber sobre Core Web Vitals, y la pestaña Estructura brinda oportunidades para mejorar la velocidad de la página.
Sin embargo, mi herramienta favorita en GTMetrix es la pestaña de cascada que le permite visualizar los elementos de carga de la página y cómo influyen en los tiempos de carga de la página.
Pingdom
Pingdom es una herramienta paga, que bien vale la pena si necesita monitorear la velocidad de la página en tiempo real a través de su configuración de Monitoreo de usuario real. Pingdom
Esta herramienta permite tanto datos de laboratorio simulados como datos de campo en tiempo real para que pueda ver cómo funciona su sitio web en diferentes dispositivos, redes y clientes.
Pingdom también proporciona las mismas métricas e información procesable que otras herramientas brindan con soporte continuo para su sitio web.
Prueba de página web
Desde mi punto de vista, WebPageTest es la mejor herramienta gratuita de prueba de velocidad de la que haya oído hablar. WebPageTest
Esta herramienta proporciona todos los mismos datos de laboratorio que Lighthouse, con la capacidad de realizar pruebas en múltiples dispositivos y redes.
Algunas de sus características más notables incluyen:
- Cascada.
- Video de carga de su página.
- Métricas de rendimiento.
- Seguimiento de vistas.
- Varias pruebas a la vez.
Lo que es más importante, puede ver su sitio web mientras se carga en tiempo real con la Vista de tira de película.
WebPageTest incluso proporciona un pequeño cuestionario ordenado, como si su sitio web es rápido, utilizable o resistente, con respuestas para decirle dónde necesita mejorar su sitio.
Consola de búsqueda de Google
Le recomiendo que acceda al Informe de velocidad en Google Search Console para obtener una visión más detallada de las velocidades de página individuales. Speed Report
Este informe proporciona puntajes de velocidad individuales y rendimiento general en todos los navegadores y dispositivos.
Use Search Console para monitorear cualquier progreso o cambio en su sitio Por supuesto, también puede descubrir muchos de los mismos datos en Google Analytics.
nueva reliquia
New Relic ofrece herramientas sofisticadas para monitorear la velocidad de la página a lo largo del tiempo, depurar su código e incluso limpiar sus complementos para canalizar una velocidad del sitio más rápida. New Relic
Esta herramienta requiere una suscripción, pero tiene características útiles como alertarlo cuando la velocidad de la página baja en tiempo real después de que se haya realizado un cambio en el sitio.
Consejos para mejorar la velocidad del sitio web
Si bien las herramientas pueden señalar problemas individuales con su sitio web, existen algunas mejores prácticas generales que puede seguir para mejorar la velocidad de la página de su sitio web.
Habilitar la compresión
Los archivos grandes y los tamaños de imagen son un lastre significativo para cualquier sitio web, por lo que habilitar la compresión a través de un complemento automatizado puede ayudar.
Hay docenas de complementos disponibles para WordPress, incluidos favoritos como Optimole y WP Rocket que incluye el complemento Imagify. Optimole
almacenamiento en caché
El almacenamiento en caché es otra victoria fácil para aumentar rápidamente las velocidades del sitio web para los clientes habituales.
El almacenamiento en caché web o del navegador permite que los sitios web almacenen pequeños fragmentos de datos en los dispositivos del lado del cliente, por lo que se recuperan menos recursos la próxima vez que cargan un sitio web.
Los complementos como WP Rocket y WP Super Cache permiten el almacenamiento en caché y pueden mejorar significativamente su experiencia de usuario. WP Rocket
Carga lenta
Otra característica que ofrecen las herramientas de almacenamiento en caché como WP Rocket o LazyLoad es la capacidad de retrasar la carga de archivos hasta que el usuario accede a ellos. LazyLoad
En otras palabras, si tiene imágenes debajo del pliegue en una página web, la carga diferida permite que un sitio web retrase la carga de esa imagen hasta que un usuario se desplaza hacia abajo en la página.
Optimice la ubicación de su servidor/CDN
Alojar su página web en un servidor geográficamente cercano puede reducir significativamente la latencia y los tiempos de carga.
Sin embargo, si distribuye contenido a una audiencia global, invertir en una red de entrega de contenido (CDN) puede reducir en gran medida los tiempos de latencia y las velocidades de carga para las personas en todo el mundo.
Minimizar recursos
Además de las imágenes, CSS y JavaScript serán los dos elementos más grandes de cualquier página web que se requiera cargar.
Por lo tanto, minimizar o eliminar los recursos CSS y JavaScript innecesarios, como los datos duplicados, reducirá la cantidad de solicitudes y descargas que un cliente y un servidor deben ejecutar para cargar una página correctamente.
Reduzca los complementos y el código innecesario
Finalmente, la eliminación de recursos innecesarios, como grandes complementos de back-end, liberará recursos en su sitio web y ejercerá menos presión sobre los dispositivos mientras intentan cargar su sitio web.
Desafortunadamente, es muy común que los propietarios de sitios de WordPress dejen atrás los complementos heredados mucho después de que hayan cumplido su propósito, lo que puede afectar en gran medida la eficiencia y la funcionalidad de un sitio web.
Conclusión
Ahora que comprende cómo probar la velocidad de su sitio web y qué métricas buscar, puede implementar soluciones para aumentar la velocidad de su sitio web y monitorear cómo impactan sus clasificaciones de SEO.
Si bien la velocidad del sitio web es uno de muchos factores, los beneficios de un sitio web de carga rápida superarán significativamente cualquier costo que invierta en él.
Más recursos:
Imagen destacada: Kaspars Grinvalds/Shutterstock
Leer el articulo original en Search Engine Journal.
