Diseño web tutorial - forma de trabajo

[marcplazas]

Hola a todos. Soy diseñador gráfico, pero la verdad es que nunca me he dedicado a diseño web, por lo que tengo algunas dudas.

Debo diseñar la página web de un comercio, con su un apartado para la compra de unos productos. Para ello había pensado utilizar un estilo bastante moderno en el que existieran algunos detalles que dieran a la página estilo. Uno de los ejemplos es el de esta página en el que existen diferentes "capas":

http://www.goosebumpspickles.com/katki

Yo debo dedicarme sólo al apartado del diseño y luego un programador se dedicará a la parte de programación. Mi pregunta quizás es un poco tonta pero, ¿cómo debería trabajar, creando los diferentes elementos por separado (digamos dependiendo de las capas) y pasándole al programador luego estos elementos con las diferentes especificaciones y efectos? Si fuera así, ¿debería crearlos con photoshop y guardarlo en algún formato en concreto?

Sé que son preguntas muy básicas, pero ya comento que me gustaría aprender a trabajar de forma adecuada en este tema.

Muchas gracias a todos de antemano.

P.D: Si existiera algún tutorial también sería de gran ayuda.

[Rafael]

Lo primero ten mucha comunicación con él.

Define si van a partir de cero o van a usar un prefabricado. Este prefabricado puede ser desde wordpress, prestashop o cosas así, o un framework como bootstrap, y cada uno tendrá ciertos requerimientos.

Lo que hagas en Photoshop déjalo como objetos inteligentes siempre que puedas, ya que vas a tener que cambiar tamaños en el camino.

Deja las capas por separado de todos los elementos, botones por un lado, encabezados por otro. Al hacer una página web el fondo es el fondo y lo de arriba es lo de arriba. A lo largo del proceso él te pedirá el archivo del fondo, y no todo revuelto. Eso también para los fondos de los botones y eso.

Piensa en pixeles, NO en dpi ni pulgadas ni centímetros. Seguro alguien te va a decir que lo hagas a 72dpi. Eso no sirve, piensa en pixeles y ya.