hmm... dificil de explicar para mi, pero hare el intento.
Ya que tienes tu diseño en PSD, lo que tienes que hacer, es planear como se estructurara. Que partes seran imagenes, y cuales seran codigo. Como los colores de fondo, por ejemplo, o el texto, etc.
Despues, utilizando
lineas guia y
reglas de Photoshop, vas trazando tu esquema guia para poder cortar imagenes.
Cuando tengas esa estructura, utiliza el
Slice Tool, que es una herramienta con un iconito de una navaja o exacto. Con ella, vas trazando los cuadros de las imagenes que necesitaras, apoyandote con tus
lineas guia.
Una vez que tengas cortado todo tu diseño, te vas a
File>Save for Web o
File>Save Optimize as...
Ahi, puedes elegir imagen por imagen, y definirles que tipo seran (Gif, jpg, png, etc), asi como la calidad que tendran acorde a su tipo.
Guardas esas imagenes, y en la ventana que te aparecera para nombrar tus imagenes, en la parte de abajo, te pide elegir si quieres:
A) guardar solo HTML
Te guardara unica y exclusivamente las tablas formadas acorde a los cortes que hiciste con el
Slice Tool
B) guardar solo IMAGENES
Te guardara unica y exclusivamente las imagenes cortadas segun tu uso del
Slice Tool.
C) guardar IMAGENES yHTML
Te guardara tanto las tablas como sus imagenes acomodades segun tu uso del
Slice Tool.
En el folder/carpeta que tu les indicaste para guardar tus imagenes, todas las nombrara igual, pero con el numero de corte (el numerito que aparece en un pequeño cuadro en cada imagen que cortaste) por ejemplo:
pagina_01, pagina_02,.... pagina_n
Estoy en mi trabajo ahora, asi que no puedo dedicarle mas tiempo o hacer un tutorial con imagenes. Pero espero que te ayude en algo esto que te respondo.
Mucha suerte, y espero que otras personas tambien puedan ayudarte y/o complementar lo que publiqué.
