Guía para principiantes de formatos de imagen de WordPress (+ mejores prácticas)

¿Quieres saber más sobre los formatos de imagen de WordPress?

A menudo, los principiantes nos preguntan qué tamaños de imagen usar en su sitio de WordPress y cómo WordPress maneja las imágenes en diferentes áreas.

En esta guía para principiantes, explicaremos los formatos de imagen comunes de WordPress y compartiremos las mejores prácticas para saber qué formatos usar en su sitio web.

¿Qué es el tamaño de una imagen?

El tamaño de la imagen generalmente se refiere al ancho y la altura de una imagen, medidos en píxeles. Por ejemplo, 1600×900 píxeles significa una imagen de 1600 píxeles de ancho y 900 píxeles de alto.

Estas medidas también se conocen como dimensiones de la imagen.

Básicamente, un tamaño de imagen más grande tendrá más píxeles, lo que conducirá a un tamaño de archivo de imagen más grande.

El tamaño del archivo de imagen es el espacio que ocupa un archivo de imagen en una computadora y se mide en bytes. Por ejemplo, 100 KB (kilobytes).

Si una imagen tiene un tamaño de archivo más grande, los usuarios tardarán más en descargarla y afectará la velocidad y el rendimiento de su sitio web. Por eso es importante mantener el tamaño del archivo de imagen lo más pequeño posible, manteniendo la imagen en el tamaño adecuado.

Lo que nos lleva a los formatos de archivo de imagen.

Los formatos de archivo de imagen son las tecnologías de compresión para almacenar sus archivos de imagen. Los más utilizados en la web son JPEG y PNG.

Las imágenes, como las fotos que contienen más colores, se pueden comprimir mejor utilizando el formato de archivo JPEG.

Por otro lado, las imágenes como las ilustraciones con menos detalles de color pueden usar PNG para obtener los mejores resultados.

Para obtener más información sobre los formatos de archivo de imagen, consulte nuestro artículo sobre la optimización de imágenes en WordPress.

Dicho esto, echemos un vistazo a qué formatos de imagen usar en WordPress para diferentes partes de su sitio web.

¿Qué tamaño deben tener mis imágenes para mi sitio de WordPress?

Para un sitio web promedio de WordPress, utilizará imágenes en diferentes partes de su sitio web. Necesitará imágenes para las publicaciones de su blog, miniaturas, encabezados de página, imágenes de portada y más.

WordPress maneja automáticamente algunos de los tamaños de archivo de imagen de forma predeterminada. Cada vez que carga una imagen, WordPress crea automáticamente varias copias de la misma en diferentes tamaños.

Puede ver e incluso ajustar los tamaños de imagen predeterminados de WordPress yendo a Ajustes » Medios página en el área de administración de WordPress.

Verá tres tamaños para Mediano, Miniatura y Grande.

Sin embargo, su tema de WordPress puede crear sus propios formatos de imagen adicionales y usarlos para diferentes partes de su sitio.

Estos formatos no son visibles en la pantalla Multimedia y la única forma de ver esos formatos adicionales es yendo al Administrador de archivos en su cuenta de alojamiento de WordPress.

Luego navegue a la carpeta /wp-content/uploads/ y seleccione cualquier carpeta de año allí para buscar. Esto lo ayudará a ver todos los diferentes tamaños de imagen que genera su sitio de WordPress.

Dicho esto, echemos un vistazo a las diferentes áreas de su sitio web y qué tamaños de imagen usar en esas áreas.

Qué formatos de imagen usar en las publicaciones del blog

Debe elegir el tamaño de la imagen para las publicaciones de su blog en función de su tema de WordPress.

Por ejemplo, algunos temas de WordPress tienen un diseño de una sola columna que le permite usar imágenes más anchas.

Por otro lado, algunos temas de WordPress usan diseños de varias columnas (contenido + barra lateral), lo que significa que debe ajustar el ancho de la imagen en consecuencia.

Para la mayoría de los blogs, puede utilizar los siguientes formatos de imagen:

• Diseño de una sola columna: 1200 × 675
• Diseño de dos columnas: 680 × 382

Ahora puede notar que muchos sitios web populares de WordPress usan el mismo ancho de imagen para todas sus imágenes en un artículo. Sin embargo, esta no es una regla estricta.

Por ejemplo, si necesita agregar el bloque «Medios y texto», puede ajustar el tamaño de la imagen en consecuencia. En el siguiente ejemplo, usaremos una imagen en formato vertical junto a un texto.

Asimismo, es posible que desee utilizar imágenes cuadradas para algunas situaciones.

Por ejemplo, aquí hay un ejemplo de imágenes cuadradas utilizadas en un diseño de varias columnas.

Cuando utilice imágenes cuadradas, solo asegúrese de que las dimensiones de la imagen sean del mismo ancho y alto, como 300 x 300 píxeles.

Qué tamaños de imagen usar para las imágenes destacadas

Las imágenes destacadas, también conocidas como miniaturas de publicaciones, son una característica del tema de WordPress. Eso significa que su tema determina el tamaño de las imágenes que se deben mostrar.

Por ejemplo, algunos temas de WordPress pueden usar la relación de aspecto predeterminada de 16: 9 para los tamaños de imagen destacados (por ejemplo, 680 × 382 píxeles).

Algunos temas de WordPress también pueden usar la imagen destacada como un encabezado más grande. Para hacer eso, es posible que necesiten imágenes más grandes (como 1200×675).

Las imágenes destacadas son importantes porque su tema de WordPress puede usarlas en diferentes partes de su sitio web. A menudo son lo primero que ven sus visitantes, por lo que desea causar una buena primera impresión.

Recomendamos usar imágenes más grandes para que aún se vean bien, ya sea que se cambien de tamaño o se usen en modos más amplios.

