¿Está buscando publicar imágenes escaladas en su sitio de WordPress?
Los principiantes suelen ralentizar sus sitios web subiendo imágenes sin prestar atención a su tamaño. Servir imágenes que tengan las dimensiones correctas mejorará el rendimiento de WordPress sin reducir la calidad.
En este artículo, le mostraremos cómo publicar fácilmente imágenes escaladas en WordPress.
¿Por qué ofrecer imágenes escaladas en WordPress?
En su sitio web de WordPress, necesitará imágenes para las publicaciones de su blog, miniaturas, encabezados de página, imágenes de portada y más.
Dependiendo de su tema, estas imágenes ocuparán una cierta cantidad de píxeles. Por ejemplo, su imagen destacada puede ocupar 680×382 píxeles y una miniatura 100×100 píxeles.
Es importante utilizar imágenes que hayan sido escaladas para que se ajusten a las dimensiones correctas necesarias para su sitio. Por ejemplo, si las imágenes destacadas ocupan 680×382 píxeles, entonces debes guardarlas exactamente en ese tamaño.
De lo contrario, su sitio puede ralentizarse o disminuir la calidad de la experiencia del usuario. Estas son algunas de las razones comunes para esto:
- Tus visitantes tendrán que descargar archivos más grandes de lo necesario, aumentando los tiempos de carga.
- Si utiliza imágenes con menos píxeles que el espacio permitido, se verán borrosas cuando se muestren en un tamaño mayor.
- Su sitio web tendrá que cambiar los tamaños de las imágenes sobre la marcha, lo que significa que tendrá que ejecutar más procesos antes de poder mostrar el contenido a los usuarios.
De todos modos, brindará a sus usuarios una mala experiencia y también puede tener un impacto negativo en el SEO de su imagen.
Es por eso que si prueba el rendimiento de su sitio web utilizando el escaneo GTMetrix, a menudo le recomendará que proporcione imágenes escaladas para acelerar su sitio web.
Dicho esto, echemos un vistazo a cómo publicar fácilmente imágenes escaladas en WordPress. Cubriremos dos métodos:
Método 1: ofrecer imágenes escaladas con un complemento
La forma más sencilla de ofrecer imágenes escaladas es utilizar un complemento que muestre automáticamente las imágenes de su sitio web en el tamaño correcto. Este método es el más sencillo pero no permite tanta flexibilidad como el segundo método.
el libre optimole El complemento es uno de los mejores complementos de compresión de imágenes de WordPress y escalará automáticamente sus imágenes. Sin embargo, si recibe más de 5000 visitantes por mes, necesitará la versión premium.
Primero, necesita instalar y activar el complemento Optimole. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.
Tras la activación, serás llevado automáticamente a la Medios » Optimole página y se le pedirá que se registre para obtener una clave API o que ingrese su clave API existente. Esto es muy facil.
Simplemente asegúrese de que su dirección de correo electrónico sea correcta y luego haga clic en el botón “Crear y conectar su cuenta”. La conexión a Optimole se realizará automáticamente. Ni siquiera necesitarás visitar otro sitio web o pegar la clave manualmente.
Optimole ahora comenzará a optimizar sus imágenes en segundo plano. Elegirá automáticamente el tamaño de imagen correcto para el dispositivo y navegador de cada visitante, y las imágenes se entregarán desde la rápida CDN del servicio en la nube Optimole.
Cuando haga clic en la pestaña Configuración, verá que las imágenes de sus publicaciones y páginas se reemplazarán automáticamente con aquellas optimizadas y escaladas por Optimole.
Esto no se hace sobre la marcha porque se realiza a través de una CDN, lo que significa que su sitio no verá afectado el rendimiento.
Además, el complemento ha habilitado la carga diferida, lo que significa que las imágenes de la página que no están visibles actualmente no se cargarán hasta que sean necesarias. Esta es otra forma eficaz de reducir el tiempo de carga de la página y mejorar el rendimiento del sitio web.
Estas configuraciones funcionarán bien para la mayoría de los sitios web. Sin embargo, puede personalizar aún más Optimole utilizando la configuración del menú “Avanzado” para ver qué funciona mejor para su sitio web.
Si realiza algún cambio en la configuración, no olvide hacer clic en el botón “Guardar cambios” en la parte inferior de la página.
Método 2: publicar imágenes escaladas manualmente
También puedes escalar imágenes sin un complemento. Hay tres formas de hacer esto: puede usar el software de edición de imágenes, la función de edición de imágenes en la Biblioteca multimedia de WordPress o cambiando los valores en la Configuración multimedia de WordPress.
Escalar imágenes con software de edición de imágenes
Puede escalar sus imágenes a las dimensiones correctas antes de cargarlas en su sitio web utilizando un software de edición de fotografías en su computadora, como Adobe Photoshop o Affinity Photo.
El software le permite elegir la cantidad correcta de píxeles para su imagen y guardarla con un tamaño de archivo pequeño y el formato de archivo que prefiera.
Por ejemplo, aquí hay una captura de pantalla que muestra la herramienta de recorte de Affinity Photo.
Además de ajustar el tamaño de la imagen desde el principio, hay otras cosas que puedes hacer antes de subir las imágenes para asegurarte de que no ralenticen tu sitio web.
Para obtener más información, consulte nuestra guía sobre cómo optimizar imágenes para el rendimiento web.
Escalar imágenes en la biblioteca multimedia de WordPress
¿Sabías que puedes realizar una edición básica de imágenes en WordPress? La función ‘editar imagen’ de WordPress le permite recortar, rotar, voltear y escalar imágenes.
Al editar una publicación o página, debe hacer clic en la imagen que desea editar. A continuación, debe hacer clic en el botón “Reemplazar” y luego seleccionar “Abrir biblioteca multimedia” en el menú.
Esto abrirá la biblioteca multimedia de WordPress con la imagen seleccionada.
A la derecha hay un área donde puedes agregar texto alternativo, un título, un título y una descripción para tu imagen. También encontrará un enlace “Editar imagen”.
Simplemente haga clic en ese enlace para ir a la página ‘Editar imagen’.
Aquí encontrará una vista previa de la imagen, botones de edición y varias otras opciones que son útiles al escalar o recortar la imagen.
Para escalar la imagen, simplemente cambie uno de los valores de ‘Nuevas dimensiones’ en Escalar imagen a la derecha.
Por ejemplo, esta imagen tiene una resolución muy grande de 2560×1637 píxeles. Podemos reducirlo a un ancho de 1200 píxeles escribiendo en el primer campo ‘Escalar imagen’.
Todo lo que tiene que cambiar es el Ancho porque el valor de altura de la imagen cambiará automáticamente para mantener la imagen en proporción.
Después de eso, simplemente haga clic en el botón ‘Escala’ para cambiar la resolución de la imagen.
Tenga en cuenta que solo puede reducir la escala de una imagen en WordPress. No puede agrandar las imágenes aumentando las dimensiones de la imagen.
Para obtener instrucciones detalladas, consulte nuestras guías sobre cómo realizar una edición básica de imágenes en WordPress y cómo recortar y editar miniaturas de publicaciones de WordPress.
Ajustar el tamaño de las imágenes en la configuración de medios
Cuando subes imágenes a tu sitio web, WordPress crea automáticamente varias copias en diferentes tamaños. Puede personalizar estos tamaños visitando el Configuración » Medios página en su área de administración de WordPress.
Aquí puede cambiar fácilmente las dimensiones de los tamaños de imagen en miniatura, mediano y grande.
En algunos sitios web, es posible que necesites más tamaños de imagen que solo miniatura, mediano y grande. Puede aprender cómo crear estos tamaños siguiendo nuestra guía sobre cómo crear tamaños de imágenes adicionales en WordPress.
Si cambia los tamaños de imagen predeterminados o crea tamaños de imagen adicionales, solo se verán afectadas las imágenes nuevas. Debe regenerar los tamaños de imagen para las imágenes existentes.
Cuando agregas una imagen a una publicación o página, puedes seleccionar un tamaño de imagen en la configuración del bloque a la izquierda de la página.
Esperamos que este tutorial le haya ayudado a aprender cómo publicar imágenes escaladas en WordPress. Quizás también quieras aprender cómo crear una página de destino o consultar nuestra lista de complementos de redes sociales para WordPress.