Velocidad de carga de los artículos en móvil, GTmetrix..

Ecuador: Medios de comunicación y la velocidad de carga

Conseguir información rápidamente -especialmente en tiempos como ahora con el Covid-19- es importante. Así quiero revisar la velocidad de carga de los sitios de varios medios de comunicación:

  • El Comercio
  • El Universo
  • El Telégrafo
  • Metro Ecuador
  • Expreso
  • La Hora
  • El Mercurio
  • Primicias
  • Ecuavisa
  • Teleamazonas
  • RTS

La velocidad de carga es importante para los usuarios. Pero también puede influir en el SEO. La velocidad es un factor de ranking. Sin embargo, hasta ahora Google solo penaliza páginas que se cargan muy lentamente. Pero no sabemos a partir de cuántos segundos de carga una página es “muy lenta”.

Lo que hay que tomar en cuenta es que por el Coronavirus y la necesidad de informarse el tráfico web hacia algunos sitios de medios de comunicación se ha aumentado drásticamente. Entonces puede ser que con el aumento del tráfico sus contenidos se carguen más lentamente.

Datos de Similarweb sobre el tráfico de El Universo y ElComercio en marzo de 2020.
Datos de Similarweb sobre el tráfico de El Universo y El Comercio en marzo de 2020, fuente: https://www.similarweb.com/website/elcomercio.com?competitors=eluniverso.com.

En Google Trends también podemos observar un aumento de búsquedas por periódicos online.

Pero obviamente estos sitios también deben funcionar bien y rápidamente cuando hay mucha demanda por información y mucho tráfico web. Son medios de comunicación grandes y deberían tener los recursos para manejar un aumento de tráfico.

Revisé los sitios con GTmetrix y con Google PageSpeed Insights. GTmetrix mide la velocidad de carga de la versión desktop de una página web. También muestra el peso de la página y el número de las solicitudes que el navegador tiene que mandar al servidor para descargar todos los archivos. PageSpeed Insights muestra la velocidad de carga para móvil y desktop.

En el caso de PageSpeed utilicé los valores de “primer renderizado significado”, “índice de velocidad” y “tiempo hasta que está interactiva”. El «índice de velocidad» utilicé para decidir cuál página se carga más rápidamente.

Qué significan los datos de PageSpeed.
PageSpeed Insights: First Meaningful Paint (FMP): primer renderizado significado; Time to Interactive (TTI): tiempo hasta que está interactiva. El «índice de velocidad» es está entre «FMP» y «TTI». Fuente: https://youtu.be/6Ljq-Jn-EgU?t=734

Primer “renderizado significado” significa que ya se puede ver algo de la página que se carga. Índice de velocidad muestra cuando el contenido está visualmente cargado. “Tiempo hasta que está interactiva” es el tiempo de carga hasta que se puede utilizar todas las funciones de una página.

Hice varias pruebas. Los resultados son muestras. El número de imágenes o videos en un artículo o en la página de inicio puede variar. Así también los tiempos de carga pueden variar.

Esto son los resultados:

Muchos sitios son realmente lentos

La mayoría de las páginas de inicio de los sitios de los medios de comunicación se cargan lentamente en la versión móvil. La excepción son El Comercio y El Telégrafo según los datos de Google PageSpeed Insights cuando revisas el tiempo de carga en segundos.

Velocidad de carga de las páginas de inicio en la versión móvil, PageSpeed Insights.
Velocidad de carga de las páginas de inicio en la versión móvil, PageSpeed Insights.

Sin embargo, en el caso de El Comercio me sale que la página de inicio se carga lentamente (“Durante los últimos 30 días, los datos de este campo indican que esta página tiene una velocidad lenta en comparación con otras páginas del informe «Experiencia de Usuario de Chrome». – Google PageSpeed Insights).

Lo interesante es que también los tiempos de carga hasta que las páginas de inicio están interactivas son muy largos. Varias páginas demoran más que 20 segundos, algunas más que 30 segundas hasta que están interactivas.

En el caso de la velocidad para desktop podemos ver que las páginas de inicio se cargan más rápidamente que en móvil. La página de inicio más rápida es (Google PageSpeed Insights) la de El Comercio. En el segundo puesto está Expreso. Revisando los datos de GTmetrix El Telégrafo y Expreso tienen las páginas de inicio más rápidas. 

Velocidad de carga de las páginas de inicio, PageSpeed Insights..
Desktop: Velocidad de carga en segundos de las páginas de inicio, PageSpeed Insights.
(No sé porque, pero se cortó la palabra Teleamazonas).
Velocidad de carga de las páginas de inicio, GTmetrix.
Desktop: Velocidad de carga en segundos de las páginas de inicio, GTmetrix.

