¿Qué tamaño debe tener una imagen destacada en WordPress?

El número que casi todo el mundo busca es 1200 x 630 píxeles. Es la proporción que usan Facebook, LinkedIn y X para las vistas previas de enlaces (1.91:1), y es la que debe tener una imagen Open Graph. Si estás poniendo una imagen destacada sobre todo para que los enlaces compartidos se vean bien, usa 1200 x 630 y no le des más vueltas.

Pero ese número no es el que tu tema muestra en realidad dentro de la entrada. WordPress casi nunca muestra tu imagen destacada a su tamaño original. El tema solicita un tamaño de imagen registrado concreto, y WordPress sirve el recorte pregenerado que le corresponda. Por eso una imagen que se ve perfecta en Facebook puede verse borrosa, estirada o mal recortada dentro de la plantilla de tu entrada individual. El tamaño “correcto” depende del tema, no de una regla universal.

Por qué el tema manda sobre el número

Cuando subes una imagen, WordPress no guarda un solo archivo. Ejecuta wp_generate_attachment_metadata() y crea una versión para cada tamaño de imagen registrado: los tres por defecto (thumbnail, medium, large), el medium_large del editor de bloques (768px de ancho), más cualquier tamaño que el tema o un plugin hayan registrado con add_image_size().

Un tema que quiere una cabecera panorámica en 16:9 hará algo así en functions.php:

add_theme_support( 'post-thumbnails' );
add_image_size( 'hero-featured', 1200, 675, true );

El cuarto argumento, true, significa recorte forzado (hard crop). WordPress recortará tu imagen a exactamente 1200 x 675, descartando todo lo que no entre en la caja de 16:9. Si tu motivo está cerca de la parte superior o inferior del encuadre, se corta. Con false (u omitido), se escala proporcionalmente y las dimensiones finales pueden diferir de las que pediste.

Luego la plantilla decide qué tamaño extraer:

the_post_thumbnail( 'hero-featured' );

El nombre que se le pase a the_post_thumbnail() es el recorte que se renderiza. Así que el verdadero tamaño de la imagen destacada en tu sitio queda definido en dos sitios que tú no escribiste: la llamada a add_image_size() y la llamada a the_post_thumbnail() del tema. Subir un archivo más grande no cambia ninguna de las dos.

Hay una capa más. WordPress sirve un srcset, así que en pantallas más pequeñas el navegador puede cargar la versión medium o large en lugar del recorte completo. La dimensión que ves en las DevTools muchas veces no es la que subiste.

Cómo arreglarlo, paso a paso

1. Averigua qué pide realmente tu tema. Antes de adivinar, mira todos los tamaños que WordPress genera a partir de tu imagen y cuál es la cabecera recortada. Suelta tu imagen en la herramienta de tamaños de imagen de WordPress: te muestra cada versión que WP crearía, con las dimensiones exactas en píxeles, para que ajustes tu original al objetivo real en vez de al mítico 1200x630.

2. Sube algo lo bastante grande para cubrir el recorte más grande. Si la cabecera del tema es 1200 x 675, sube al menos eso, e idealmente 2x para retina (2400 x 1350). WordPress reduce la escala sin problemas; nunca la aumenta. Un original demasiado pequeño es, con diferencia, la causa más común de una imagen destacada borrosa.

3. Ajusta tu proporción a la del recorte del tema. Si el tema recorta a la fuerza a 16:9, dale 16:9. Compón con el motivo centrado para que un recorte forzado no le corte la cabeza a nadie.

4. Si el tamaño registrado está mal, cámbialo y regenera. Edita los valores de add_image_size() en un tema hijo y luego reconstruye las miniaturas existentes: las nuevas dimensiones solo se aplican a subidas futuras hasta que lo hagas:

wp media regenerate --yes

¿No tienes WP-CLI? El plugin Regenerate Thumbnails hace lo mismo desde el escritorio.

Lo que no debes hacer

No te limites a subir una imagen de 1200x630 dando por hecho que ya está resuelto. Si el tamaño registrado del tema es 16:9, WordPress recorta a la fuerza tu imagen 1.91:1 y pierdes la parte superior e inferior. El número de Open Graph y el número de visualización son dos trabajos distintos.

No desactives los tamaños de imagen de WordPress para “conservar el original”. Hay quien recomienda poner los tamaños intermedios a 0 o desenganchar the_post_thumbnail. Entonces el tema recurre a servir el archivo a tamaño completo, escalado en el navegador: un JPEG de 4000px enviado a un móvil. Eso hunde tu tiempo de carga y tus Core Web Vitals. Las versiones existen por algo.

No confíes en el “tamaño recomendado” de un plugin por encima del tamaño realmente registrado por tu tema. Los plugins de SEO recomiendan 1200x630 para la etiqueta OG, y para esa etiqueta es correcto. No dice nada sobre a qué recorta la plantilla de tu entrada individual.

No te saltes wp media regenerate después de cambiar los tamaños. Editar add_image_size() no hace nada con las imágenes ya subidas. Este es el paso que la gente olvida, para luego concluir que el código no funcionó.

¿Sigues atascado?

Si la imagen sigue mal después de ajustar las dimensiones y regenerar, el problema suele ser el modo de recorte (true frente a false) o un srcset que sirve una versión más pequeña de la que esperas. Suelta el archivo en la herramienta de tamaños de imagen para ver exactamente qué recortes produce tu configuración y compáralos con lo que el navegador está cargando en las DevTools. Haz que esos dos coincidan y se acaban las conjeturas.