Cómo evitar que las imágenes de fondo se carguen lentamente en mi sitio web

El fondo debe ser un accesorio, no una necesidad. Si el fondo no estuviera allí, no debería afectar negativamente la usabilidad. El texto debe poder leerse antes de cargar el fondo, lo que no es el caso si no hay suficiente contraste para leer el texto.

La imagen de fondo en su sitio, school.png es de 478 KB, lo que llevará un tiempo cargar sin importar qué. Debe intentar optimizar sus imágenes tanto como sea posible. Muchos diseños con fondos grandes no sufrirían más compresión, porque los fondos no deberían necesitar muchos detalles.

No use imágenes de fondo grandes en la versión móvil de su sitio.

Puede anular el estilo de fondo de la versión de escritorio de su sitio con consultas de medios CSS.

cuerpo {

fondo: #FFF url (largeBackground.jpg);

}

@media screen y (max-width: 640px) {

cuerpo {

/ * opción 1: eliminar el fondo por completo * /

fondo: #fff;

/ * opción 2: servir un fondo mucho más pequeño * /

fondo: #FFF url (smallBackground.jpg);

}

}

Sugeriría no usar imágenes de fondo si no es necesario: no usar imágenes de fondo no debería dañar su experiencia de usuario.

Y si necesita usarlo, asegúrese de que el tamaño de las imágenes sea perfecto y ejecútelo a través del optimizador de imagen antes de publicarlo en su sitio web.

Si su sitio web utiliza muchas imágenes que realmente hacen que su sitio web se cargue lentamente, debe intentar usar un CDN, puede contactar a su proveedor de alojamiento para implementar CDN

Aquí hay algunos consejos para hacer que cualquier sitio web de WordPress se cargue rápidamente: 10 maneras de hacer que su sitio web de WordPress sea más rápido

Si debe utilizar archivos de imagen grandes y desea que se sirvan rápidamente, consulte las redes de entrega de contenido. Busqué en Google y encontré esta comparación de MaxCDN, CloudFlare, Amazon CloudFront, Akamai Edge y Fastly.

Puede optimizar las imágenes para uso web al cambiar su tamaño y el tamaño del archivo.

No tendría menos de 1600px de ancho para imágenes de héroes, y deberían tener aproximadamente 200kb. Si su imagen cumple con estos requisitos, se cargará muy rápidamente en su sitio. También puede almacenar imágenes en caché utilizando complementos.

Image Optim: mejor guardar para web

Asegúrese de que todas sus imágenes tengan al menos un tamaño de archivo inferior a 300 kb.

El tamaño de la imagen de fondo de su sitio web es 477 kb.

Lo más simple que puede hacer es convertirlo al formato JPEG (como está actualmente en formato PNG). Después de la conversión, el tamaño de la imagen sería aproximadamente 100 kb –110 kb.

Espero que esto te ayudará.

De lo contrario, cree un archivo .htaccess y agregue compresión Gzip.

Cómo habilitar la compresión y gzip para la velocidad de la página.

Seguramente esto lo hará el trabajo.

Use varias llamadas para cargar otros activos mientras se carga la imagen, pero priorice la llamada de la imagen