Votaciones: Reto Web | CSS + HTML + JS

[Calizman]

Gracias CVander Por tu participacion y por tus comentarios... Se que a los competidores les servirá de mucho todo lo que has dicho, y personalmente quiero agradecerte por haberte unido a un servidor en una aventura mas.

Nuevamente, Gracias a todos los que han participado, a los que me apoyaron en esto, a los competidores y a los jueces. Sin su ayuda no hubiera sido esto posible...

[Triby]

Cvander, excelente descripcion de cada uno de los diseños, muy acertada, hay muchas cosas que mejorar, gracias por el tiempo invertido para el analisis.

Jomaruro, gracias por el voto a favor y el breve analisis que haces de todos los diseños.

Master CaLiZzZ, creo que nos has estado engañando desde el prinicipio, diciendo que eres novato en esto de organizar eventos, pero ya te descubri que tenias todo preparado anticipadamente y por eso te salio a la perfeccion

[Calizman]

Sinceramente... inicie como un novato organizando todo. Para mi ha sido muy grata la experiencia de organizar este tipo de cosas. Si me ha salido todo bien, no es mas que por la colaboracion de los foreros, y el apoyo de los jueces. Aprendi de experiencias pasadas y ahora lo aplique... Ya pronto estaremos dando otra pequeña sorpresa por la seccion de Competencias CSS.

Gracias Triby!

[rolygc]

hola a todos, bueno he visto el resultado de esta competencia hoy, por lo ke he aki mi tardío comentario, si creo, ke habia ke tener bien definido el objetivo o el propositvo de a kien va dirigida la web, en este caso una competencia, pero en la variedad del diseño, es donde se puede apreciar lo ke kiero transmitirles.

Mi opinion muy personal es ke en este caso, creo ke xlogus uso un diseño mas conservador, mas sencillo, y con buena eleccion de colores, para un tema de la web como se presentaba en las reglas.

O sea, cuando lei las reglas, vi primeramente ke el objetivo, seria tener un gran texto como introduccion, y varios link. y he aki donde creo, ke para un usuario entre a un sitio y lea el texto ke debia aparecer en la pagina de inicio, este sitio debe contener un disenno como el de xlogus, bien sencillo y ke no moleste a la vista para poder leer, el de triby tambien pero no una buena eleccion de los colores, para lograr esto ke les kiero transmitir.

Por su parte el sitio de jeybi, creo ke es el mas revolucionario, en cuanto a los sitios convencionales, pero lo veo mas dirijido a un sector juvenil, ke es el grupo de personas mas revolucionarias y rebeldes, ke les gusta el cambio y lo ke siempre vaya adelante. Si la compentencia fuera para una tienda de ropa para jovenes, o una tienda de ventas de disco con musica juvenil, o articulos deportivos, con una pagina de inicio donde resalten mas las imagenes con las mismas tonalidadeds de la pagina y un corto texto descriptivo, creo ke seria sin duda una buena eleccion votar por esta pagina.

Pero como las reglas lo explicaban, creo ke el merito logrado seria en mi criterio personal para xlogus en cuestion general.

luego jeybi y tercero triby, al final magnificos resultados, y doy mi opinion desde el punto de vista de un navegante, no de conocedor, ya ke pueden estar seguro ke ustedes lograron mas de lo ke yo pueda lograr en un año, pero nada, aki estamos para aprender y ayudarnos, asi ke felicidades, magnificos trabajos una ves mas y gracias por permitirnos tener un espacio como este, abierto al debate.

[CircuitoX]

Iniciado por cvander

Tenía pendiente pasar por aquí y dejar mis comentarios luego de revisar detenidamente los trabajos:


Site Nº1: Triby.

Entras a un sitio que está sin duda muy bien ordenado, aunque todas las sombras y contrastes para darle volumen al sitio nacen de un logo que ha fallado como punto inicial. Es poco llamativo y creativo. Además que tanto texto agrupado sobre el círculo le quita todavía más impacto. Me gusta como se maneja el menú superior, dejando luego un montón de espacio sin uso a su derecha.. Por allí por el año 2000 esto se rellenaba con un banner de 468x60 (que todavía existen, pero con muy poca efectividad).

El sitio me gusta, pero tiene ese problema, me hace regresar al pasado. Esto se puede corregir jugando con variedad en las tipografías, definiendo una paleta de colores más restringuida (creo que en algún momento vi naranja, morado, rojo, azul, celeste, gris oscuro, gris claro, etc.) Pero sobre todo aprovechando ese espacio extra que hay. Un logo más adecuado, más simple incluso y un menú que aprovechara el espacio. Incluso se me ocurre que los mismos botones superiores esten alargados sin límite hacia la derecha, para usar todo ese header y que simplemente tengan mucho más impacto.