En la versión móvil las páginas de los artículos de El Comercio y El Universo son las más rápidas. Sin embargo, demoran más que 7 segundos para cargarse (según PageSpeed Insights, versión móvil).

Velocidad de carga de los artículos en móvil, PageSpeed Insights.
Velocidad de carga en segundos de los artículos en móvil, PageSpeed Insights.

En la versión desktop El Telégrafo y Expreso tienen las páginas de artículos más rápidas (GTmetrix). 

Velocidad de carga de los artículos en móvil, GTmetrix.
Velocidad de carga en segundos de los artículos en desktop, GTmetrix.

Según PageSpeed Insights (para desktop), las páginas de artículos de El Telégrafo y RTS son las más rápidas. En el tercer puesto está El Comercio.

Velocidad de carga de los artículos en móvil, GTmetrix..
Velocidad de carga en segundos de los artículos en desktop, PageSpeed Insights.
(No sé porque, pero se cortó la palabra Teleamazonas)

El Comercio es rápido

Al menos yo estaba sorprendido. Las páginas web de este periódico son muy llenos de artículos relacionados, otras noticias, links a comentarios, publicidad, etc. Además, casi siempre se carga algún pop-up (normalmente de Compraya – ahora con otra publicidad) que me molesta mucho, especialmente en la versión móvil.

Sin embargo, su velocidad de carga no es tan mal con 4,6 segundos (revisando PageSpeed Insights para móvil), 1 segundo (PageSpeed Insights para desktop) y 7,6 segundos (GTmetrix).

Hay sitios más nuevos de otros medios de comunicación. Pero no logran que sus páginas se cargan más rápidamente que las páginas de El Comercio.

¿Por qué muchas páginas se cargan lentamente?

Solicitudes de Teleamazonas.
Solicitudes de Teleamazonas.

Existen varias razones porque las páginas se demoran en carga. Las razones principales son:

  • Páginas pesadas. Muchas de las páginas de inicio pesan más que 3 MB. En la mayoría de los sitios esto es por utilizar imágenes muy grandes y pesadas. Pero También videos y otros archivos pueden ser pesados.
  • Falta de lazy load (carga diferida). Normalmente todos los videos e imágenes de una página se cargan inmediatamente. Con lazy load estos elementos se cargan cuando el usuario hace scroll en una página y llega a una imagen o un video. Cuando en una página web haces scroll rápidamente hacia abajo puedes ver a veces espacios en blanco hasta que se carguen las imágenes.
    Con el uso de lazy load puedes aumentar la velocidad de carga de las páginas web. Pero muchos sitios de los medios de comunicación no utilizan esta carga diferida de las imágenes y videos.
    Algunos utilizan como plataforma el sistema WordPress. En WordPress es muy fácil -a través de un plugin- implementar lazy load. Sin embargo, en los sitios de los medios de comunicación que funcionan con WordPress no se utilizan estos plugins.
  • Publicidad: En todos los sitios de los medios de comunicación aparece publicidad. Muchos utilizan Google Adsense u otros servicios para monetizar sus sitios web.
  • Muchos “requests” (solicitudes): Cada imagen, cada video, cada archivo css o JavaScript es un request, el navegador tiene que solicitarlo del servidor. Muchas solicitudes del mismo servidor hacen que una página web se carga más lentamente. El servidor no puede descargar todos los archivos al mismo tiempo.
    El número de las solicitudes está relacionado con el número de los anuncios. Para los anuncios se debe solicitar datos, archivos JavaScript, etc.
  • CSS y JavaScript: Muchos de los sitios revisados contienen bastantes archivos de css y JavaScript que se cargan primero. Así bloqueen el renderizado del resto del contenido por algunos segundos.
Foto pesada en una página de noticias.
Foto pesada en una página de noticias. 1,8 MB son mucho para una foto.

Otros factores que frenan las páginas son por ejemplo el uso de servicios para compartir contenidos en las redes sociales (por ejemplo, AddThis en el caso de los artículos de El Comercio) o la carga de archivos css que -según PageSpeed Insights- no se utiliza (Ecuavisa).

Solo en el caso de Primicias me salió en PageSpeed Insights que el servidor responde lentamente (el tiempo desde la primera solicitud hasta la primer respuesta del servidor). Al parecer, los otros medios de comunicación utilizan servidores que responden rápidamente o al menos adecuadamente en relación con el contenido que contienen las páginas y la demanda/el tráfico web que reciben los sitios. Sin embargo, como hemos visto, muchos sitios de los medios de comunicación se cargan lentamente. Un servidor más rápido puede servir para que las páginas sean más rápidas.

