¿Quién afecta la velocidad de carga de páginas y el consumo de tráfico?

¿Quién afecta la velocidad de carga de las páginas web?

        En el proceso de creación de sitios web, para mejorar la imagen corporativa y facilitar que los usuarios conozcan la empresa y sus productos, a menudo se agregan una gran cantidad de imágenes relacionadas. Si las imágenes no se utilizan correctamente (demasiadas imágenes o imágenes de gran tamaño), consumirán más recursos del sistema al cargar, lo que afectará el tiempo de carga de toda la página. Por lo tanto, optimizar las imágenes es muy importante.

Entonces, ¿cómo optimizar y modificar las imágenes?

1. Controlar el tamaño de las imágenes

(1) Para imágenes locales

    Dado que las imágenes colocadas en la página web se incluyen directamente en el paquete del programa, las imágenes demasiado grandes harán que el paquete sea demasiado voluminoso, aumentando el tiempo de carga. Además, las imágenes demasiado grandes también prolongarán el tiempo de renderizado. Por lo tanto, los creadores deben comprimir el tamaño de las imágenes tanto como sea posible.

Los creadores pueden optimizar y modificar las imágenes de la siguiente manera:

    •Para imágenes que no requieren formato transparente, se recomienda utilizar el formato JPEG en lugar del PNG.

    •Utilice el formato de imagen WebP tanto en PC como en dispositivos móviles. El formato WebP, en condiciones de compresión con pérdida, es difícil de distinguir a simple vista antes y después de la compresión, pero el tamaño se reduce significativamente. (Nota: WebP es un nuevo formato de imagen lanzado por Google en 2010, que supera al formato JPEG actual en compresión. En condiciones de calidad similar, las imágenes WebP son un 40% más pequeñas que las JPEG. El uso de imágenes WebP en sitios web puede mejorar significativamente la velocidad de carga).

(2) Cómo habilitar el formato WebP en el sitio web:

       1) Pasos para habilitar WebP con un clic: http://help.eyingbao.com/products/webp.html

       2) ¿Cómo manejar imágenes individuales que no son claras después de habilitar el formato WebP? En las propiedades del control de imágenes, se puede modificar la calidad de la imagen, pero tenga en cuenta que cuanto mayor sea la calidad, mayor será el tamaño de la imagen y más lenta será la carga del sitio web.

          Los pasos son los siguientes: http://help.eyingbao.com/products/wangzhanshangtupianbuqingxizenmechuli.html    

      Notas importantes:      

      •Asegúrese de que no haya imágenes redundantes o inútiles en la página web.

      •Preste atención a las imágenes que se cargan por defecto pero que posiblemente nunca se renderizarán, como "imágenes de carrusel", "acordeones" y "galerías de imágenes".

      •Para reducir el tiempo de renderizado de imágenes clave, el sistema de Yishengbao utiliza la carga diferida de imágenes menos importantes.

(3) Procesamiento de aceleración de imágenes CDN

        En el sistema de construcción de sitios web de Yishengbao, excepto las imágenes ICON, todas las demás se implementan en CDN. Para estas imágenes en red, no es necesario realizar compresión adicional.

(4) Carga perezosa de imágenes

        El componente image de la plataforma de construcción de sitios web de Yishengbao proporciona tecnología lazy-load, y las imágenes tienen la función de carga perezosa habilitada por defecto:

2. Verificar rápidamente imágenes de gran tamaño en la página web

        Se puede utilizar la herramienta Network del desarrollador para verificar el tiempo de carga y el tamaño de las imágenes. Los pasos específicos son los siguientes:

      (1) Todos los navegadores tienen un modo de depuración para desarrolladores. Tomando Chrome como ejemplo, después de abrir la página, presione Ctrl+Shift+I o haga clic en "Inspeccionar" en el menú contextual para ingresar al modo de desarrollador, luego haga clic en la pestaña Network.

       (2)Haga clic en "Img" y luego en "Size" en la lista para ordenar las imágenes por tamaño. Optimice principalmente las imágenes superiores a 50K utilizando herramientas de procesamiento de imágenes.

3. Optimizar y volver a publicar imágenes

       Subir y publicar las imágenes optimizadas es casi todo el trabajo. También puede habilitar directamente la función WebP en el backend del sitio web.

      Estos son los principales métodos para optimizar las imágenes de las páginas web y mejorar la velocidad de carga. Si su página web también tiene problemas con imágenes demasiado grandes, ¡optimícelas rápidamente según los métodos anteriores!