Me gustó mucho como se estilizó el formulario, manteniendo las curvas que son parte de la estructura del sitio. En el menú de selección, al expandirlo se rompe toda esa estructura.

Creo que si se trabaja más en el encabezado para asegurar que tenga un mayor impacto se podría mejorar todo el proyecto. Me gustan mucho los detalles redondeados, las curvas (porque además se sabe que hay trabajo allí detrás para lograrlos). Y la información una vez navegas fluye sin problemas, se entiende y puedes navegar con tranquilidad.

Site Nº2: XLogus.

Confiezo que me dan un poco de temor los sitios que tienen el ".com" en el logo. Creo que estuvo de moda en algún momento, aunque trataría de evitarlo. Me gusta el sitio, aunque hay un detalle que me recuerda el paint de windows ;) Es un lindo adorno, pero me llama incluso la atención más que el logo y allí es donde me preocupa. Incluso ya que llama tanto la atención bien podría utilizarse como isotipo y simplemente acompañar con una tipografía el nombre del sitio. Lo de los 4 pelones de negro y la sombra, siento que son demasiados detalles.

El menú está muy bien elaborado, con mucha elegancia y también me gusta la opción del sidebar con lo nuevo. Lindo detalle que se amplien los recuadros cuando paso sobre ellos, aunque porfa, no me cambies el cursor, me asustas y no entiendo la razón. No es un indicativo específico, es más, el cursor me recuerda la mira de algún arma e intento dispararle a todos los cuadros esperando que se desintegren (uf, si, a veces me pongo un poco bélico detrás del ordenador).

Me gusta la simplicidad del sitio, esos detalles de la sombra en la parte superior y la paleta de colores. Mi queja va hacia el logo, que es demasiado barroco y pudo haber quedado más simple, para terminar de completar la elegancia del sitio. Y es bien interesante ver como los cuadritos de la derecha con sus bordes balancean todo de forma acertada. Si le mejoras el logo me quejaría menos ;)

Site Nº3: Jeybi

Este logo vende y sin duda se ha ganado el cariño de otros usuarios. Porque cuando entras al sitio, te atrae con suficiente fuerza que empiezas a revisar el sitio con mucho orden. Vez el logo, vez el slogan y poco a poco vas bajando.

Me voy a diseños, y se me desaparece el botón en lo que cambia a la otra imagen. Se que mi conexión no es la mejor, pero son esos pequeños detalles que asustan. Aunque debo decir que la transición con la que aparece el contenido es muy buena, me agrada bastante.

Luego en el formulario de contacto, el botón ese verdecito parece radioactivo, será el color que me recuerda las barritas que Homero Simpson maneja o algo.

Hay un pequeño detalle en donde el encabezado corta y arranca el fondo del diseño, del lado derecho. Se ve el corte, como que un pixel falló y aunque son detalles que casi nadie mira, me fije y lo quería comentar.

Me gusta que parece un documento y la navegación es simple, con efectos que llaman la atención. Sin duda uno de los que me gusto por su simplicidad y que encontró balancear todo de forma adecuada. Felicitaciones por el trabajo.

Site Nº4: dalvenjha.

Cuando entras a este sitio, te encuentras con una ensalada. Eso es bueno, porque te hace ser curioso.. ¿Qué es esto? ¿Es navegable? ¿Dónde pulso primero? Aunque puede confundir al usuario, lo invita a interactuar y veo que todo tiene opciones ya que todo cambia cuando paso el cursor. Pulso la primera cajita, la de los diseños y... OMG (lo tenía que decir), todo se movió.. Dónde le puedo poner pausa para que en mi monitor dejen de pasar los contenidos. Debo admitir, el efecto es lindo, pero es un poco práctico. Recuerda que ya nos tenías distraidos y encantados.. Pero al enterarnos que va a ser un viene y va a cada link, voy a pensar en contenerme cada click que vaya a realizar.

Me puse a ver los siguientes y de repente cuando salió lo de MEN 13 se me montó un formulario (ando en os x con safari). Ahora si me siento perdido. Yo lo arruiné? Mejor regresaré al inicio esperando que todo se vuelva a poner en su lugar. Tarda varios segundos en regresar y mis ojos les cuesta enfocarse de nuevo.

