Tamaños de imágenes WordPress: Cómo funcionan las imágenes en WordPress y mejores prácticas para tu web

Tamaños de imágenes WordPress: Cómo funcionan las imágenes en WordPress y mejores prácticas para tu web

WordPress facilita la adición de imágenes a los posts y páginas de tu blog. Para que estas imágenes se vean bien, deberías elegir el tamaño de imagen adecuado. De eso vamos a hablar hoy, del tamaño de las imágenes WordPress.

Es importante saber cómo funcionan los tamaños de las imágenes en sitios web WordPress y cómo se pueden añadir tamaños de imagen personalizados a tu sitio web. Así podrás utilizar el tipo de archivo de imagen más apropiado, con el tamaño y el lugar adecuados. 

El tamaño adecuado de las imágenes no solo hace que tu sitio web tenga un aspecto más coherente, sino que también hace que las publicaciones del blog sean más fáciles de compartir. Aprende a utilizar los tamaños de imagen adecuados para tu sitio web WordPress en este artículo.

Cubrimos los siguientes temas: 

  • Cómo gestiona WordPress las imágenes que subes
  • Cómo cambiar el tamaño y editar las imágenes en WordPress
  • Los mejores tamaños de imagen para WordPress
  • Mejores prácticas para el tamaño de imágenes WordPress
  • Cómo añadir tamaños de imagen personalizados en WordPress
  • Conclusión sobre el tamaño de las imágenes de WordPress y las mejores prácticas generales

Cómo gestiona WordPress las imágenes que subes

Como ya se ha mencionado, WordPress depende del tamaño de la imagen. Si eliges el tamaño incorrecto, tus imágenes se verán borrosas. Aún peor, si las imágenes de son demasiado grandes, ralentizarán tu sitio web.

Un tamaño incorrecto de tus imágenes también puede estropear el diseño de tus publicaciones del blog y provocar un desplazamiento lateral innecesario. La buena noticia es que WordPress tiene una configuración integrada que permite evitar estos problemas

Tamaños de las imágenes de WordPress

  • Tamaño de la miniatura: 150 x 150 píxeles
  • Tamaño medio: 300 x 300 píxeles 
  • Tamaño máximo: 1024 x 1024 píxeles
  • Tamaño completo: se corresponde con el tamaño original de la imagen cargada por defecto

Cuando subes una imagen a WordPress, se crean por defecto estos cuatro tamaños de imagen diferentes

La razón por la que WordPress crea estos tamaños de imagen es doble. En primer lugar, no tienes que cambiar el tamaño de las imágenes manualmente. En segundo lugar, garantiza la selección del tamaño de imagen adecuado para los distintos lugares de tu sitio web. 

Por ejemplo, WordPress muestra las miniaturas de una lista de entradas del blog en un widget de la barra lateral o del pie de página. Sin embargo, una imagen que vaya a aparecer en el encabezado o en el propio post debe ser más grande. Por lo tanto, WordPress selecciona uno de los tamaños de imagen más grandes para garantizar que la imagen se pueda ver con claridad. 

De este modo, si quieres utilizar la misma imagen en diferentes lugares de tu web, no tienes que perder el tiempo redimensionándola manualmente o recordando qué tamaño de imagen necesitas. Solo tienes que subir una imagen y WordPress se encargará del resto.

Cómo cambiar el tamaño y editar las imágenes en WordPress

Con WordPress, puedes cambiar el tamaño de las imágenes por defecto dentro de WordPress. Solo necesitas unos pocos clics y tendrás los tamaños de las imágenes configurados en un abrir y cerrar de ojos. 

Para cambiar los tamaños de imagen por defecto, dirígete a la opción de ajustes, en el apartado de medios o galería. Como se puede ver en la captura de pantalla, todos los tamaños de imagen por defecto se enumeran allí. Puedes ajustarlos fácilmente introduciendo tus dimensiones preferidas.

Tamaños de imagen estándar en WordPress
Tamaños de imagen estándar en WordPress

Una vez hayas ajustado los tamaños por defecto de las imágenes WordPress a tus dimensiones preferidas, haz clic en Guardar cambios. En el futuro, todas las imágenes que subas serán redimensionadas al nuevo formato. 

Cuándo deberías cambiar los tamaños por defecto de las imágenes WordPress

Hay algunas situaciones en las que puede ser necesario cambiar los tamaños por defecto de las imágenes WordPress. Por ejemplo, si has comprado un theme WordPress que utiliza tamaños de imagen personalizados y quieres asegurarte de que WordPress redimensiona tus imágenes subidas a ese nuevo formato. 

Otro ejemplo son personas creativas que necesitan tamaños de imagen específicos para mostrar su trabajo. También puede ser necesario cambiar los tamaños de imagen por defecto si tienes una tienda online y necesitas tamaños de imagen específicos para las imágenes de tus productos.

