¿Cómo adapta WordPress las imágenes a su plantilla?

Post on 13-Jun-2015

324 views 3 download

description

¿Qué hace un CMS si inserto una foto vertical en un marco horizontal? Te mostramos cómo WordPress edita las imágenes al adaptarlas a su plantilla.

Transcript of ¿Cómo adapta WordPress las imágenes a su plantilla?

¿Cómo WordPress corta las imágenes para su plantilla?

1º CASO Imagen más pequeña y distintas proporciones (4:3 a 1:1)

1000 x 665

Tenemos una imagen de 1000 por 665 pixeles (4:3)

500 x 500

Para transformar a 500 por 500 pixeles (1:1)

WordPress buscará el centro y medirá desde ahí

500 x 500

1000 x 665

500 x 500

1000 x 665

WordPress buscará el centro y medirá desde ahí

500 x 500

1000 x 665

WordPress se ajsutará siempre al eje más pequeño, en este caso el alto

y redimensionará la imagen

500 x 500

1000 x 665

ajustándose al tamaño menor del original, en este caso el alto de la imagen

Realizada la redimensión

500 x 500

1000 x 665

Cortará lo que sobra a los costados de forma equitativa

Es decir, hay una porción de la imagen que se perderá siempre

500 x 500

1000 x 665

de forma simétrica por cada lado, porque calcula desde el centro

500 x 500

1000 x 665500 x 500

Para que no queden dudas, WordPress no ajusta el ancho

500 x 500

1000 x 665

porque el alto de la imagen quedaría más pequeño de lo necesario y no haría ningún corte

2º CASO Imagen tamaño similar (alto) y distintas proporciones (4:3 a 1:1)

Igual que en el ejemplo anterior1000 x 665

665 x 665

WordPress calcula el centro y medirá desde ahí

buscando la primera coincidencia con algún lado, en este caso es el alto

665 x 665

1000 x 665

y en este caso se perderá parte de la imagen a los costados de forma equitativa

3º CASO Imagen horizontal a vertical o viceversa, con mismo tamaño (4:3 a 3:4)

Obviamente sobra ancho

y evidentemente falta alto

WordPress no tiene problema en cortar lo que sobra

Pero es imposible agregar lo que falta arriba y abajo

Si la opción es hacer más pequeña la imagen

Se puede ajustar al ancho, pero no al alto

Pero esto WordPress no lo hará.

WordPress tampoco cambiará la proporción de la imagen, nunca.

Eso causaría que la imagen se distorsiona

En una foto tipo retrato, sobra alto

pero falta ancho

Nuevamente, WordPress puede cortar lo que sobra

pero no agregar lo que falta. Simple, no está en la foto…

Si se achicara la imagen

Sería pero, pero algo que WordPress no hace.

Y como ya señalamos

WordPress no estirará la imagen para cambiar la proporción, porque la distorsiona.

4º CASO ¿Se puede agrandar una foto y cambiar de proporción?

Tenemos una imagen 1:1

y queremos llenar un espacio mayor cambiando la proporción

400px

400px

¿De dónde sacamos más pixeles?

Por ejemplo en una proporción 4:3

400px

600px

100px 100px

400px

WordPress nunca creará la versión de tamaño mayor

Lo mismo si está en proporción 3:4

400px

600px

100px

100px

400px

5º CASO ¿Se puede achicar una foto y cambiar de proporción?

Si tenemos una imagen 1:1

para un espacio menor cambiando la proporción a horizontal

600px

600px

En este caso no se puede redimensionar el ancho

En ambos casos mide 600px, entonces sólo se realiza un crop al alto600px

600px

400px

600px

Finalmente el ancho se mantiene

Se corta el alto, el cálculo se hace desde el medio. Se pierde imagen arriba y abajo

Si tenemos una imagen 1:1

para un espacio menor cambiando la proporción a vertical

600px

600px

Si tenemos una imagen 1:1

para un espacio menor cambiando la proporción

600px

600px

600px

400px

Si tenemos una imagen 1:1

para un espacio menor cambiando la proporción

6º CASO ¿Y si tengo una foto vertical muy grande, se puede achicar y poner en vertical?

1000 x 665

El principio es el mismo que en el primer caso

300 x 400

Wordpress buscará el centro y dimensionará desde ahí

pero también cortará lo que sobre… SIEMPRE

1000 x 665

300 x 400

Wordpress buscará el centro y dimensionará desde ahí

pero también cortará lo que sobre… SIEMPRE

1000 x 665

300 x 400

Wordpress buscará el centro y dimensionará desde ahí

pero también cortará lo que sobre… SIEMPRE

1000 x 665

600 x 400

300 x 400

Wordpress buscará el centro y dimensionará desde ahí

600 x 400

pero también cortará lo que sobre… SIEMPRE

1000 x 665

300 x 400

Wordpress buscará el centro y dimensionará desde ahí

pero también cortará lo que sobre… SIEMPRE

1000 x 665

WordPress nunca agrandará una imagen porque se pixelará…

50px

50px 525px

525px

La imagen original será menor que el tamaño requerido