Voy a pulsar otra cajita, aunque ya estoy advertido que esto se mueve cada vez que lo hago. Me voy con cuidado, me voy al formulario de contacto.. Y.... me quedo una página en blanco.. Lo sabía, lo he jodido, el formulario de contacto quedó en lo de MEN 13.. ¿Cómo fue que lo mandé hasta allá? Y cómo lo regreso? Hay cosas lindas en este proyecto, que atraen, pero de repente hasta se me pierden los elementos. Si el objetivo principal es que te mande un correo, no lo voy a lograr y me iré frustrado.

Vuelvo al inicio y aprovecho a charlar de otros detalles. La simplicidad aquí se llevó al extremo, un solo color para los textos y para las cajas. Si permanezco mucho tiempo en el sitio lo empiezo a notar y me asusta un poco el extra de los efectos. Intenté también jugar con los menús de Accesibilidad, Herramientas, inicio.. Me sale una flechita, pero nada se expende, de que trataba esa indicación?

Y el logo.. Parece una marca de agua, le falta impacto, contrasta bien con el sitio, pero como te digo, me inquieta la experiencia, es como si esto tuviera vida propia (tu decides si transmitir eso al usuario es bueno o no). ;)

Site Nº5: jomaruro.

Cuando veo el teclado gigante hacia arriba, me pregunto como pudimos mejorar el impacto de ese elemento. Te imaginas si en lugar de ponerle el texto encima hubieramos escrito el texto con las teclas? Cambiar el QWERTY por el nombre del sitio, dejar el resto de teclas vacías.. Para que el elemento tuviera más vida y me inquietara. Pero quedó como un fondo extraño y el título se lee, se entiende, pero le falto encanto. Luego veo el monitor y el texto de arriba me indica que ese es el Logotipo.. Perdón, lo entendí mal, siempre me pasa que no entiendo estas cosas ;)

La imagen al final del manifiesto es una buena ancla, pero bien podría servir para ilustrar el texto, incluyéndolo más arriba. Las validaciones vaya que se notan con el borde rojo. Pueden ser enlaces más simples, o los tradicionales botoncitos que están disponibles en los respectivos sitios de cada validador.

Me voy a ver los diseños y veo un detalle que me gusta mucho. El pedazo de cinta sobre cada cuadrito. Este elemento me gusta, valdría la pena usarlo en otros lugares, tal vez en la entrada para ilustrar. Me gusta como se ven los trabajos, aunque hay que tener cuidado con forzar el tamaño de las imágenes sobre archivos que eran más pequeños, lo pixeleado da esa sensación de que estuvo mal trabajado.

Y luego llego al formulario de contacto. No entendí porque está el formulario en un tipo de frame o similar. Tampoco me agradaron los bordes que hay en los imputs. De hecho, mi queja aquí va contra los bordes, los de los links del final, el borde punteado que tiene la estructura del sitio y también los campos del formulario. Demasiados bordes que me encierran todo. Si lo dejas flotar seguro que ayudaría.

-------

En fin, mis pequeñas recomendaciones.. Nótese que cuento un poco la experiencia de navegar por el sitio, las sensaciones que me provocan y trato de hacer algunas sugerencias puntuales que podrian ayudar a mejorar lo presentado.

Aclaro que yo de diseño se muy poco (así que hablo de lo que me gusta y me suena correcto para estas épocas de la web), mis habilidades para programar dejan mucho que desear (así que no especifiqué detalles de código ni le dediqué mucho tiempo al firebug).

Muy interesante el análisis.
Las opiniones y sugerencias que das
Nos da a conocer la forma en la que uno tiene que crear sitios

Me gustaría conocer. Por parte tuya. Sitios que consideres profesionales
Es decir que estén al acorde de la actualidad

Podrías poner algunos ejemplos. (Links de Páginas)



Un gran saludo y Éxitos para todos

[cvander]

Sitios que considere profesionales??

Se me ocurren 3 así al azar:
maestrosdelweb.com
120segundos.com e incluso
forosdelweb.com



Ya en serio, más que profesionales en cuanto a diseño y estructura, considero muy buenos aquellos sitios cuyo diseño ayuda a que encuentre la información que estoy buscando fácilmentente y me ayudan a navegar gracias a mis conexiones entre el ruido que provoca hoy en día la web:

En este sentido hay servicios de los que soy adicto como son twitter, el top de del.icio.us, facebook (luego que organizas bien los grupos de amigos), linkedin, vimeo.. Y en parte porque su contenido es interesante, pero a la vez la forma en que lo consumo (y en el caso de twitter, no precisamente consumo el contenido en su sitio). Luego en cuanto a contenidos, nunca me pierdo la lectura diaria de readwriteweb.com, uberbin.net. Otros también de contenidos que vale la pena visitar (no lo hago siempre, pero siempre me interesan) son uxmag.com o wired.com (desde que renovaron me encanta).

[javioreto]

Sin lugar a duda yo me quedo con el diseño de Xlogus pero con diferencia, las demás webs son caóticas!! si que en algunas como el diseño Dalvenjha se juega muy bien con las posibilidades del CSS en cuanto a posicionamiento de contenidos pero no tiene un orden claro, puesto la web inicial se basa en el menú desperdigado....

La única estepción a parte del diseño de Xlogus es la web de Jeibi que me ha gustado mucho por sus scripts de transición entre las secciones disolviendose. pero a la hora de elegir una web me quedo con la de Dalvenjha por una sencilla razón:

Tu web solo tiene 3 secciones y el diseño está concevido para esas 3 sin posibilidad de ampliarlo por temas de espacion aparte de que todos los botones del menú son imágenes a diferencia de la otra web en la que es texto y se puede ampliar en cualquier momento o modificarlo sin necesidad de editar el apartado gráfico de la web.

[algoparapensar]

Iniciado por javioreto

Sin lugar a duda yo me quedo con el diseño de Xlogus pero con diferencia, las demás webs son caóticas!!

¿En que te basas para decir algo asi?, ¿cómo lo justificas?.
El organizador dio en forma muy clara las pautas en las que se debe analizar la votacion:

-Logo
-Diseño
-Codigo
-Nombre

Creo que por lo menos, y por respeto a todos los competidores, podrias haber hecho al menos 1 o 2 puntos de analisis de cada site.

[javioreto]

Caoticas respecto a que a mi no me gustan visualmente, el orden a la hora de situar menús, contenidos, etc. Puede que el código fuente sea muy bueno, pero si el diseño no es bueno pierde mucho la web... aparte webs basadas en wordpress, para un concurso yo haría mi propio código integro nada de amoldar un código ya existente. Es más me remito a un comentario que hacía cvander sobre una web que venia a ser algo como "meterme en esta web es como hacer una mirada al pasado".

En resumen pues en eso me baso para decir que me parecen caóticas, quizás no sea la palabra más recomendada pero a eso me refiero, diseños desfasados, mala organización y "powered by wordpress"...

[Calizman]

<sarcastic> Gracias por tus comentarios javioreto seguramente a alguien le van a ayudar... </sarcastic>

En cuanto a la competencia.... No me habia dado cuenta de la fecha de cierre, y al parecer la encuesta tendrá finalizacion el 26 de julio. Que dicen? Esperamos a que se termine? o con los votos que estan les digo quien ganó?

[algoparapensar]

Iniciado por CaLiZzZ

Gracias por tus comentarios javioreto seguramente a alguien le van a ayudar...

[Triby]

Iniciado por javioreto

...aparte webs basadas en wordpress, para un concurso yo haría mi propio código integro nada de amoldar un código ya existente...

Tienes alguna base para afirmar que alguno de nosotros se baso en Wordpress para su diseño?

Digo, gracias por los comentarios, el analisis y el voto, pero creo que exageras al menospreciar de esa manera el tiempo (poco o mucho) que cada uno de nosotros invirtio para participar en la competencia.

[jomaruro]

Hola:

Soy totalmente consciente de que mi trabajo no es bueno, pero ¿que diseños hacías tú a los pocos meses de empezar con css?

Iniciado por javioreto

las demás webs son caóticas!!

Pero, cualquiera de los demás trabajos es bastante mejor que esto y también que esto.

Es conveniente, antes de barrer la casa de los demás barrer la propia, creo yo.

Saludos.

[jeybi]

Tenia rato que no me fijaba en las votaciones, al parecer mi diseño y el de Tribi se pelean constantemente el segundo lugar xP.

Las criticas (lo mas importante) ya estan, asi que por mi finalicen la competencia cuando deseen. ( ya viene la otra :D)

Saludos

[Calizman]

Iniciado por algoparapensar

Creo que olvide las etiquetas principales!! <sarcastic></sarcastic> Prometo no volver a olvidarlas!!

