Katia De Miguel

Hoy voy a explicar brevemente como diseñar una páginas web con photshop y luego exportarla para su posterior maquetación.

1.- Lo primero que hay que tener en cuenta son las capas, a la hora de realizar el diseño con photshop tenemos que organizar todo en capa, para que posteriormente nos resulte fácil encontrar y exportar los objetos que seleccionemos.

2.- Después de tener diseñado todo con capa bien organizadas, cliqueamos encima de las capas que queremos exportar y le damos:
- Layer – New layer Based slice

3.- Nos saldrá una imagen parecida a está, normalmente está herramienta funciona muy bien a la hora de seleccionar la imagen a cortar, pero en caso que no nos guste la selección, podemos modificar esta con los siguientes pasos.



1.- Pinchamos en la herramienta de slice - selected tool
2.- Promote en el botón del menú de arriba
3.-Desde aquí veremos como nos ha seleccionado el recorte y ya desde aquí podemos modificar la anchura y altura del mismo – Tenemos que tener en cuenta que los recortes han de ser siempre o cuadrados o rectangulares, no podemos realizar una transformación libre.

4.- Una vez tenemos los elementos a exportar seleccionado con al herramienta de corte, le damos a:



1.- File – save for web and devices
2.- Le damos a PNG-24 para tener una resolución óptima en al Web.
3.- y en el apartado de Matte le ponemos none – este punto es importante, ya que por defecto le aplica un borde a todas las imágenes que estemos exportando.
4.- le damos a aceptar – y ya sólo nos falta ponernos a maquetar.


Fecha: 22/03/2011