Jetpack Boost: Guía de rendimiento de imágenes
Asegúrate de que las imágenes utilizadas en las páginas y entradas de tu sitio tengan el tamaño adecuado con Jetpack Boost y su Guía de rendimiento de imágenes.
Usa la Guía de rendimiento de imágenes
La Guía de rendimiento de imágenes calculará las dimensiones recomendadas para las imágenes de tu sitio. Al cambiar el tamaño de tus imágenes a estas dimensiones, puedes reducir el tamaño de los archivos y, por tanto, los tiempos de carga de las páginas de tu sitio. Nuestra Guía de rendimiento de imágenes ofrece buenas prácticas, consejos útiles y pasos prácticos para ayudarte a sacar el máximo partido de tus imágenes.
- En el panel de administración de WordPress, ve a Jetpack → Boost, desplázate hacia abajo por la página y activa la función Guía de imágenes.
- Comprueba las imágenes de tu sitio. Mientras tengas la sesión iniciada, visita tu sitio y verás una burbuja con un número sobre cada imagen. Al pasar el cursor por encima de la burbuja, se mostrará una tarjeta con los detalles de la imagen, como se indica a continuación:
- El nombre de la imagen: si haces clic en él, la imagen se abrirá en una pestaña nueva.
- Dimensiones del archivo de imagen: muestra el tamaño real de la imagen.
- Dimensiones previstas: es el tamaño ideal recomendado de la imagen para que se cargue en la página lo más rápido posible.
- Tamaño en pantalla: muestra el tamaño de la imagen cuando se muestra en pantalla al visitar la página.
- Tamaño de la imagen: muestra el tamaño real del archivo de imagen.
- Ahorro potencial: muestra cuánto se podría reducir el tamaño del archivo al cambiar el tamaño de la imagen para que coincida exactamente con las dimensiones previstas.
Prueba la Guía de rendimiento de imágenes con distintos dispositivos y ajustes
La Guía de rendimiento de imágenes te muestra información sobre tus imágenes tal como aparecen en el dispositivo actual. Te recomendamos probar tu sitio desde varios tipos de dispositivos para asegurarte de que se sirven de forma eficiente, independientemente de cómo accedan los usuarios a tu sitio.
Los distintos dispositivos tienen diferentes densidades de píxeles. La densidad de píxeles es una medida del número de píxeles que aparecen en una determinada superficie de la pantalla. Puede afectar al número de píxeles utilizados en la pantalla para representar una imagen con un tamaño concreto.
Como la Guía de rendimiento de imágenes te muestra hasta qué punto tus imágenes se adaptan al dispositivo actual, merece la pena probarla en varios dispositivos, como ordenadores y teléfonos, para obtener una visión más completa del grado de optimización de tus imágenes en distintas pantallas.
Ampliar o reducir el zoom de tu página web también puede afectar a la densidad de píxeles de tu navegador, lo que a su vez afecta a los resultados de la Guía de rendimiento de imágenes. Te recomendamos utilizar la función con el nivel de zoom estándar de tu navegador.
Utilizamos pequeños indicadores para mostrar información relevante sin resultar intrusivos. En las imágenes más pequeñas, la burbuja superpuesta aparecerá en su lugar como un pequeño punto.
Pausar la Guía de imágenes
Una vez activada la guía de imágenes, puedes establecer la función, según sea necesario, como Activa o En pausa desde la barra de administración de WordPress haciendo clic en Guía de imágenes.
La Guía de imágenes de Boost no funciona con constructores de páginas
Algunos constructores de páginas utilizan iframes para representar el contenido, lo que hace que la Guía de imágenes muestre los detalles en el área de administración. Para ofrecer una experiencia más ligera, desactivamos la Guía de imágenes cuando se utilizan constructores de páginas.
Cómo optimizar las imágenes de tu sitio
Al optimizar el tamaño de tus imágenes, puedes mejorar el rendimiento general de tu sitio, lo que puede ayudar a que sus páginas se carguen de forma más eficiente.
Aunque Jetpack Boost no puede optimizar las imágenes alojadas en tu propio servidor, puedes activar la CDN de imágenes de Jetpack en Jetpack → Boost para servir en su lugar imágenes optimizadas desde los servidores de Jetpack. Para obtener más información sobre la CDN de imágenes de CDN, consulta nuestra guía de Site Accelerator. Para tener un control más preciso sobre la calidad de las imágenes y disfrutar de una optimización de imágenes mejorada, considera actualizar a Jetpack Boost o suscribirte a Jetpack Complete.
A continuación encontrarás varias opciones para optimizar las imágenes de tu sitio.
Antes de subirlas a la biblioteca de medios
Hay varias formas de optimizar tus imágenes antes de subirlas a la biblioteca de medios:
- Cambiar el tamaño: asegúrate de que el tamaño de la imagen que subas sea suficiente para el uso que le vayas a dar. Por ejemplo, si vas a utilizar una imagen con un tamaño máximo de 800 px por 800 px, súbela con ese tamaño.
- Tipo de archivo: Esto depende principalmente de la finalidad de la imagen:
- JPG: Si quieres una imagen que se cargue rápidamente, que no tenga un fondo transparente y que no necesite mucho nivel de detalle, se recomienda utilizar JPG. Es una buena opción para fotografías que se vayan a utilizar en una galería u otras aplicaciones en las que no sea necesaria una calidad de imagen muy alta.
- PNG: Si quieres una imagen con fondo transparente y de muy alta calidad, se recomienda utilizar PNG. Es una buena opción para logotipos u otras imágenes que el usuario pueda observar con mucho detalle, como las imágenes de productos.
Activa el Acelerador del sitio de Jetpack
El plugin principal de Jetpack incluye nuestro Acelerador del sitio; un servicio gratuito que optimiza tus imágenes y las sirve desde una red global de servidores (a menudo denominada la CDN o red de distribución de contenidos), lo que permite que las imágenes se carguen desde servidores más cercanos a los usuarios que acceden a ellas cuando navegan por tu sitio. El Acelerador del sitio también cambia automáticamente el tamaño de tus imágenes para adaptarlas en muchas situaciones.
Te recomendamos utilizar el Acelerador del sitio para mejorar el rendimiento de tus imágenes, especialmente cuando la Guía de imágenes indique que tienen un tamaño excesivo.
Cambia el tamaño de las imágenes desde la biblioteca de medios
Puedes cambiar el tamaño de las imágenes directamente en la biblioteca de medios. Editar las imágenes y cambiar su tamaño al adecuado en la biblioteca de medios es una operación no destructiva. En otras palabras, crea una nueva versión de la imagen con el tamaño que especifiques y deja la imagen original sin cambios.
Información sobre privacidad
La Guía de rendimiento de imágenes está desactivada de forma predeterminada. Puedes activarla desde el panel de administración de WordPress → Jetpack → Boost.
| Datos utilizados | |
|---|---|
| Propietarios y usuarios del sitio Esta función examina las imágenes utilizadas en tu sitio y cómo y dónde se representan. | Visitantes del sitio Ninguno. |
| Actividad registrada | |
| Propietarios/usuarios del sitio Registramos estadísticas sobre las imágenes demasiado grandes identificadas por la Guía de imágenes para ayudarnos a mejorar el servicio y orientar eficazmente las mejoras. En concreto, registramos el tamaño de las imágenes demasiado grandes y su ubicación aproximada dentro de la página (por ejemplo, dentro del contenido de una entrada o en los archivos del tema) | Visitantes del sitio Ninguno. |
| Datos sincronizados (Leer más) | |
| Propietarios/usuarios del sitio Ninguno. | Visitantes del sitio Ninguno. |