Sinceramente, yo hice caso omiso a el comentario. Hablo de caoticos y no se que mas cosas... y sinceramente no le puse mucha atencion! Pienso que tenemos que tomar las criticas constructivas, y reirnos de las criticas destructivas... Asi que nadie se ofenda por el comentario antes dado... solamente tomen lo bueno, rianse de lo malo, y disfruten de los trabajos que con tanto esfuerzo y dedicacion han hecho.

[javioreto]

Iniciado por Triby

Tienes alguna base para afirmar que alguno de nosotros se baso en Wordpress para su diseño?

Digo, gracias por los comentarios, el analisis y el voto, pero creo que exageras al menospreciar de esa manera el tiempo (poco o mucho) que cada uno de nosotros invirtio para participar en la competencia.

Saludos! deberas que lamento haber creado polémica, no era mi intención, perdón por la gente que se ha sentido ofendida

Por lo de wordpress me refiero a la web de facundocorradini y cosmicdesign que estan basadas en wordpress 2.7.1 con el all in one seo pack 1.4.9 pero me he dado cuenta que al final no se presentaron a concurso, lo que no se es porque las siguen manteniendo en el apartado de ver las webs a concurso...

[XLogus]

Javioreto, si uso un diseño prediseñado en mi blog es porque no tuve tiempo de hacer uno propio En casa del herrero cuchillo de palo(Hago paginas para medio mundo menos para mi). Y uso Wordpress porque considero que en blogs es lo mejor y porque para mi web personal prefiero el fondo que la forma (aunque ultimamente ando ocupado para postear)

Pero eso NO tiene nada que ver con el concurso, me parece que el concurso no es sobre webs personales sino sobre un diseño para Retoweb, corrigeme si me equivoco Calizzz

[pao01]

javioreto, una pregunta: emitiste votos sobre webs personales ó las que se presentaron a concurso?, porque las que se presentaron a concurso están al inicio del post en el link de CaliZzZ.

[Triby]

Iniciado por javioreto

Por lo de wordpress me refiero a la web de facundocorradini y cosmicdesign que estan basadas en wordpress 2.7.1...

Te fijaste mas en el pie que en el encabezado... error 404, pagina no encontrada.

El mensaje esta en ingles y tal vez no seas muy bueno con ello, pero el titulo dice Miguel Manchego... no facundocorradini ni cosmicdesign... un poco de atencion en la lectura no viene mal de vez en cuando.

Iniciado por javioreto

...pero me he dado cuenta que al final no se presentaron a concurso, lo que no se es porque las siguen manteniendo en el apartado de ver las webs a concurso...

Esto es porque CaLiZzZ (organizador) y xlogus (patrocinador de webhost) crearon una plantilla para presentar los trabajos desde antes de recibirlos, incluyendo a cada uno de los participantes. Obviamente se les agradece el esfuerzo que hicieron para apoyarnos y, puesto que aclararon en el primer mensaje del tema que habia 3 que no se presentaron, no creemos necesario que sea modificada la plantilla de presentacion.

Algo me dice que no leiste completo el inicio de este tema.

Iniciado por javioreto

Saludos! deberas que lamento haber creado polémica, no era mi intención, perdón por la gente que se ha sentido ofendida

Creeme, no creaste polemica... personalmente, solo tenia curiosidad por saber a que se debian tus comentarios y, lo de la ofensa... tampoco creo que alguno de nosotros lo haya tomado tan personal como para considerar ofensivas opiniones vertidas tan a la ligera, sin una explicacion detallada y razonada de los porques.

[jomaruro]

Hola:

Por si no se me ha entendido bien, yo no me he sentido ofendido por los comentarios de javioreto ni mucho menos solo me ha molestado la forma de decirlo, y sobretodo ese..., como diría..., desprecio por unos trabajos (de mis compañeros) que me parecen fantásticos.

Eso si, se percató de que había trabajos hechos con Wordpress y no se dió cuenta de que eran iguales. ¿Alguien lo entiende?

Quien "abre la boca" se equivoca.

Y con esto cierro mi participación en la "polémica".

Saludos.

[Calizman]

Bueno, como organizador, quiero darme la libertad de terminar y dar por cerrada la polémica dentro de este hilo. Si alguien tiene algo mas que agregar, les pido que sea por mensajes privados o por msn o como quieran, pero no aqui. Este es un espacio abierto para Votaciones y Sugerencias y claro Para que los participantes agradezan los votos o pregunten sobre las sugerencias. Por lo que, como ya se ha hablado, la pagina error 404 no entra en la competencia ni es parte de el proyecto hablado.

