Blogs Ya.com: Trucos Blogs.ya.com

Preparar imágenes con Photoshop para usarlas en tu blog

Estoy seguro de que en más de una ocasión has necesitado incluir una imagen en tu blog pero esta era demasiado grande y no encajaba bien en el diseño; o bien, necesitas una imagen de un tamaño determinado que no encuentras por ninguna parte. Pues hoy te vamos a enseñar a preparar una imagen para que la uses en tu blog. ¿Cómo? Muy fácil, usaremos un programa de retoque fotográfico llamado Photoshop*.
*Versión 6.0

El primer paso es escoger la imagen que deseamos utilizar.
Esta va a ser nuestra imagen "base"

Por necesidades de la web, necesitamos una imagen grande de unos 320x150px y cuatro imágenes pequeñas de 50x50px.

Suponiendo que tenemos instalado en nuestro ordenador el Photoshop, vamos y lo abrimos. Si es la primera vez que utilizas el Photoshop puede que te asustes, pero hoy solo vamos a utilizar un par de herramientas.

Como todos programas de Windows en la parte superior tienes una barra de menú. Hoy solo vamos a utilizar Archivo (1), Imagen (2), de la barra de menús, y unas pocas herramientas de la barra de herramientas (3). "Ver ejemplo"

Pues manos a la obra. Vamos a Archivo > Abrir. Buscamos la imagen que queremos utilizar y aceptamos.

En el espacio de trabajo puedes ver la imagen que vas a utilizar. Ahora vamos a ver el tamaño de la imagen. Vete a Imagen (en la barra de menú) y selecciona tamaño de Imagen. Aparece una ventana como esta (4).

Con las propiedades Anchura y Altura podemos hacer una primera aproximación del tamaño de la imagen. Si uniendo las propiedades (anchura-altura) hay una especie de cadena, eso quiere decir que va a mantener una relación optima de calidad y no permitirá desproporcionar la imagen. Fijamos la Anchura de la imagen a 400px (tamaño bastante bueno para trabajar) y automáticamente la altura de pondrá a 271px. Aceptamos y seguimos con más cositas. Siempre cuando te equivoques y quieras rectificar puedes ir a Edición > Deshacer.

Ahora usamos la herramienta Sector de la barra de herramientas (5). Date cuenta que tienes dos modos: Herramienta Sector y Herramienta seleccionar sector (presiona con el ratón un instante sobre el icono de la herramienta para cambiar).

Ya estamos preparados para realizar nuestro primer sector. Con el sector seleccionado dibuja un rectángulo sobre el dibujo (6).

Ahora haz clic con el botón derecho de tu ratón y selecciona Modificar opciones del sector. Aparece la siguiente ventana (7).

Abajo pone Dimensiones del sector y dos opciones An, Al. En ancho (An) ponemos el tamaño deseado, en nuestro ejemplo, la imagen grande del vehículo ha de ser de 320px y el alto (Al) 150px. Aceptamos y vemos como ha cambiado el tamaño de nuestro sector.

Ahora cambiamos a Seleccionar Sector y podemos mover el sector a lo largo y ancho de nuestra imagen. Hazte a la idea de que el sector es una ventana y lo vas a colocar enmarcando lo que tú quieras que el usuario vea de la imagen (8).

Ahora volvemos a la barra de herramientas y escogemos el Marco rectangular de selección (9).

Usamos como regla el borde del sector y seleccionamos el trozo de la imagen. De este modo nos aseguramos que la selección es del tamaño deseado. Ahora copiamos el trozo seleccionado (Edición > Copiar) y vamos a Archivo > Nuevo. Si te das cuenta el tamaño del lienzo nuevo es el tamaño del trozo que acabamos de recortar. Acepta y pega la imagen (Edición > Pegar).

"Ejemplo"

Ya tenemos la primera imagen ajustada a las dimensiones apropiadas. Ahora volvemos a trabajar sobre el primer lienzo, escogemos nuevamente la Herramienta Sector y hacemos un nuevo rectángulo sobre el dibujo. Nuevamente botón derecho y fijamos las Dimensiones de An y Al. En esta ocasión a 50px y 50px. Cambiamos a Seleccionar Sector y repetimos lo de antes. Pinchamos sobre el Marco rectangular y seleccionamos, usando como regla el borde del Sector, un trozo de la imagen. Vamos a Archivo Nuevo y pegamos. Repite esto tantas veces como imágenes necesites.

Ahora hay que guardar las imágenes. Vamos una por una seleccionándolas (simplemente pincha sobre ella) y a pinchamos sobre Archivo > Guardar para la web. Aparece la pantalla (10) elige la pestaña de 4 copias y selecciona la que mejor se adapte.

La primera (arriba - izquierda) es la original. Esta no la elijas. Quédate con cualquiera de las tres restantes que están optimizadas. Presiona Ok, selecciona dónde guardarla y le pones un nombre. Repite esto con el resto de imágenes.

El resultado será algo como esto: