Juaniquillo
Aprovecharé que este trabajo es también una mezcla entre elástico y fijo para comentar algo que no es la primera vez que veo: si a un diseño elástico no le damos una ancho mínimo, nunca dejará de encogerse al reducir la ventana (esto es evidente). Si a su vez usamos elementos con ancho fijo (como el h1 de juaniquillo, con width:505px), este elemento hará aparecer el scroll horizontal, sin embargo el bloque de texto seguirá encogiendo como si no hubiera scroll. Lo comento porque es un contrasentido, que se podría resolver con un ancho mínimo en el bloque de texto, añadiendo una caja vacía con una anchura dentro de la de texto, etcétera.
Bueno, entrando en materia, visualmente me parece el más limpio y sencillo, y el que mejor soporta el aumento del zoom de texto con mucho, además de adaptarse a 800 de ancho por ejemplo perfectamente.
En IE6 tiene un problema bien conocido con las listas verticales, y es que los elementos dejan un espacio entre sí enorme, aunque esto realmente sería un problema estético, no funcional y de navegabilidad de la página (se resuelve dando ese borde a los LI en lugar de a los enlaces).
Aunque no abusa de imágenes, como en algún otro caso al desactivarlas nos quedamos sin H1, sin nombre de la empresa ni título de la web. Si desactivamos la CSS el orden puede seguirse sin complicaciones.
Al haber flotado a la derecha los elementos del menú principal, estos aparecen en orden inverso (el primero está a la derecha y el último a la izquierda), y al no haber modificado los tabindex, al navegar con el teclado el salto por los elementos del menú es inverso a lo natural, además de que no hay mucha ayuda visual para saber dónde te encuentras (como en la mayoría).
Como en la mayoría de los casos, el HTML es simplísimo y no presenta complicaciones, manteniéndose limpio y claro. Quizá hubiera venido bien el apoyo de algún otro header como título de las diferentes secciones. El código CSS es también sencillo y claro (con exceso de comentarios para mi gusto), con alguna pequeña cosilla mejorable en cuanto a agrupamiento pero sin ningún problema aparente. A mi entender un cierto abuso usando la posición absoluta para evitar posibles problemas de flujo del documento.
El analizador automático de accesibilidad ya resalta que hay un par de errores de nivel AA y AAA, como no usar atajos de teclado.
En resumen, un diseño simple y claro, un buen trabajo en cuanto a intentar conseguir "más con menos", manteniendo un código escueto y claro tanto HTML como CSS, y como la mayoría, muy poco orientado a la accesibilidad.
Quepa aquí una salvedad por mi parte: creo que todo el mundo sabía que en una competencia como esta prima más el diseño limpito y bonito que la accesibilidad y otras virtudes, por lo que quizá mucha gente ha invertido más tiempo en una cosa que en la otra, lo cual es respetable.
Pao01
Un diseño más bien moderno con sensación de tecnología, que rompe por completo el menú de los trabajos (a mi gusto). Diseño de tamaño fijo que no soporta nada bien el zoom del texto, ya que en el caso del cuerpo principal desaparece bajo el pie, por ejemplo.
Una cosa que ya comentamos durante la elaboración de este trabajo (y las consultas públicas que realizaba pao), es que creando los menús con elementos gráficos exclusivamente, al desactivar las imágenes nos quedamos por completo sin menús, título, cabecera ni nada más que el cuerpo principal del texto, lo cual es un problema importante para la accesibilidad. La imagen de cabecera tiene un texto alternativo (alt="Imagen corporativa"), pero éste ni siquiera repite el nombre de la empresa, por lo que con un H1 oculto, nos quedamos sin saberlo.
El efecto :hover está bien hecho con una única imagen cambiando de posición, pero IE6 nos dice que tenemos un serio problema: el menú no se ve en absoluto.
Desactivando la CSS nos volvemos a quedar sin menú principal, viendo elementos vacíos, y un cierto desorden en el flujo del documento.
Como en la mayoría, resulta casi imposible navegar sin el ratón (con el teclado), y aunque se incorporan ayudas como los atajos de teclado para superar el analizador automático, al no ser visibles son completamente inservibles.
Los espacios en blanco en el HTML indican que éste ha sido generado con algún editor de ese lenguaje (que suelen hacer esto), y no tiene nada de malo, pero siempre que se genere de esta forma es inevitable tener que repasar el código y limpiarlo, quitando por ejemplo las tabulaciones o indentados de más y las líneas vacías.
Como en otro casos se ha empezado por un H1, pero se ha prescindido de ayudas semánticas con el uso de headers para encabezar secciones. El código acaba un tanto sucio con los elementos vacíos y los repetidos comentarios al respecto, aunque no parece que haya problemas mayores.
No suele ser especialmente práctico o útil colocar primero la columna derecha y luego el resto si no se va a usar un diseño líquido, aunque tampoco tiene mucho de malo.
El código CSS contiene alguno pequeños errores como poner margin: 00px; (sobra un cero), margin: 0 0 0 0; (debe agruparse en margin: 0;), usar background-position:left top; y background-repeat:no-repeat; cuando en realidad ese elemento no tiene background (no se ha limpiado al terminar), etcétera.
La forma elegida para el diseño obliga a abusar de los ID para identificar cada elemento no permitiendo usar muchas cosas genéricas o comunes, lo que infla un poco innecesariamente el código.
En resumen, en este caso estaba previamente declarado que era la primera experiencia con este lenguaje de pao, que siendo diseñadora ha basado lógicamente su trabajo en una puesta en escena estética moderna y curiosa, defendiéndose con dignidad en el terreno que nos ocupaba, dejando obviamente la puerta abierta a ir entendiendo más los peligros y virtudes de CSS y de la accesibilidad, ambos combinados con el propio diseño gráfico.
En ese sentido todos sabemos que pao es ya una ganadora moral
Bueno, y eso es todo. Espero que nadie se ofenda por mis análisis que evidentemente contendrán bastantes errores, pero imagino que seréis comprensivos porque han sido muchos trabajos a mirar a fondo. Me comprometí a ello y ahí está, aunque espero que nadie tome esto como un profundo análisis de su trabajo ni una crítica con algún valor, porque para eso habría que invertir bastante más tiempo.