Asi como Xlogus lo ha dicho, la competencia es sobre retoweb.com no sobre la pagina error 404 de xlogus.

Asi que si alguien tiene algun otro voto que emitir, agradeceré que lo haga de forma clara y explicita. De lo contrario, daremos por cerrada la competencia (aunque la encuesta siga abierta) y daremos a el ganador en un periodo de Una Semana poniendole fin a la competencia el Jueves 14 de Mayo

Si alguien necesita una prorroga de tiempo, puede comentarlo en el hilo y aqui lo dialogamos.

Entonces, Que sigan los votos!

[David]

Para empezar, felicidades a todos los que participaron en la competencia. Se nota el esfuerzo que hay detrás de los trabajos.

Aunque no sé mucho de esto quisiera aportar un poco a la competencia comentando principalmente sobre los códigos utilizados (que ya saben que el diseño no es lo mío ). Si notan algo raro o incorrecto, no duden en mencionarlo.

-----------------------------------------------------------------
Primer Trabajo: Triby
Código XHTML:
Muy legible. Bien indentado, usando el tabulador.

Hay algunos problemas con la semántica del código. El principal problema es el uso de <div>. Hay que tener en cuenta que ese elemento casi no tiene significado semántico, no es más que un contenedor o división de la página. Por ejemplo, el calendario, está hecho completamente con divs. Según mi interpretación, en este caso sería válido usar tablas, ya que el calendario básicamente es contenido tabulado. Así también, en el index, los textos debajo de los encabezados, son párrafos (<p>), no deberían ser <div>; lo mismo para el texto de los eventos que explica lo que se realiza en cada fecha (en la barra lateral derecha). También, existe ese problema en el formulario, donde la mayoría de los campos están envueltos con un div, podrías haber aplicado los estilos directamente al input.

Hay también un pequeño problema de inconsistencia en el uso de los encabezados (hX). Por ejemplo, el encabezado "Otros Diseños" de la barra lateral izquierda es un h4, lo que me haría pensar que tiene relación con el contenido principal, y que es menor en jerarquía; pero no hay mucha relación, por lo que probablemente sería más correcto un h2. Lo mismo con la barra lateral derecha del index, que es un h4, cuando no tiene mucha relación de jerarquía con los subtítulos "Diseño", "Manifiesto", etc. Podría ser un h3 considerando la relación de jerarquía con el subtítulo de la sección.

Sobre el código CSS no tengo mucho que comentar. Me gustó que comentaste bastante el código, lo que facilita la lectura, saber qué hace cada cosa. Me pareció curioso ver que usaste una unidad de medida (px) en los ceros .

Segundo trabajo: XLogus
<offtopic type="hablando del diseño">Me gustó la selección de colores, y el detalle de los degradados, en cuestión de diseño es uno de los trabajos que más me ha gustado</offtopic>

En cuanto al código. Uso correcto de la anidación de listas para el menú.
Hay también alguno que otro div que según mi interpretación podrían usarse otras etiquetas que tengan mayor significación semántica, por ejemplo, el adorno de la paleta podría ser un <img>. Algo que me llamó mucho la atención fue que aunque en el index usaste correctamente los párrafos para el texto de Bienvenida (<p>), no fue así en la sección "Manifiesto" y el pie de página, donde el texto está dentro del div y los párrafos están separados por saltos de línea "forzados" (<br />). En el menú lateral de "Lo Nuevo" podrías usar una lista desordenada para los enlaces y usar un texto alternativo más descriptivo, ya que no hay ningún otro texto explicando las imágenes, así que sin ellas, teniendo como texto "pic1", "pic2", "pic3" el lector se perdería un poco (nota: quedó muy bien ese efecto de zoom al pasar el mouse).

En el formulario me pareció curioso el hecho de que el formulario está dentro del fieldset en lugar de que el fieldset esté dentro del formulario . Aunque usaste correctamente las etiquetas <label> que sirven para especificar la función de cada campo del formulario, no especificaste el atributo for para que se sepa a qué campo está relacionada cada label (no haría falta si el campo estuviera dentro de la etiqueta label).

P.S.: No hay h1

Código CSS:
Tampoco tengo mucho para comentar. Se nota bien limpio. Aunque no hay muchos comentarios, se puede leer bien. Podrías haber usado la forma abreviada para padding y background en algunos casos (en lugar de padding-top, padding-right, padding-bottom y padding-left para el primer caso, y para el segundo en lugar de background-image, background-repeat y background-position).