AMP

AMP (Accelerated Mobile Pages – páginas móviles aceleradas) es una tecnología que permite que páginas web se cargan rápidamente en dispositivos móviles. 

De los 11 sitios revisados solo 4 utilizan AMP para las páginas de las noticias. Los sitios de medios de comunicación que utilizan AMP son:

  • Ecuavisa
  • El Universo
  • Teleamazonas
  • Expreso

Teleamazonas fue el primer medio de comunicación en el Ecuador que en 2016 implementó AMP en sus páginas web.

Tiempo de carga versión AMP - versión no AMP (GTmetrix).
Tiempo de carga en segundosversión AMP – versión no AMP (GTmetrix).
Tiempo de carga versión AMP - versión no AMP (PageSpeed).
Tiempo de carga en segundos versión AMP – versión no AMP (PageSpeed).

Podemos ver que el uso de AMP aumenta la velocidad en que las páginas se cargan. Especialmente con GTmetrix podemos ver grandes diferencias entre AMP y no-AMP. En PageSpeed Insights la diferencia entre AMP y no-AMP en el caso de Expreso no es muy grande.

La ventaja de AMP no solo es la velocidad de carga. Las páginas que utilizan AMP también aparecen por ejemplo como “carrusel de noticias destacadas” en los resultados de búsqueda, entre otros (más información en developers.google.com). 

Entonces a través del uso de AMP tus páginas pueden aparecer en lugares más visibles dentro de los motores de búsqueda y recibir un número más alto de clics.

La desventaja de usar AMP es que casi siempre trae una reducción del código y de la funcionalidad de una página web.

Si revisas una página con y sin AMP puedes ver en GTmetrix la diferencia por ejemplo en el peso y en el número de las solicitudes (Ejemplo: un artículo de Expreso):

Artículo de Expreso, versión no-AMP.
Artículo de Expreso, versión no-AMP. Pesa 1,7 MB y tiene 159 solicitudes.
Artículo de Expreso, versión AMP.
Mismo artículo de Expreso, versión AMP. Pesa 0,588 MB y tiene 31 solicitudes.

Diferencia en el peso (en MB) no-AMP y AMP:

Peso de las páginas: versión AMP - versión no AMP (GTmetrix)
Peso en MB de las páginas: versión AMP – versión no AMP (GTmetrix)

Un ejemplo extremo es Teleamazonas. Las páginas de las noticias en versión AMP solo contienen el título y el texto de la noticia. Falta el header con la navegación, el sidebar, todo lo que viene debajo del artículo (publicidad y artículos relacionados) y el footer. Pero la ventaja es que las páginas AMP de Teleamazonas se cargan muy rápidamente.

Teleamazonas en versión no-Amp y AMP.
Artículo de Teleamazonas en versión no-AMP (izquierda) y AMP (derecha).

Otros medios de comunicación intentan mantener en AMP parte del diseño y de la funcionalidad de la página original. Pero esto significar que las páginas de AMP se cargan más lentamente.

Un ejemplo aquí es Expreso. Sus páginas AMP todavía son más rápidas que las páginas no-AMP. Pero Expreso no logra conseguir una velocidad de carga como la tiene Teleamazonas en sus páginas AMP (según Google PageSpeed Insights – GTmetrix mostró en una primera prueba que las páginas de Expreso son más lentas que las de Teleamazonas, pero en una segunda prueba las páginas de Expreso se cargaron más rápidamente que las de Teleamazonas).

Expreso en versión no-Amp y AMP.
Artículo de Expreso en versión no-AMP (izquierda) y AMP (derecha). Entre las dos versiones hay poca diferencia.

El problema de AMP es que solo funciona si abres los artículos en tu teléfono desde los resultados de Google (o desde plataformas como LinkedIn). Si por ejemplo abres el sitio de Teleamazonas (el home) directamente desde tu teléfono o si buscas por Teleamazonas y entras a la página de inicio no vas a ver las páginas en modo AMP (aquí se podría cambiar la configuración del plugin de WordPress que utiliza Teleamazonas para que siempre se cargue la versión AMP).

Resumen

Las páginas de los sitios web de los medios de comunicación se cargan lentamente. Especialmente se demoran en ser interactivas. Problemas principales son el peso de las páginas (muchas imágenes, archivos de CSS y JavaScript, etc.), la falta de lazy load y mucha publicidad.
Algunos medios de comunicación utilizan AMP para que sus páginas se cargan más rápidamente en dispositivos móviles. Se puede ver que el uso de AMP realmente ayuda a mejorar la velocidad de carga.