Voy primero con el index de
Pao. El método es el mismo que hemos seguido en alguna otra ocasión via mp con el objetivo de mejorar o corregir el código. No pretendo ser exhaustivo, pero sí que sea de utilidad práctica para la autora. Y supongo que el castigo a mi osadía vendrá en los sucesivos mp que esto generará con Pao
Antes de nada más, mi enhorabuena a Pao por lo conseguido a nivel de código. Hace menos de 5 meses no había escrito ni una sóla línea de html o css. Y hoy su trabajo nos deja con la boca abierta.
Esta premisa no es para Pao, sino para quienes lean este comentario sin conocernos lo suficiente.
Pero vayamos al grano:
Comienzas definiendo en el body el tamaño del texto en px, y sigues usando esa medida para más textos. Posiblemente te marcará fallo en hera.
En algunos casos defines fuentes "no seguras" como Palatino Linotype sin añadir una segunda familia alternativa.
#contenedor
creo que no has visto qué ocurre si redimensionas la ventana del navegador. ¿Te liaste para conseguir centrar tu página? (si esa era tu intención). Deberías cambiar todas su propiedades por
Cita: #contenedor {
background:#CFCDC0;
margin:0 auto 15px;
overflow:hidden; /*ver más adelante por qué*/
width:792px;
}
Porque ahora el centrado sólo lo consigues únicamente para un caso muy concreto.
No utilizas una gran ventaja de css: La Herencia. Si le hubieses colocado los padding laterales te hubieses ahorrado definir todos los mágenes laterales de sus contenidos. Igualmente con el color de fondo (#CFCDC0) que defines reiteradamente en muchos elementos.
La cabecera:
Has colocado el nombre con una imagen y no como fondo del div, reforzado con un h1 oculto por css. Bien. Supongo que en previsión de deshabilitar el css. Pero ¿y si el problema fuese que no carguen las imágenes pero sí el css?
Creo que hubiese sido más acertado en el h1 suprimir el "display: none", posicionarlo absolutamente y ocultarlo con ayuda de un z-index menor que el z-indez de #cabecera img y ya de paso, eliminamos el div "sin bautizar" que tienes para alojar la imagen.
Menú:
Bien por las acceskey, pero me costó adivinar qué eran los numeritos entre paréntesis. Teniendo espacio suficiente hubiera quedado más explícito añadiendo algo como "tecla de accseso 1".
#cuerpo
Quizás algo de divitis. Párrafos directamente en él y la imagen con una clase para colocarla en línea y flotada a la derecha.
A las dos cajas contenidas aquí le tienes dada altura, supongo que para evitar zonas sin fondo #CFCDC0, pues ambas están flotadas con lo que su padre no "crece". Por eso el "overflow" de #contenedor.
Me sorprendió encontra aquí <h2>Testimonios</h2> cuando los testimonios los tienes en el siguiente contenedor. Sería más lógico que estuviese con ellos.
#contestimonios
Creo que la parte que menos me ha gustado de tu código.
Quizás está separado de más del contenido superior por las alturas de #caja1 y #caja2 como te decía antes.
Coincido con quien te comentaba (¿cvander?) de haber colocado los <li> con los testimonios inmediatamente debajo del <h2> y sin usar fondo para el :hover, como haces con el resto de enlaces tanto en el menú como el pie.
Yo hubiese optado por prescindir del "onclick" y buscar una solución sólo con css.
Colocas todo el contenido del testimonio dentro del mismo enlace <a> con las limitaciones y peligros que ello conlleva, supongo que porque no caíste en que un li puede alojar todo lo que necesites en su interior. Así podrías haberte ahorrado esos <br /> que has empleado para simular texto.
#pie
Algo separado de los testimonios por la altura que tienes definida para éste último.
Lo tienes declarado 2 veces en el css y algunas de las propiedades son innecesarias, como "margin:auto" cuando su anchura es la misma que la de su padre.
su resalte lo confías de nuevo a la imagen de fondo, sin declarar color y sin que quede cubierto por su contenedor en este aspecto. De los peligros de ello ya te comentaba antes. Pero en este caso, yo habría optado por suprimir la imagen y esas dos líneas horizontales lograrlas mediante dos <hr /> con su respectiva clase y color de fondo.
Bueno, Pao, ¿seguimos siendo amigos?
Recuerda que fuiste tú quien me animó a hacer esto así y de forma pública