Bienvenido! Por favor ingrese o registrese.

Autor Tema: Cómo optimizar la velocidad de su sitio móvil: prueba de problemas  (Leído 80 veces)

Frank Rey

  • Nivel 2
  • **
  • Puntos: 102
  • Mensajes: 414
    • Ver Perfil
La imagen correcta es muy útil en sitios web móviles y receptivos. Pero las imágenes que son demasiado grandes, demasiado numerosas e innecesarias simplemente ralentizan los tiempos de carga de la página y obstaculizan el proceso de los usuarios que leen y hacen lo que deben hacer.

El problema: el tamaño de las páginas web enviadas a los teléfonos móviles se ha cuadruplicado en solo cinco años. La causa principal: imágenes, que representan el 68% del peso total de la página.

Con la velocidad de la página móvil como un factor de ranking confirmado  en la última actualización amigable para dispositivos móviles de Google, y el primer índice móvil de Google, a los desarrolladores y SEO les conviene optimizar la velocidad de su sitio móvil tanto como sea posible. Eso significa descubrir cómo recortar el peso de todas esas imágenes enormes y engorrosas.

En este artículo se explorará ese problema, para tratar de hacer una aproximación de las principales causas y a su vez, proponer algunas pruebas para determinar problemas de velocidad que se presenten en la Web.

Los datos a continuación provienen del httpArchive increíblemente útil , que prueba los 1 millón de sitios más importantes varias veces al mes:

El tamaño promedio de transferencia (es decir, mordidas enviadas de servidor a dispositivo) de una página web es 4.2 veces mayor que hace cinco años, pasando de 521 kilobytes (KB) en diciembre de 2011 a 2197 KB o 2.197 megabytes (MB) en diciembre de 2017. NB : esto mide archivos comprimidos en lugar de archivos originales.

Las imágenes son en un alto porcentaje las responsables de ese crecimiento. El tamaño total de las imágenes enviadas a dispositivos móviles ha aumentado 4.2 veces de 352 KB en 2011 a 1490 KB en 2017.

Las solicitudes de imágenes han aumentado de 38 a 50. Las imágenes JPEG son las más comunes, y representan el 46% de las solicitudes de imágenes.

En comparación, el otro factor que contribuye a la saturación de la página es JavaScript , que aumentó de 98 KB a 381 KB y las solicitudes aumentaron de 8 a 21 solicitudes. Eso es el 17% del tamaño total de la página comparado con el 68% de las imágenes.

El que hay que mirar es el video , que no existía en los sitios web de 2011, pero ahora tiene un promedio de 110 KB o 5% del tamaño total de la página y ocupa un gigantesco 542 KB por solicitud frente a 43 KB para un JPEG.

El descubrimiento más impactante aquí es que el tamaño promedio de una página web móvil, 2197KB (2.2MB) es casi tan grande como la página web promedio de escritorio en 2469 KB (2.5MB) en noviembre de 2016. Solo podemos suponer por qué esto podría ser:

¿Los sitios web de diseño receptivos ... o para ser más precisos , los sitios de diseño con capacidad de respuesta e implementados de forma ineficiente son los culpables (porque el sitio web de diseño verdaderamente receptivo es un sitio reformateado para diferentes dispositivos)?

¿La adopción de técnicas de carga diferida ha alentado a las empresas a ser menos eficientes con el tamaño total de página?

Poniendo las cosas bien

Una nota antes de comenzar:

Las imágenes web / móviles son una ciencia imprecisa. No hay reglas duras y rápidas: los diferentes profesionales y escenarios dictan diferentes cursos de acción.

No existe el mejor formato, tamaño, tipo de contenido, diseño, forma, ubicación o cantidad de imágenes, pero existen mejores prácticas para ayudarlo a tomar esas decisiones.

Las "imágenes" no son solo imágenes o gráficos ilustrativos. También incluyen logotipos e iconos, pero estos no necesariamente tienen que ser imágenes tradicionales, como los JPEG.

Plan de ACCION:

  • Revise su política en imágenes, o cree una, si no tiene una. Emite directrices para todos los creadores de contenido web y para los desarrolladores.

    Audite las imágenes que está utilizando en el sitio. ¿Están agregando o alejando de la experiencia del usuario? ¿Se pueden mejorar, optimizar, reducir de tamaño (en la página), empujar por debajo del pliegue o quitar?

    Pruebe la efectividad de sus imágenes con los usuarios. Haga una investigación / prueba antes de realizar cualquier cambio, realice la prueba mientras realiza los cambios y supervise los resultados después del cambio.

    Descubra cómo equilibrará la velocidad de la página con el atractivo, la calidad, el impacto, la velocidad de la página, la eficiencia y la accesibilidad.

La necesidad de velocidad

Los gráficos son atractivos y permiten a los usuarios comprender rápidamente conceptos sin leer grandes cantidades de texto, sin embargo, también incrementan los tiempos de carga. El uso excesivo de imágenes o el uso de imágenes especialmente grandes ralentizarán las páginas web. Los tiempos lentos de carga molestan tanto a los lectores como a los motores de búsqueda .