Tercer trabajo: jeybi
<offtopic type="hablando del diseño">Me gustó mucho el logo. Imagino el trabajo que tuviste para hacerlo :

Nota: el texto del pie "Diseñador por..." casi no se nota ya que se mezcla con el color de la imagen de fondo.</offtopic>

Código XHTML:
Me gustó el código en general. Usaste correctamente los encabezados (hX). También de los párrafos para el texto y las listas desordenadas. Me llamó la atención esos <br /> en el formulario , así como el fieldset sin legend.

Código CSS:
También me gustó el hecho de que comentaste varias secciones del código para poder ubicarse dentro del archivo.
Los selectores #menu span, #logo span y #centro h2 span hacen lo mismo. Podrías unirlos y comentarlos explicando que reemplazan el texto por la imagen de fondo.
El selector #contactoCont legend sobra, así como el #contactoCont legend span (el primero no se aplica a ningún elemento y el segundo está vacío).
Para el efecto de hacer mayor la primera letra en los párrafos podrías haber usado el pseudo-elemento first-letter en lugar del span.
-----------------------------------------------------------------------------------

Los otros trabajos voy a revisarlos después y dar mis comentarios.
Nota: Me quedé con las ganas de ver en alguno de los trabajos el uso del tag <acronym> (acrónimo) al envolver "XHTML" y "CSS" dentro del texto.

Saludos.

[David]

----------------------------------------------------------
Cuarto trabajo: jomaruro
Código XHTML:
<offtopic type="hablando un poco del diseño">Algunas imágenes no cargan (no existen), por lo cual se usa el texto alternativo, en el logo y en la validación al pie.</offtopic>
También me gustó el indentado de los códigos.

Uso correcto de encabezados y párrafos. Interesante ese efecto de esquinas redondeadas usando sólo XHTML/CSS en los títulos de las secciones (span y div no tienen sentido semántico en ese contexto, igual, el efecto es interesante).

En el logo el div que contiene al h1 está sobrando, podrías haber asignado el logo como imagen de fondo del h1 directamente. Esos span que están en el portafolio (para la imagen decorativa parecida a una cinta) sería mejor que fueran imágenes (<img>).

El código de la sección de contacto tiene errores de validación debido a que incluíste los label/input directamente en el formulario sin ningún contenedor (frameset, div, etc.). También, no especificaste el atributo for para algunos de los label. Esos <br /> probablemente sobran en favor de CSS para controlar la ubicación de los elementos.

El validador te da una advertencia en todas las páginas debido a que tienen un BOM (UTF-8) al inicio del archivo; es bien sabido que esos tres caracteres puedan dar varios problemas, entre ellos, hacer que mágicamente el diseño se descuadre en algunos navegadores. Guarda tus archivos con codificación UTF-8 sin el BOM.

Las imágenes de "Código Válido" no tienen un enlace al validador.

Código CSS:
No comentaste ninguna sección del código. Tal vez podría servir algunos comentarios para que al leer se entienda la agrupación de los selectores que aplican a ciertos elementos.

Hay algunos selectores que podrían simplificarse, por ejemplo, en lugar de:
.raised .b1, .raised .b2, .raised .b3, .raised .b4, .raised .b1b, .raised .b2b, .raised .b3b, .raised .b4b
Obtendrías el mismo efecto usando:
.raised span
Podrías así también incluir en ese mismo selector el background-color para que aplique a todos los elementos, en lugar de repetirlo en todos los selectores independientes.
Así también. Esto:
#enlace a, #enlace a:link, #enlace a:visited, #enlace a:hover
Podría ser solamente:
#enlace a
Así ya se aplicaría el color al enlace independiente del estado (definido por los pseudo-elementos).

En el selector #titulo repites dos veces la propiedad vertical-align.

En algunos casos (por ejemplo, en el selector h1) podrías haber usado la forma abreviada para la propiedad font en lugar de una declaración para cada propiedad:
font: style variant weight size family;

Quinto trabajo: Dalvenjha
<offtopic type="hablando un poco del diseño">Interesante el diseño, salirse un poco de la rutina . En algunas resoluciones, al ir a un apartado, se ve el "copete" del apartado siguiente, lo cual genera un efecto algo desagradable al querer leerlo pero no poder hacer scroll (necesariamente hay que volver al menú y hacer click al enlace a esa sección)</offtopic>

Código XHTML:
Uso correcto de los encabezados, párrafos e imágenes.