Del mismo modo, si su tema de WordPress usa imágenes cuadradas para las imágenes destacadas, le recomendamos que use imágenes que tengan al menos 600 × 600 píxeles.

• Para temas que usan imágenes destacadas rectangulares: 1200 × 687 píxeles
• Para temas que usan imágenes destacadas cuadradas: 600 × 600 píxeles

Su tema de WordPress generará tamaños de imagen recomendados adicionales para usar en diferentes áreas, como páginas de inicio, páginas de blog o páginas de archivo.

Qué formatos de imagen usar para las redes sociales

Ahora, si su tema de WordPress usa imágenes destacadas con una relación de aspecto de 16: 9, también puede usarlas como imágenes de redes sociales para Twitter y Facebook.

Sin embargo, debe decirles explícitamente a esas plataformas qué imagen desea mostrar cuando alguien comparte un artículo de su sitio web.

Para ello, tienes la SEO todo en uno Complemento para WordPress. Es el mejor complemento SEO de WordPress en el mercado utilizado por más de 3 millones de sitios web. Le ayuda a optimizar su sitio web para motores de búsqueda y plataformas de redes sociales.

Observación: También hay un número limitado versión gratuita de All in One SEO que puedes probar.

Primero debe instalar y activar el complemento. Para obtener más información, consulte nuestra guía paso a paso para instalar un complemento de WordPress.

Después de la activación, el complemento iniciará el asistente de instalación. Siga las instrucciones en pantalla para completar el asistente. También puede consultar nuestra guía sobre cómo configurar All in One SEO para obtener instrucciones paso a paso.

Después de eso debes visitar Todo en uno SEO » Redes Sociales y ve a la pestaña de Facebook. Aquí puede configurar ‘Imagen destacada’ como su fuente de imagen Open Graph predeterminada.

Luego puede cambiar a la pestaña de Twitter y hacer lo mismo.

No olvide hacer clic en el botón Guardar cambios para guardar su configuración.

Si su tema de WordPress ha utilizado imágenes en un formato diferente, es posible que Facebook y Twitter no puedan mostrar estas imágenes correctamente.

En ese caso, puede proporcionar a las plataformas de redes sociales una imagen personalizada.

Cree fácilmente una imagen con una relación de aspecto de 16:9 (1200×675 píxeles o 680×382 píxeles). Luego edite la publicación o la página y desplácese hacia abajo hasta la sección Configuración de AIOSEO debajo del editor.

Desde aquí, debe cambiar a la pestaña Social y desplazarse hacia abajo hasta la sección Fuente de la imagen. Seleccione Imagen personalizada en el menú desplegable, luego cargue su imagen de Facebook.

También debe repetir el proceso en la pestaña de Twitter.

Debes hacer esto para todos los artículos que publiques para asegurarte de que las redes sociales usen la imagen que quieres que usen.

Para obtener más tamaños de imágenes de redes sociales, consulte nuestra hoja de trucos de redes sociales de WordPress para principiantes.

Qué tamaño de imagen usar para el logotipo del sitio web en WordPress

Muchos temas de WordPress le permitirán saber qué tamaño de imagen usar para el logotipo de su sitio web.

Por ejemplo, nuestro tema de demostración muestra este mensaje cuando intentamos cargar un logotipo.

Sin embargo, si está utilizando un tema de WordPress más nuevo con la funcionalidad completa de edición del sitio, es posible que no obtenga una recomendación de tamaño de imagen de logotipo.

En ese caso, te recomendamos subir diferentes estilos y tallas para ver cuál se adapta mejor a tu marca. Un tamaño de imagen de logotipo de 300×200 píxeles puede ser un buen punto de partida.

Edición de imágenes para su sitio web de WordPress

La mayoría de los usuarios de WordPress no son diseñadores gráficos de profesión. Sin embargo, debe usar un software de edición de imágenes para crear formatos de imagen para su sitio web de WordPress.

El propio WordPress viene con algunas herramientas básicas de edición de imágenes. Para usarlos, sólo tienes que ir a la Mediateca página y haga clic en una imagen.

Esto abrirá la imagen en una ventana emergente donde verá un botón para editar la imagen.

Esto abre las opciones de edición.

Las herramientas incluyen cambiar el tamaño, recortar, rotar y voltear imágenes.

Esta edición básica de imágenes es útil cuando necesita corregir rápidamente una imagen. Sin embargo, no es la mejor forma de editar tus imágenes del día a día.

Afortunadamente, existen varias opciones gratuitas y económicas que puede utilizar.

• Canva: software gratuito de edición de imágenes basado en la web. También incluye plantillas listas para usar para gráficos de sitios web, logotipos, imágenes de redes sociales y más.
• pixlr – Un software gratuito de edición de imágenes basado en la web. Se puede usar para cambiar fácilmente el tamaño de las imágenes para las publicaciones de su blog.
• cañutillo – Software de edición de imágenes gratuito y de código abierto. Funciona como una aplicación de escritorio nativa en Windows, Mac y Linux. Se puede usar para cambiar el tamaño de las imágenes, agregar capas de texto, editar fotos y más.

Esperamos que este artículo le haya ayudado a aprender más sobre los tamaños de imagen de WordPress y qué tamaños de imagen puede usar en su sitio web. También puede consultar nuestra guía para elegir el mejor creador de sitios web o nuestra selección experta de los mejores complementos de WordPress para sitios de pequeñas empresas.

Si te ha gustado este artículo, suscríbete a nuestro Canal de Youtube para tutoriales en vídeo de WordPress. También puedes encontrarnos en Gorjeo y Facebook†

La publicación Guía para principiantes sobre los tamaños de imagen de WordPress (+ Mejores prácticas) apareció primero en AprenderWP.