La necesidad de gráficos debe equilibrarse con la velocidad de la página. Cuando se utilizan imágenes, deben comprimirse y escalarse para que se carguen más rápido. En los casos en que la compresión y la incrustación no son suficientes, pueden ser necesarias otras técnicas avanzadas.

No existe una regla para las velocidades perfectas que una página debe descargar a un dispositivo móvil, ¿cómo podría ser? Las conexiones móviles varían enormemente. La regla de oro es lo más rápido posible. Compare su desempeño con los competidores y los líderes del sector.

Diversos estudios e informes, consulte WPO Stats  para ver ejemplos, han demostrado que la mejora de la velocidad de la página mejora las conversiones. Por ejemplo, un estudio de FT.com descubrió que reducir la carga de la página en 3 segundos en los dispositivos móviles llevó a una reducción del 9% en los artículos leídos durante el mes.

Google advierte en su herramienta TestMySite que "casi la mitad de los visitantes abandonará un sitio móvil si las páginas no se cargan en 3 segundos". Pero el origen de estas estadísticas no está claro.

Prueba, prueba, prueba

Las pruebas son fundamentales para mejorar el rendimiento y la usabilidad del sitio web.

1. Prueba la rapidez con la descarga de páginas

Pruebe regularmente sus páginas web móviles (todas nuevas y todas las principales). Use diferentes servicios y en diferentes momentos, porque los resultados de las pruebas diferirán ... mucho.

WebPageTest es uno de los mejores, mide la velocidad, el tamaño de la página y muestra qué proporción de los datos y solicitudes pertenecen a las imágenes, JavaScript, etc. Algunos son un poco técnicos, pero la excelente tira de película muestra cómo el sitio carga segundo a segundo. puede ser entendido por todos. WebPageTest solía ofrecer remedios también, pero lamentablemente estos desaparecieron.

Para algo menos técnico, use PageSpeed Insights de Google (también pruebe la versión simplificada: TestMySite - a veces sorprende al ofrecerle diferentes resultados a su hermano). NB Google en realidad no prueba la velocidad de la página, estima la velocidad de la página según los criterios clave, pero es excelente para señalar problemas con la página.

Los principales problemas identificados por Google incluyen problemas con el tamaño de la imagen y los códigos de JavaScript, que sabemos por los datos de httpArchive que son los dos contribuyentes más importantes a la saturación de datos.

httpArchive  es diferente. Prueba las páginas principales de los principales sitios web de 1 millón, a intervalos regulares cada mes. Está basado en WebPageTest. Es brillante para mostrar el desglose de los tipos de contenido, por ejemplo, imágenes y muestra las tendencias históricas. Incluso si no está en el primer millón, puede usarlo para comparar con los grandes: individuos, los mejores 100, los mejores 1000, los mejores 1 millón.

2. Realizar pruebas de usuario

Al igual que con todos los aspectos del desarrollo web, las pruebas de los usuarios son fundamentales para mejorar el rendimiento y la usabilidad del sitio.

Realice encuestas y entrevistas con los usuarios para descubrir cómo usan su sitio y los puntos débiles de la experiencia.

Pruebe y mire a los usuarios mientras interactúan con el sitio web. Utilice el seguimiento de los ojos para ver qué les llama la atención y qué imágenes funcionan.
Use heatmaps y análisis web para rastrear cómo los usuarios interactúan con las páginas web y dónde se ven.

3. Páginas web de prueba A / B con diferentes imágenes, números, ubicación, formatos y tamaños de imágenes

Las pruebas A / B muestran dos versiones diferentes de la página web para diferentes grupos de visitantes. Compare los resultados para ver qué tipos de imágenes funcionan mejor.

Linkback: http://afiliadostop.net/index.php?topic=8949.0
No Tienes Permisos Para Dar Puntos
point 0 Puntos

Este tema no recibió puntos.


Share via facebook Share via twitter

xx
Cómo reducir el impacto de las imágenes en la velocidad de su sitio móvil

Iniciado por Frank Rey

0 Respuestas
54 Vistas
Último mensaje mayo 12, 2018, 08:43:53 am
por Frank Rey
xx
¿Cómo afecta al rendimiento web móvil y UX la velocidad de descarga

Iniciado por Frank Rey

0 Respuestas
107 Vistas
Último mensaje mayo 10, 2018, 05:18:54 am
por Frank Rey
xx
Cómo llevar a cabo una auditoría de SEO móvil en su sitio

Iniciado por Frank Rey

0 Respuestas
153 Vistas
Último mensaje abril 04, 2018, 06:23:03 am
por Frank Rey
xx
¿Qué significa la "Actualización de velocidad" de Google para dispositivos móvil

Iniciado por Frank Rey

0 Respuestas
143 Vistas
Último mensaje abril 02, 2018, 11:52:32 pm
por Frank Rey