Falta indentar el código (eso causa dificultad al leerlo). El código no valida, y, si revisas, la mayoría de los errores están relacionados con el código Javascript. Recomendación: en lo posible, siempre coloca tu código Javascript en un archivo separado (.js) y sólo enlaza al archivo desde el XHTML.

En el formulario (de hecho, no existe formulario, cuando debería haber) veo que usaste una lista desordenada para los campos, yo no lo interpreto como tal (como una lista desordenada). No usaste etiquetas (label) para los campos, es importante que las uses por cuestiones de accesibilidad y semántica. El botón de envío es un type="button", es mejor que sea un type="submit".

También, ese span de "Volver al inicio" sería más correcto que fuera un enlace (<a>) apuntando al inicio (href="#").

No especificas un texto alternativo a las imágenes, el texto alternativo debe tener la misma función descriptiva que la imagen. El atributo alt lo dejas vacío, el robot de validación no se va a quejar, pero te aseguro que un usuario que no pueda ver las imágenes por X razón sí lo va a hacer.

Esas anclas (<a name="...">) sobran. Ya que los enlaces pueden apuntar directamente al id del div que contiene la sección, por ejemplo #manifiestar (para la sección "Manifiesto").

Código CSS:
Tampoco hay comentarios en el código, y en este caso siendo un archivo ya algo extenso a primera vista uno se pierde.

Hay algunas repeticiones innecesarias de propiedades. Por ejemplo, fíjate que html y body tienen igual valor para width, height, margin y padding, entonces, lo mejor sería que los unificaras en un selector (html, body) para esas propiedades. Lo mismo sucede con las cajas que tienes en la sección principal, todas tienen mismo valor para min-height, overflow, padding, font-size, y padding-*. Podrías usar un único selector (#content #menu div, por ejemplo) para asignar esos valores.

En el selector #container #header h1 podrías haber usado la forma abreviada de margin. También, se nota un uso incorrecto de la forma abreviada. Por ejemplo, hay selectores que tienen:
margin:0 auto;
margin-top:1.5em;
margin-bottom:0.5em;
Lo cual es innecesario (usar la forma abreviada y luego asignar dos de los márgenes por separado), podría ser solamente:
margin: 1.5em auto 0.5em;
Lo mismo para el padding en algunos selectores.
----------------------------------------------------------

El orden en que presenté los trabajos no tiene que ver con la votación/críticas sobre el código, más que nada, fue solo el orden en que los fui revisando.

Mi voto es para: jeybi (en cuestión de Código)

Felicitaciones nuevamente a todos los participantes.

Que pase el siguiente a presentar su análisis .

[Triby]

Excelentes analisis, David (Genormico) el Grande, todos los conceptos muy interesantes y ya estan anotados para futuros trabajos.

Hablando de mi trabajo, a pesar de que un compañero ya me habia comentado de la falla con el calendario en divs, seguia creyendo que era mas adecuado por simplificacion de codigo, pero habia dejado de lado el tema de la semantica.

En cuanto a la unidad de medida en los ceros, originalmente comence a hacerlo asi porque a veces se me olvidaba especificar la unidad cuando no era cero y, poco a poco, he estado tratando de eliminar ambos malos habitos; gracias por la observacion.

[jomaruro]

Hola:

David, gracias por el fantástico análisis, me ha resultado muy, pero que muy instructivo. Decirte que hasta que tú lo has comentado no me había dado cuenta de que, al final, no había validado el código ¿Dónde estaría mi neurona? ¡Seguro!

Saludos.

[XLogus]

Hola
Como se ve que hice la maquetación bastante apurado y se me pasaron una serie de detalles para pulir y tal vez no hacerlo tan cuadrado el diseño y resaltar más el logo que la paleta o borrar el logo y dejar solo la paleta

[Calizman]

Bueno... Que dicen? Dejamos esto hasta aqui..? Seguimos con esto hasta Junio? o que hacemos?! por mi, cerremos las votaciones ya. Igual creo que a poca gente le falta votar...

Pero no quiero darlo por terminado si los participantes no estan deacuerdo. Asi que ustedes digan!!

[Trilan]

:O Son grandes señores. Me sorprende todo lo que se puede llegar a hacer.

Saludos

[jomaruro]

Hola Master CaLiZzZ:

Por mi parte puedes dar por terminada la competencia cuando quieras.

Saludos.

[XLogus]

Hola
sip yo creo que podemos dar por concluida la competencia con un pequeño post que indique un resumen de los resultados.