Los mejores tamaños de imagen para WordPress

Las imágenes se utilizan en muchos lugares diferentes de tu sitio web. 

Estos son los mejores tamaños de imagen para WordPress según el lugar en el que se utilicen:

  • Las imágenes del blogpost deben ser de 1200 x 630 píxeles.
  • El tamaño de la imagen del encabezado WordPress debe ser de 1048 x 250 píxeles.
  • La imagen destacada debe tener 1200 x 900 píxeles en formato horizontal o 900 x 1200 píxeles en vertical.
  • Las imágenes de fondo deben ser de 1920 x 1080 píxeles.
  • Las imágenes del logotipo deben tener un tamaño de 200 x 100 píxeles.
  • Las imágenes en miniatura deben tener un tamaño de 150 x 150 píxeles.

Mejores prácticas para el tamaño de imágenes WordPress

Además de los tamaños correctos de las imágenes, existen otras prácticas recomendadas para los tamaños de las imágenes WordPress. 

Optimizar el tamaño de los archivos de las imágenes

Las imágenes suelen ser una de las principales causas de los tiempos de carga lentos. Si tus archivos de imagen son demasiado grandes, tu grupo destinatario tiene que esperar mucho tiempo hasta que el navegador los haya descargado y sean visibles. 

Por lo tanto, antes de subir las fotos a tu sitio web, deberías reducir su tamaño de archivo. En general, el tamaño del archivo debe ser de 150 KB o menos cuando se trata de imágenes. Puedes reducir el tamaño del archivo guardando la imagen con una calidad inferior. 

Para las fotos de gran tamaño, como los fondos de pantalla, hay que encontrar un buen equilibrio entre el tamaño del archivo y la calidad. En otras palabras, quieres reducir el tamaño del archivo pero evitar que la imagen se pixele.

Optimizar imágenes WordPress: Los 6 plugins más populares para la compresión de imágenes

También puedes utilizar herramientas de compresión de imágenes. Esto te ayuda a reducir el tamaño del archivo sin comprometer la calidad. Presentamos 5 plugins para optimizar tus imágenes.
TinyPNG, una herramienta de compresión de imágenes
TinyPNG, una herramienta de compresión de imágenes

TinyJPG es una herramienta de compresión de imágenes online que permite reducir considerablemente el tamaño de tus imágenes incluso hasta un 70%, sin comprometer la calidad. 

Puedes comprimir hasta 20 imágenes con un tamaño de hasta 5 MB a la vez de forma gratuita. También puedes inscribirte en el plan Pro de TInyJPG, cuyo precio es de 25 dólares al año por usuario/a. Con el plan Pro, puedes comprimir más de 20 imágenes a la vez y eliminar el límite de tamaño de 5 MB para las imágenes WordPress.  

TinyJPG es una gran solución para las imágenes que quieras subir a tu sitio web, ¿pero qué pasa con las imágenes que ya están en tu sitio web? Aquí es donde entra en juego un plugin como ShortPixel

ShortPixel Image Optimizer para WordPress
ShortPixel Image Optimizer para WordPress

Este plugin te ayudará a comprimir las imágenes que ya has subido a tu sitio web. También procesa y comprime todas las futuras cargas de imágenes. Reduce el tamaño del archivo hasta en un 75 por ciento sin reducir notablemente la calidad. 

Además, puedes utilizar el plugin para convertir todos los formatos de imagen JPG, PNG y GIF en los formatos WebP y AVIF, desarrollados explícitamente para la compresión sin pérdidas y con pérdidas de imágenes en la web y en tu biblioteca multimedia.

ShortPixel es gratuito hasta 100 imágenes/mes. Puedes comprar créditos de imagen adicionales a partir de 4,99 dólares por 7.000 créditos de imagen.

Utiliza el tipo de imagen correcto

WordPress te permite subir imágenes en diferentes formatos. Normalmente, las imágenes se guardan como JPG, PNG o GIF. Sin embargo, cada uno de estos formatos tiene sus propias ventajas e inconvenientes. 

Aquí tienes un resumen de los diferentes tipos de imágenes :

  • JPG (JPEG) son las siglas de Joint Photographic Experts Group. Este tipo de archivo admite 16 millones de colores y suele tener el tamaño de archivo más pequeño para las fotos. Este tipo de archivo es ideal para imágenes de fondo, fotos de productos, imágenes destacadas y, en general, cualquier imagen o foto que desees utilizar en tu sitio web. 
  • PNG son las siglas de Portable Network Graphic. Este formato de imagen admite menos colores que el tipo JPG. Sin embargo, puedes guardar las imágenes con un fondo transparente. Es una buena opción para imágenes de logotipos, patrones de fondo, gráficos decorativos de sitios web, iconos de redes sociales y similares. Las imágenes guardadas como PNG pueden dar lugar a archivos más grandes si la imagen contiene muchos detalles. 
  • GIF son las siglas de Graphics Interchange Format y admite 256 colores y transparencia. Los GIFs también pueden ser animados. Los GIFs pueden ser pequeños, pero también pueden dar lugar a archivos más grandes si contienen animaciones complejas. 

