Cita:
Iniciado por ciisteado 
Gracias a
Lopezito,
andresdzphp y
Alucine por sus respuestas...
he indagado un poco en la red y me encontré con estas 3 opciones de resolver mi problema, las comparto con todos:
Opción 1 Opción 2 Opción 3 
Por supuesto si alguien tiene o sabe otra forma de resolver el problema, no duden en compartirla,
Saludos a todos!
Ahí husmée tus links, un videotutorial que lo veré mas tarde, el otro muestra como exportar de photoshop las reglas css, que no sabia que podía hacerse jaja ya lo probaré. Y el otro es un software si mal no entiendo que te hace el trabajo, bueno si piensas comprar un software te dejo aqui uno que encontré que parece muy bueno, lo bajé de prueba pero la verdad que me enganché tanto estudiando como programar yo misma (que es lo que te recomiendo, porque a fin de cuentas de cualquier modo es muy útil, sino necesario, entender que sucede en el código de tu web, para solucionar problemas más rapidamente), éste es el software:
http://www.medialab.com/
Mira, yo creo, en mi poco tiempo de estudio, que la clave es hacer la MAyor canitad de cosas con CSS, eso te permite más adelante modificar detalles de todas las páginas de la web mucho más rápidamente y además se carga mucho más rápido ya que utiliza cálculos matemáticos y no la carga de tantas imágenes.
Por ejemplo, si tienes que hacer un botón, lo puedes diseñar en photoshop, guardar su estado normal, hover y presionado y en el css hacer la regla para que cuando el mouse realize esas acciones se carguen esas imágenes individuales.
Formas más simples y con más css de hacer eso: 1-usas sprites css, que es una técnica con la que guardas los estados del botón en le mismo archivo (jpg o png) y en css le dices la parte de ese archivo que debe mostrar cuando el mouse realize sus acciones. Lo positivo de esta técnica es que ni bien se carga la web, se cargan esas imágenes que ya contienen todos los botones. Si utilizas archivos separados para cada estado, cuando poses el mouse sobre el boton, tardrá unos segundos en cargarse la segunda imagen y eso no queda bonito.
2- Suponinedo que tu botón sea una gradiente, en lugar de exportar todo el boton, exportas solo una línea de 1px de el mismo, que contenga esa gradiente, y en css simplemente cargas ese pequeño archivo y le dices que lo repita horizontalmente. Así estás ahorrando muchísimo peso en la carga de archivos.
3- Lo máximo de css que puedes usar: directamente no usas imágenes, sino que creas el fondo del botón indicando su color en css, y puedes agregarle borde. Para recrear gradientes y otros efectos necesitarías usar reglas de CSS3 lo cual ya es discutible, ya se está usando pero no es soportado nativamente por navegadores antiguos.
Bueno, yo creo que entender eso es la base de usar css para diseñar, tienes que tratar de convertir la máxima cantidad de elementos del diseño a css, sin exportar tantas imágenes del diseño original. Justamente eso te enseña el tutorial que te envié, tienen un muy lindo diseño y solamente exporta 3 o 4 pequeñas imágenes y lo demás lo recrea a través de reglas en css.
Espero te sirva mi experiencia, saludos!
Alucine