Tamaño de imágenes subidas a blogger

Ahora blogger da, para las imágenes subidas, la posibilidad de escoger entre cinco tamaños, así: Una vez elegido el archivo del equipo, y añadida la imagen seleccionada... ...se nos presenta el cuadro con las opciones de diseño: Alineación de la imagen Tamaño de la imagen Nos ocuparemos del tamaño (la alineación es obvia), tomando como ejemplo una imagen cuyas medidas originales son: ancho (width): 387px, y alto (height): 142px. Subida la imagen, en el Editor HTML de la entrada correspondiente se genera un código que, dependiendo del tamaño escogido, será como uno de los siguientes: Para la opción pequeño: <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8vGPD1c0mC_I81QJomijet8xallHooqmldBYu5dXZIqU88psfuyUs_rc50Ey8BQJWzLDwl5wdRHYLpYocy2ycCE8DIab2-04CGD7PJJUWOOyKWcNmUHcup3eShcdLO37VB0o20gQg_HRR/s1600/Blogger.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8vGPD1c0mC_I81QJomijet8xallHooqmldBYu5dXZIqU88psfuyUs_rc50Ey8BQJWzLDwl5wdRHYLpYocy2ycCE8DIab2-04CGD7PJJUWOOyKWcNmUHcup3eShcdLO37VB0o20gQg_HRR/s200/Blogger.png"/></a> Ésta es la imagen: s1600 indica que 1.600 pixeles es la máxima medida con que se muestra la imagen en la versión imagen ancla (abajo se explica), en su dimensión más larga (en este caso es el ancho). Como en este caso la dimensión más larga es de 387 pixeles, así se mostrará la imagen. Ésta no es la imagen que aparece en la entrada. s200 indica que la imagen se muestra hasta con un máximo de 200 pixeles en su dimensión más larga (en este caso es el ancho); la otra dimensión se adapta automáticamente. Es la imagen que aparece en la entrada. Un click sobre la imagen llevará a la imagen ancla. Para la opción Mediano: <a href="http://2.bp.blogspot.com/- Lm-NP6-8RxE/UciR5jN0yBI/AAAAAAAACA0/bHaHLvP_AAE/s1600/Blogger.png" imageanchor="1"> <img border="0" src="http://2.bp.blogspot.com/- Lm-NP6-8RxE/UciR5jN0yBI/AAAAAAAACA0/bHaHLvP_AAE/s320/Blogger.png"/></a> Ésta es la imagen: s1600 indica que 1.600 pixeles es la máxima medida con que se muestra la imagen en la versión imagen ancla (abajo se explica), en su dimensión más larga (en este caso es el ancho). Como en este caso la dimensión más larga es de 387 pixeles, así se mostrará la imagen. Ésta no es la imagen que aparece en la entrada. s320 indica que la imagen se muestra hasta con un máximo de 320 pixeles en su dimensión más larga (en este caso es el ancho); la otra dimensión se adapta automáticamente. Es la imagen que aparece en la entrada. Un click sobre la imagen llevará a la imagen ancla. Para la opción Grande: <a href="http://2.bp.blogspot.com/- 7hwa1TH5epM/UciSJEMzJ7I/AAAAAAAACA8/6jpRa86O5ws/s1600/Blogger.png" imageanchor="1"> <img border="0" src="http://2.bp.blogspot.com/- 7hwa1TH5epM/UciSJEMzJ7I/AAAAAAAACA8/6jpRa86O5ws/s400/Blogger.png"/></a> Ésta es la imagen: s1600 indica que 1.600 pixeles es la máxima medida con que se muestra la imagen en la versión imagen ancla (abajo se explica), en su dimensión más larga (en este caso es el ancho). Como en este caso la dimensión más larga es de 387 pixeles, así se mostrará la imagen. Ésta no es la imagen que aparece en la entrada. s400 indica que la imagen se muestra hasta con un máximo de 400 pixeles en su dimensión más larga (en este caso es el ancho); como la dimensión más larga de la imagen original es de 387 pixeles, así se mostrará la imagen. Es la imagen que aparece en la entrada, y que, en este caso, es igual a la imagen ancla. Un click sobre la imagen llevará a la imagen ancla. Para la opción Extra grande: <a href="http://1.bp.blogspot.com/- 20RCg5bzoJc/UciSYlfXfKI/AAAAAAAACBE/WUMhtviQzCA/s1600/Blogger.png" imageanchor="1"> <img border="0" src="http://1.bp.blogspot.com/- 20RCg5bzoJc/UciSYlfXfKI/AAAAAAAACBE/WUMhtviQzCA/s640/Blogger.png"/></a> s640 indica que la imagen se muestra hasta con un máximo de 640 pixeles en su dimensión más largas (en este caso es el ancho); como la dimensión más larga de la imagen original es de 387 pixeles, así se mostrará la imagen. Es la imagen que aparece en la entrada, y que, en este caso es igual a la imagen ancla. Un click sobre la imagen llevará a la imagen ancla. Para la opción Tamaño original: <a href="http://1.bp.blogspot.com/- g9nVF2pQ6Fs/UciSyvCkUPI/AAAAAAAACBM/d47z3xFZPvY/s1600/Blogger.png" imageanchor="1"> <img border="0" src="http://1.bp.blogspot.com/- g9nVF2pQ6Fs/UciSyvCkUPI/AAAAAAAACBM/d47z3xFZPvY/s1600/Blogger.png"/></a> s1600, en las dos imágenes, indica que ambas se mostrarán en su tamaño original, siempre y cuando no excedan los 1.600 pixeles en su dimensión más larga. En este caso la imagen se mostrará con sus medidas originales: 387px de ancho y 142 pixeles de alto.   Análisis del código Tomamos como referencia el código correspondiente a la opción Mediano, y tenemos en cuenta los mismos parámetros para los otros códigos: El código contiene, a su vez, los códigos de dos imágenes, así: 1. Imagen ancla: <a href="http://2.bp.blogspot.com/- Lm-NP6-8RxE/UciR5jN0yBI/AAAAAAAACA0/bHaHLvP_AAE/s1600/Blogger.png" imageanchor="1"> Es la imagen en su versión original, con un límite de 1.600 pixeles en su dimensión más larga, y punto de destino del link o enlace que es la segunda imagen. Los resaltados en este color, y en éste conforman la URL de la imagen en su versión original, que no es la que aparece en la entrada. s1600 indica la medida en pixeles (1.600px) de la dimensión más larga permitida (ancho o alto, o ambas cuando la imagen es cuadrada) de la imagen, en su versión original. La dimensión más corta se adapta, por defecto, guardando la proporción. Es decir, que si la dimensión más larga sobrepasa los 1.600 pixeles, la imagen quedará anclada con 1.600 pixeles en su dimensión más larga; y si la dimensión más larga es menor que 1.600 pixeles, quedará anclada con sus medidas originales. El resaltado en este color es el nombre o título, y el formato de la imagen. El resaltado en este color indica que la URL de esta sección corresponde a una imagen ancla (las anclas son referencias que se emplean, en una página, con el fin de ser el punto de destino de un link). 2. Imagen link o enlace: <img border="0" src="http://2.bp.blogspot.com/- Lm-NP6-8RxE/UciR5jN0yBI/AAAAAAAACA0/bHaHLvP_AAE/s320/Blogger.png"/></a> Es la imagen que sirve de enlace con la primera. Es decir, que un click sobre esta imagen lleva a la imagen ancla. El resaltado en este color impide que se muestre un borde que algunos navegadores crean, por defecto, en toda imagen que sea un enlace o link (esta imagen lo es). Los resaltados en este color y ésteconforman la URL de la imagen como la presenta Blogger en la entrada. s320 indica que 320 pixeles es el límite que pone Blogger para presentar la imagen en la entrada, en su dimensión más larga (ancho o alto, o ambas cuando la imagen es cuadrada), con la opcion Mediano. La dimensión más corta se adapta, por defecto, guardando la proporción. Es decir, que si la dimensión más larga sobrepasa los 320 pixeles, la imagen quedará en la entrada con 320 pixeles en su dimensión más larga, y si la dimensión más larga es menor que 320 pixeles, quedará con sus medidas originales. El resaltado en este color es el nombre o título, y el formato de la imagen. Como se anotó arriba, un click sobre la imagen link o enlace llevará a la misma imagen (imagen ancla), en su versión original. Si queremos evitar esto reemplazamos, en el código generado al subir la imagen, la Url de la imagen ancla por el signo numeral (#), debiendo quedar así: <a href="#"> <img border="0" src="http://2.bp.blogspot.com/- Lm-NP6-8RxE/UciR5jN0yBI/AAAAAAAACA0/bHaHLvP_AAE/s320/Blogger.png"/></a> ..y entonces un click hecho sobre la imagen llevará al inicio de la entrada que la contiene.   Cambiar el tamaño de las imágenes Para modificar el tamaño de una imagen en una entrada poniéndole un tamaño que no está dentro de las opciones a elegir, tenemos en cuenta la segunda parte del código, la que corresponde a la que hemos denominado Imagen link o enlace. En ella cambiamos (tomando como ejemplo la Opción Mediano) s320 que, como ya vimos indica 320 pixeles en la dimensión más larga de la imagen, por sXXX, reemplazando las equis por el número de pixeles al que queremos aumentar o disminuír el tamaño de la imagen, tomando siempre su dimensión más larga (ya sabemos que la otra se adapta automáticamentela). Esta dimensión debe estar dentro de un rango comprendido entre un pixel y el número de pixeles de la imagen original, en su dimensión más larga. Aunque le pongamos una mayor, la imagen se adaptará a la de la imagen original. Veamos un ejemplo, tomando siempre como referencia la Opción Mediano: En la URL correspondiente a la imagen link cambiamos s320 (320px) por s100 (100px), medida con la que no contamos dentro de las opciones de tamaño, ponemos esa URL en la barra de direcciones de una ventana aparte, y accedemos a la misma, la veremos así, como también se verá en la entrada en la que pngamos la imagen (clik sobre el enlace): https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnyP-_8SOHdW_b-yPy83soC2YcD-zo_dhdd88YYnO7lcgeUkvJw8xnN_Pj3YNvKmfeyxAqD4oHw8q69c1QrPqlanFSqT8-VmJFKmYiDSRI_SI8OHnkFm_BI32O0KIsBK89wON1lOUxPC72/s100/Blogger.png En la pestaña de la ventana en donde aparece la imagen podremos ver (en todos los navegadores, excepto Internet Explorer), las medidas de la imagen: 100 pixeles de ancho, medida que le pusimos en la URL, y 37 pixeles de alto, medida a la que se adaptó automáticamente o por defecto. Twittear