Vigila la resolución de la imagen

Otro aspecto que debes tener en cuenta al optimizar las imágenes para la web es la resolución de la imagen. La resolución de la imagen se mide en puntos por pulgada (DPI) y determina la calidad de la imagen. Cuanto mayor sea el valor de DPI, mayor será la resolución de la imagen. 

Para la web, tu resolución de imagen debe establecerse en 72 DPI, ya que se considera el valor predeterminado. Una resolución más alta resulta en un gran tamaño y contribuye a que tu sitio web se cargue lentamente.

Cómo añadir tamaños de imagen personalizados en WordPress

Puedes añadir tamaños de imagen personalizados editando el archivo functions.php. Digamos que quieres añadir un tamaño de imagen personalizado para tu featured image. 

Para añadirlos a tu theme, solo tienes que hacer lo siguiente:

En tu panel de control WordPress ve a Apariencia > Editor. Abre el archivo functions.php y busca la siguiente línea de código:

add_theme_support( 'post thumbnails' );

Si no lo encuentras ahí, añade esta línea y luego haz clic en el botón de actualización de archivo. A continuación, añade la siguiente línea al archivo functions.php: 

add_image_size( 'imagen destacada del blog', 1280, 630 );

La línea anterior añade el tamaño personalizado a tu tema y especifica la anchura y la altura del nuevo tamaño de la imagen. Actualiza el archivo para guardar los cambios. 

Luego debes actualizar el código en tu theme para mostrar el nuevo tamaño de imagen personalizado que puedes seleccionar al cargar. Esta vez, abre el archivo index.php e inserta la siguiente línea de código: 

the_post_thumbnail( 'imagen destacada del blog' ); 

Image Regenerate & Select Crop Plugin para WordPress
Image Regenerate & Select Crop Plugin para WordPress

A continuación, actualiza el archivo para guardar los cambios. Recuerda que el tamaño de tus imágenes personalizadas se sobrescribirá con cada actualización del theme si utilizas el método manual. 

Por lo tanto, recomendamos que utilices un child theme o que añadas tamaños de imagen personalizados con el plugin Image Regenerate & Select Crop. Con este plugin puedes registrar fácilmente nuevos tamaños de imagen personalizados y regenerar las miniaturas de acuerdo con los nuevos tamaños de imagen. 

Conclusión: Tamaños de imágenes WordPress y buenas prácticas generales

Las imágenes te ayudan a contar tu historia y facilitan que tus lectores se relacionen con tus publicaciones y capten su interés. 

Por lo tanto, es importante que elijas el tamaño adecuado para tu sitio web. Los consejos de este artículo te ayudarán a establecer el tamaño correcto de tus imágenes y a añadir tamaños de imagen personalizados para WordPress. 

Para que los esfuerzos de optimización del tamaño de las imágenes en WordPress den sus frutos, debes asegurar tu sitio web con un hosting fiable. Al fin y al cabo, no sirve de nada acelerar tu web si está vinculada a un hosting de baja calidad. 

Prueba el hosting WordPress con Raidboxes para dar a tu sitio web los rápidos tiempos de carga que merece tu público. Puedes ponerte en contacto con nosotros si quieres saber más sobre las ventajas del hosting WordPress gestionado

Tus dudas sobre el tamaño de las imágenes en WordPress

¿Qué preguntas tienes sobre el tamaño de las imágenes en WordPress? Esperamos tu comentario. ¿Te interesan los temas de actualidad en torno a WordPress y el diseño web? Entonces sigue a Raidboxes en Twitter y Facebook, LinkedIn o a través de nuestra newsletter.

¿Te ha gustado el artículo?

Con tu valoración nos ayudas a mejorar aún más nuestro contenido.

2 Comentarios en "Eltamaño de las imágenes en WordPress: Cómo funcionan las imágenes en WordPress y las mejores prácticas para el sitio web tu "

  1. Ich habe es eben ausprobiert und ein Foto mit 240 dpi und das Gleiche mit 72 dpi exportiert. Die Dateigröße ist dabei die gleiche geblieben. Also macht es keinen Unterschied und spare nichts ein.

  2. Ein Pixel ist ein Pixel. Außer bei Retina-Displays interessiert es auf Websites schlicht absolut gar nicht, was für eine Auflösung die Bilder haben. Die Auflösung ist nur dann interessant, wenn das Bild gedruckt werden sollte. Ich frage mich, wann dieser blödsinnige Mythos endlich stirbt.

Escribe un comentario

Tu dirección de correo electrónico no se publicará. Los campos obligatorios están marcados con *.