Parece ser que el mayor inconveniente que se planteo por parte de todos nosotors es la maquitacion mediante CSS. A primera vista parece ser muy complicado y, aunque es muy amplio, diseñar con CSS no es imposible si nos subimos las mangas y nos animamos a probar por nuestra cuenta.

Recomendaciones:

• Antes de empezar a diseñar recomiendo tener algunas nociones de XHTML y conocer algunas diferencias con HTML. En W3C hay una lista de preguntas frecuentes sobre HTML y XHTML.

• Si ya conocemos como funciona el CSS y sus ventajas entonces vamos bien encaminados para programar.

• Conocer y repasar selectores, propiedades, valores, etc. de CSS. Guia de referencia rapida de CSS2.
  

• Analizar el codigo xhtml/css de un template (plantilla) diseñado en CSS e intentar reproducirlo. En lo posible empezar con un diseño muy basico.

Explicar como diseñar un sitio en CSS no tiene sentido porque existe una enorme cantidad de tutoriales en internet que explican como hacerlo. Incluso seria hipocrita de mi parte ya que yo tambien estoy aprendiendo... lo que puedo ofrecer es hablar desde mi experiencia y comentarles como me fue.

Un metodo posible:

1. Escribimos el contenido de la web en un documento HTML como si escribieramos en un procesador de texto. No coloquemos ningun estilo aun.
2. Encerramos los encabezados entre las etiquetas de header (<h1>, <h2>, <h3> segun corresponda). No se olviden de cerrar las etiquetas de header.
3. Armamos los contenedores para el contenido utilizando las etiquetas <div>. Vamos anidando todas las div segun su jerarquia. Esto significa que a la parte del contenido que funciona como cabecera de la web, le vamos a colocar una etiqueta <div> al comienzo y cerramos la etiqueta al final. Por ejemplo:
   <div >Esta es la cabecera de la pagina </div>. Hacemos lo mismo con el texto principal, el menu, el pie de pagina, etc.y anidamos las div si es necesario.
   
4. Identificamos cada contenedor con un nombre. Esto se puede hacer utilizando los parametros ID o CLASS dentro de la etiqueta DIV. Por ejemplo: <div class="cabecera">Esta es la cabecera de la pagina</div> .
   
5. Creamos la hoja de estilo y colocamos los parametros para cada contenedor que identificamos. Por ejemplo, si queremos que la cabecera mida 700 pixeles con fondo rojo colocamos lo siguiente: .cabecera {width: 700px; background-color: red;}.
6. Vinculamos la hoja de estilo y aplicamos. Dentro de las etiquetas HEAD de nuestro html establecemos la relacion con el archivo css. Por ejemplo: <link href="estilo.css" rel="stylesheet" type="text/css" />
   

Es una de las formas que probe y funciono. Tambien pueden modificarse etiquetas de html. Obviamente esto es muy basico, solamente para que entendamos como funciona pero no es la unica manera de hacerlo y, por supuesto, esta muy incompleto. Pruebenlo por su cuenta, es simple. De yapa unos links:

Tutoriales
Tutorial para principiantes (LEANLO, OBLIGATORIO)
Manual de CSS (muy completito y facil)
Curso de CSS (breve, conciso pero piola)
Componer un diseño de 3 columnas en XHTML y CSS
Introduction to CSS (manual muy practico en ingles)
Tutoriales de CSS y Javascript de Cristalab

Utiles
Guia de referencia rapida CSS
Generador de CSS
Definicion Wikipedia de CSS
Diferencias xhtml/html (de wikilearning)
Probar fuentes CSS
Trucos y Sugerencias para css
CSS LAB (laboratorio CSS - Excelente)
Sky CSS tools (editor de CSS online)
Simple CSS (otro)
CSS Fly (editor online de Html y Css)
HTML Playground (otro editor online)

Inspiracion/Templates
CSS Mania (diseños muy lindos)
CSS Garden (galeria y sabiduria CSS)
Camaleon CSS (similar a CSS garden)
Open Source Web design (templates open source)
OpenWebDesign
CSS Tinderbox
Css Showcase (galeria de menues en CSS)
30 Templates de 3 columnas
42 Layouts en css


Y no dejen de ver recursos, tutoriales y ejemplos de CSS en este blog.