Foros del Web » Creando para Internet » CSS » Competencias CSS »

Votaciones Duelo Aresillo vs. CaLiZzZ

Estas en el tema de Votaciones Duelo Aresillo vs. CaLiZzZ en el foro de Competencias CSS en Foros del Web. Aquí están ya los dos tiros de los contendientes: Aresillo CaLiZzZ En lugar de poner una encuesta para votar, haremos como otras veces, llevando la ...

  #1 (permalink)  
Antiguo 24/11/2008, 17:34
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Votaciones Duelo Aresillo vs. CaLiZzZ

Aquí están ya los dos tiros de los contendientes:

Aresillo

CaLiZzZ

En lugar de poner una encuesta para votar, haremos como otras veces, llevando la cuenta e incrementando cada uno que vote su punto en su propio mensaje, para poder dejar además algún comentario. El marcador a cero:

Aresillo: 0
CaLiZzZ: 0


Os recuerdo que a la hora de evaluar se debería tomar en cuenta:
- limpieza y orden del código html
- limpieza y orden del código css
- accesibilidad
- diseño gráfico y estética
- la semántica (como un valor añadido)

Estaría muy bien que mucha gente (y sobre todo los "notables" ), os animárais a dar vuestra opinión, correcciones y consejos, ya que este duelo se ha planteado como didáctico.

De entrada, enhorabuena a los dos, porque ambos parecen trabajos muy respetables, nada de "novatos"

Adelante.

P.D.: Importante: recordad antes de emitir el voto que los participantes se han ceñido en lo posible a estas reglas:

http://www.forosdelweb.com/f95/duelo...alizzz-644760/
__________________
Visita mi nueva web idplus.org

Última edición por Mikmoro; 24/11/2008 a las 19:26
  #2 (permalink)  
Antiguo 24/11/2008, 18:02
Avatar de pao01
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 1.875
Antigüedad: 9 años, 6 meses
Puntos: 351
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Como no es mi rubro y no entiendo al respecto me abstendré de votar; sin embargo viendo las propuestas presentadas, me han gustado mucho ambos trabajos. Felicitaciones!!!
__________________
Entre más estrecha la mente, más grande la boca.- Ted Cook
Autosconarte-Blog
  #3 (permalink)  
Antiguo 24/11/2008, 18:25
Avatar de Aresillo
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Becerril de la Sierra
Mensajes: 958
Antigüedad: 9 años, 8 meses
Puntos: 53
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Supongo que el arbitro tendrá que hacer una valoración personal al respecto no?
De momento gracias al ya citado por su buen hacer, a mi propio contrincante y a la comunidad por ofrecer estos espacios de autoaprendizaje personal y en comunidad...
Espero vuestro comentarios, sugerencias y soluciones...

Tengo algunas dudas de mi diseño... no sé donde ni como preguntarlas...
Ya me diréis...

Aresillo!!
PD: Enhorabuena CaliZzz por tu tiro
  #4 (permalink)  
Antiguo 24/11/2008, 18:45
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Si yo tambien quiero que el arbitro haga un punteo para cada pagina... creo que eso nos ayudara a ambos no?

Gracias desde ya... a todos los que voten y a los que vean los tiros... creo que cada uno dio su mejor intento y su mejor trabajo...

Felicidades Aresillo por tu tiro... como ya te dije muy buen trabajo!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #5 (permalink)  
Antiguo 24/11/2008, 18:53
Avatar de sanchy  
Fecha de Ingreso: octubre-2008
Mensajes: 389
Antigüedad: 9 años, 1 mes
Puntos: 9
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

edito para evitar confusion =O

Última edición por sanchy; 24/11/2008 a las 20:13
  #6 (permalink)  
Antiguo 24/11/2008, 18:53
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

y que es chrome?

EDITO: para las proximas sugerencias... porfavor especifiquen que es cada cosa... ya que es un duelo de novatos yo en lo personal no tengo ni idea de que es una pagina chrome y que no lo es... asi que agradeceria que las proximas sugerencias tengan una explicacion detallada para aprender mas...

Gacias!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter

Última edición por Calizman; 24/11/2008 a las 19:02
  #7 (permalink)  
Antiguo 24/11/2008, 19:03
Avatar de sanchy  
Fecha de Ingreso: octubre-2008
Mensajes: 389
Antigüedad: 9 años, 1 mes
Puntos: 9
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

edit: perdona no me parecio necesario explicar, mi error..

chrome es el explorador de google

  #8 (permalink)  
Antiguo 24/11/2008, 19:05
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Woow... ok gracias por la sugerencia... solo recuerdo que las reglas eran IE6, IE7 y FF
Pero gracias! lo tendre en cuenta para la proxima!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #9 (permalink)  
Antiguo 24/11/2008, 19:08
Avatar de sanchy  
Fecha de Ingreso: octubre-2008
Mensajes: 389
Antigüedad: 9 años, 1 mes
Puntos: 9
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

hm... no conosco las reglas mas que las q estan posteadas en este foro. perdon si mi razon de voto estaba equivocada. yo solo vi las 2 paginas y, como uso chrome por defecto, fue claro cual votar

suerte a los 2 =)
  #10 (permalink)  
Antiguo 24/11/2008, 19:23
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Perdón, ha sido culpa mia: pensaba añadir el enlace a las reglas justamente para evitar esto y al final se me ha olvidado. Eran estas:

http://www.forosdelweb.com/f95/duelo...alizzz-644760/

sanchy: es normal que no supieras ni que existían, pero ya que hemos hecho unas reglas para la competencia, sería mejor echarles un vistazo antes, porque lo participantes se han ceñido a ellas.

Recueda también que cuando vayas a votar debes copiar el marcador en tu mensaje y añadir tu voto, para que así el que venga detrás sepa cómo va y lo qué añadir.
En tu caso deberías poner:

Aresillo: 1
CaLiZzZ: 0

(esto no vale)

Estaría bien que sabiendo ahora que Chrome no se tenía en cuenta volvieras a emitir tu voto y lo hicieras como te digo.
__________________
Visita mi nueva web idplus.org
  #11 (permalink)  
Antiguo 24/11/2008, 19:27
Avatar de sanchy  
Fecha de Ingreso: octubre-2008
Mensajes: 389
Antigüedad: 9 años, 1 mes
Puntos: 9
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Cita:
Iniciado por Mikmoro Ver Mensaje
Perdón, ha sido culpa mia: pensaba añadir el enlace a las reglas justamente para evitar esto y al final se me ha olvidado. Eran estas:

http://www.forosdelweb.com/f95/duelo...alizzz-644760/

sanchy: es normal que no supieras ni que existían, pero ya que hemos hecho unas reglas para la competencia, sería mejor echarles un vistazo antes, porque lo participantes se han ceñido a ellas.

Recueda también que cuando vayas a votar debes copiar el marcador en tu mensaje y añadir tu voto, para que así el que venga detrás sepa cómo va y lo qué añadir.
En tu caso deberías poner:

Aresillo: 1
CaLiZzZ: 0

(esto no vale)

Estaría bien que sabiendo ahora que Chrome no se tenía en cuenta volvieras a emitir tu voto y lo hicieras como te digo.
aconsejo q edites el post principal. bueno perdon por todo ^__^
  #12 (permalink)  
Antiguo 24/11/2008, 19:28
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Sí, ya lo he hecho.

Haz tu voto y así empezamos de cero.
__________________
Visita mi nueva web idplus.org
  #13 (permalink)  
Antiguo 24/11/2008, 19:46
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Bueno, pues como soy el árbitro, dejamos el voto de sanchy como nulo y si le apetece ya volverá votar. De manera que seguimos en:

Aresillo: 0
CaLiZzZ: 0
__________________
Visita mi nueva web idplus.org
  #14 (permalink)  
Antiguo 25/11/2008, 10:40
 
Fecha de Ingreso: octubre-2008
Ubicación: Bs As
Mensajes: 128
Antigüedad: 9 años, 1 mes
Puntos: 0
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Bueno yo voto por Aresillo. Los dos hicieron algo igual pero me gusto mas el estilo de Aresillo.

Gracias, un saludo para todos
  #15 (permalink)  
Antiguo 25/11/2008, 10:46
Avatar de Aresillo
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Becerril de la Sierra
Mensajes: 958
Antigüedad: 9 años, 8 meses
Puntos: 53
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Gracias marcos... aunque recuerda que tenías que haber puesto la votación, la pongo por tí:

Aresillo: 1
CaLiZzZ: 0


A ver si vemos más movimiento por aquí...

Aresillo!!
  #16 (permalink)  
Antiguo 25/11/2008, 11:53
Avatar de talmente  
Fecha de Ingreso: noviembre-2007
Mensajes: 233
Antigüedad: 10 años
Puntos: 4
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Yo le doy mi voto a aresillo, la razón es que vista la página en lo que he podido: Firefox 3, IE 6 la de aresillo se ve en los dos navegadores. Se echa de menos que ninguno usará medidas porcentuales.

La de Calizzzz, yo en IE 6 la veo descuadrada y tiene un scroll horizontal que podía haber evitado.

En el diseño me gusta más la de Cálizzz, es más clara en parte por que ha arriesgado poco, una pena lo de IE 6, pero como decía hace unos días IE6 de momento cuenta.

Felicidades a los dos.
  #17 (permalink)  
Antiguo 25/11/2008, 11:58
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Ok Ok... entonces vamos asi:
Aresillo 2
CaLiZzZ 0


Al parecer me estoy quedando sin votos!
Muy buen trabajo el tuyo Aresillo!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #18 (permalink)  
Antiguo 25/11/2008, 12:11
Avatar de Aresillo
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Becerril de la Sierra
Mensajes: 958
Antigüedad: 9 años, 8 meses
Puntos: 53
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Gracias Talmente por tu voto...
Creo que ninguno hemos utilizado porcentajes por que somos novatos! y nos hubiera dado bastantes más quebraderos de cabeza... ya veremos en la próxima!

Saludos!
  #19 (permalink)  
Antiguo 25/11/2008, 12:15
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

En la proxima... la batalla sera mas dura!
Y ten por seguro Aresillo que como dijimos al principio... luego de esta competencia, va la revancha!

Asi que a calentar motores... porque en esta competencia no hay descansos! xD
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #20 (permalink)  
Antiguo 25/11/2008, 13:35
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Enhorabuena a los dos.
Mi impresiones y opiniones las hago un poquito por partes, para no resultar cansino, repartido en varias respuestas.

Comenzando por Aresillo, por ser el más veterano de los dos en FdW.

La sensación estética al cargar tu página es agradable, tanto por el uso de los tonos de las imágenes como por el color de texto. Se nota que te gusta el tema del diseño gráfico.

En el menú del header, al usar una imagen como fondo para las pestañas y estar el tamaño del texto definido en em, te la has "jugado". En algunos usuarios coincidirán pestaña con contenido de <li>, pero en otros no, como es mi caso con FF 3 (tengo que aumentar a 0,9em el tamaño). En ie 7 coinciden. (Sólo como información que no está comtemplado en las normas, en Ópera tampoco).

En sidebar derecho, el selector ".entradas a:hover{font-weight:bold;}" hace que alguna noticia necesite de una línea a mayores por el blod, con el efecto de desplazamiento vertical del resto de elementos. Vuelvo a decir, para mí al estar el texto definido en "em".
Así mismo, la imagen de estos <li> (arrow.gif) en los que solo ocupan una línea queda recortada en su parte inferior.

El efecto hover de las imágenes en "publicidad" se sobrepone en parte a la inferior.

En el cuerpo principal, creo que abusas de los <br /> para separar los <p>, podrías haber logrado la separacón mediante css.

El <span class="preguntas">1. ¿Qué es el KERS?</span>, hubiese encontrado más apropiado el uso de <hnº> en vez de span.

Pese a lo anterior, encuentro acertado que tanto el html como el css lo has ido colocando segun el flujo natural del documento, tabulado y respetando líneas y espacios en blanco (porque yo no soy una máquina).

Sorpresa grata el buscador de google (aunque inecesario, creo yo, pues los navegadores ya lo incorporan en su pestaña), que junto al RSS y la simulación de la nube de tags y al diseño elegido (dos columnas) hacen pensar que se está en un blog.

Creo que es un buen trabajo, y que de duelo de novatos tiene poco (por ambos).

CaLiZzZ, más tarde con tu página.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #21 (permalink)  
Antiguo 25/11/2008, 14:00
Avatar de Aresillo
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Becerril de la Sierra
Mensajes: 958
Antigüedad: 9 años, 8 meses
Puntos: 53
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Gracias Kseso por tu valoración!

Cita:
En el menú del header, al usar una imagen como fondo para las pestañas y estar el tamaño del texto definido en em, te la has "jugado". En algunos usuarios coincidirán pestaña con contenido de <li>, pero en otros no, como es mi caso con FF 3 (tengo que aumentar a 0,9em el tamaño). En ie 7 coinciden. (Sólo como información que no está comtemplado en las normas, en Ópera tampoco).
La verdad es que sabía que me la jugaba... creo que de haber sido un menú real no lo hubiera hecho así.. de echo, pensé en cambiarlo después de entregarlo pero como ya estaba entregado...

Cita:
En sidebar derecho, el selector ".entradas a:hover{font-weight:bold;}" hace que alguna noticia necesite de una línea a mayores por el blod, con el efecto de desplazamiento vertical del resto de elementos. Vuelvo a decir, para mí al estar el texto definido en "em".
A mí tb me pasa en la primera entrada... pero no le dí mayor importancia... ¿o se la tengo que dar...?

Cita:
Así mismo, la imagen de estos <li> (arrow.gif) en los que solo ocupan una línea queda recortada en su parte inferior.
A mí esto no me pasa.. esto es por la letra en em? de no ponerla así no me pasaría el hera... cual es la solución?

Cita:
El efecto hover de las imágenes en "publicidad" se sobrepone en parte a la inferior.
Esto si que ha sido... un dolor de cabeza! aunque a mi no se me superpone ni por arriba ni por abajo en FF,IE6,chrome y safari... en opera sí... ¿porqué te pasa a tí?¿alguna solución con esto Mik?

Cita:
En el cuerpo principal, creo que abusas de los <br /> para separar los <p>, podrías haber logrado la separacón mediante css.
Cómo? con span? o con qué?

Cita:
Sorpresa grata el buscador de google (aunque inecesario, creo yo, pues los navegadores ya lo incorporan en su pestaña)...
Esa parte del formulario me dió una lata que no veas... por lo menos 2 o 3 horas... entre validaciones y estructuración! Sbía que era infuncional pero la idea es que ahí va un buscador de la web... y no podía hacerlo sólo con css y html...

Cita:
...que de duelo de novatos tiene poco (por ambos).
Yo al menos, llevo un mes haciendo css... alomejor un poco menos...

Gracias de nuevo!

Aresillo!!
  #22 (permalink)  
Antiguo 25/11/2008, 14:23
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Felicidades Ares muy buen trabajo, mi voto va para ti.
me gustó tu diseño y la distribución que hiciste.

no trato de decir que el de CaliZzZ no sea bueno pero me gustó más el de Ares

es mi opinión

Felicidades a ambos
  #23 (permalink)  
Antiguo 25/11/2008, 14:25
Avatar de Aresillo
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Becerril de la Sierra
Mensajes: 958
Antigüedad: 9 años, 8 meses
Puntos: 53
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Vuelvo a poner el marcador con el voto de willyfc
Aresillo 3
CaLiZzZ 0


Aresillo!!
  #24 (permalink)  
Antiguo 25/11/2008, 17:20
Avatar de webosiris
Moderador egiptólogo
 
Fecha de Ingreso: febrero-2002
Ubicación: Luxor, Egipto
Mensajes: 10.727
Antigüedad: 15 años, 9 meses
Puntos: 997
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

primero que nada, felicidades a ambos. espero que este sea el inicio para que más usuarios se animen a competir


Limpieza y orden del código html y css
las 2 webs están muy similares en este punto, el código está muy claro en ambos casos y ambos cometieron errores similares:

Repetición de clases
Como ejemplo, en tu trabajo Calizzz, si quieres darle estilo a todos los párrafos dentro de <div id="kers">, no necesitas ponerle una clase a cada párrafo, sino que simplemente los puedes llamar así
Código css:
Ver original
  1. #kers p{}
... exactamente el mismo error se puede ver en el trabajo de Aresillo con los <span class="preguntas">

No hay comentarios en el código
Ninguno de los 2 comentó el código (ni el html ni el css). En este caso no es catastrófico porque son trabajos pequeños, pero estaría bueno que se acostumbraran a comentar por lo menos las principales secciones... más adelante nos les va a extrañar encontrarse con archivos css de 400, 500 o hasta 800 lineas, y una buena política de documentación les puede salvar el día.

Cuidado con el ancho total!!!
Calizzz, le distes una ancho fijo de 1200px al header y 1100px al contenido, pero mucho cuidado, no todos tenemos pantallas de 1440! De hecho más de la mitad de los internautas usa una resolución de 1024x768 así que la gran mayoría va a ver tu sitio con scroll horizontal.
Aresillo, tu usastes 1000px de ancho, así que lo siguiente va para ambos... si van a usar anchos fijos, no se vayan más allá de los 980px... ya que aunque se use 1024, la barra de desplazamiento, menus, borde de pantalla, etc, comen espacio por lo que hay que dejar un margen para no pasarse

Calizzz: No usastes propiedades abreviadas en el css
en vez de poner margin-top, margin-right, margin-bottom y margin-left, puedes usar la propiedad abreviada margin, seguida de los 4 valores... así en vez de 3 o 4 líneas, usas 1 sola. Ejemplo:
Código css:
Ver original
  1. .subtitle {margin:20px 0 0 20px}
(el orden de los valores es horario empezando con top); lo mismo para el padding y el background, que tambien tiene una propiedad abreviada.

Calizzz: No indentastes el html
solo indentastes los LI, pero con 2 espacios (cuando se indenta es mucho mejor usar el TAB). Además las lineas las veo con muchos saltos de carro entre medio, posiblemente debido al editor que usastes... con que programa trabajas?

Aresillo: Uso de BR para separar párrafos
como dice kseso, debistes usar css (margin por ejemplo) si querias separar los párrafos entre si y no separarlos "a la fuerza" con br

Aresillo: Label vacios
los label vaciós no tienen mucho sentido que esten ya que no aportan nada... o les pones texto y los ocultas con css, o directamente sobran.
Además el botón del formulario se me ve en una segunda linea, no queda al lado de la caja de búsqueda, pero eso se soluciona reduciendo el margin-left del input tex de 29 a 28px.

Aresillo: el fondo del menu
no voy a profundizar en esto porque ya lo explicastes, pero así como lo hicistes hace que pierdas toda la flexibilidad que te da el css.

Aresillo: font-weight:bold en el :hover
a mi personalmente se me hace molesto que la fuente cambie de tamaño en el hover, porque eso hace que en algunos casos el texto ocupe más lineas que en su estado normal, porque en bold la fuente se hace más gorda y por lo tanto ocupa más espacio

Aresillo: Efecto lupa en publicidad
un buen desafío técnico llevado a la práctica con bastante buen efecto (efectivamente el hover se solapa y tapa la publi que le sigue, pero no me parece que quede del todo mal)


Diseño
En este campo creo que el trabajo de Aresillo estuvo más completo, incluso con un trabajo de logo bastante desarrollado... el agregado de los elementos extra le da una mayor sensación de "página real"


Semántica
Es lógico que en este apartado haya algunas erratas, pero en líneas generales el trabajo fue muy bueno y si consideramos que se autodenominan novatos, diría que excelente. Ninguno de los 2 sufrió de divitis y usaron correctamente las listas desordenadas para menu. Además ninguno uso tablas para maquetar (me quedé con las ganas de ver algun dato tabular, eso si). Los ddetalles que noté:

Orden de los Hx
Otro error que vi en los 2 trabajos, ambos usan el elemento H3 sin haber usado el elemento H2 antes... un orden correcto podría ser h1-> h2-> h3-> h3-> h4-> h2 pero no h1-> -h3-> h4-> h2

Para resolver este problema, lo mejor cuando duden es pensar "el elemento que tengo enfrente, está relacionado y depende del Hx anterior o no tiene nada que ver?"
Viendo el trabajo de Aresillo por ej... vemos que el título del artículo es H1 y el título "entradas recientes", es un H2. ¿las entradas recientes son un subtítulo del artículo, estan dentro de su contenido, o no tienen mayor relación?
No tienen relación... por lo tanto no pueden ser de un orden menor al título del artículo.

Con ese mismo ejemplo vemos que el título de la página (Mecánica F1) es un H1, y el título del artículo también es un H1... a mi me parece que el título de la página tiene mayor importancia que el título del artículo, por lo que el artículo en definitiva tiene que ir en un orden inferior.. además pusistes la fecha como h3, cuando a mi criterio no sería h3 sino un simple párrafo.

Marcado de las preguntas: no solo existen listas desordenadas
ambos tuvieron ciertos problemas con el marcado de la información principal (las 6 preguntas/respuestas) ya que para las preguntas creo que podrían haber usado Hx o (más que nada en el caso de Calizzz) listas de definición
Aresillo, si querías llevar la atención al orden de las preguntas, podrías haber usado una lista ordenada (OL -> LI)

Calizzz: Citas
Es lógico que no lo conozcas y por eso usastes un div, pero existe un elemento especialmente pensado para marcar citas, el blockquote


CONCLUSIÓN
Ambos estuvieron muy muy bien, si son novatos no se notó para nada! Felicidades. sin embargo en esta ocasión mi voto (que es simplemente anecdótico, creo que lo importante es lo de arriba) va a Aresillo, por haber trabajado más detalles y haberse arriesgado a usar técnicas css más llamativas y complicadas, pero el trabajo de Calizzz también esta muy bueno

Aresillo 4
CaLiZzZ 0
__________________
Pasamos tus PSD a HTML

Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. -
  #25 (permalink)  
Antiguo 25/11/2008, 17:28
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Buen análisis y realmente didáctico, que era lo que se buscaba. A tomar nota (todos, no sólo vosotros dos )
__________________
Visita mi nueva web idplus.org
  #26 (permalink)  
Antiguo 25/11/2008, 17:33
Avatar de Aresillo
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Becerril de la Sierra
Mensajes: 958
Antigüedad: 9 años, 8 meses
Puntos: 53
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Muchísimas gracias Webosiris!

Se me está ocurriendo modificar las características de la modalidad...
Se trata básicamente de que cuando acaben las votaciones y sugerencias, haya otro tiempo de reestructuración y mejora de las webs... de esta forma se convierte en un duelo educativo como tal porque podemos implementar lo fallos que se propone...
En esta fase. estaría bien que fuera trabajo individual pero a la vez de dudas y preguntas...

¿Qué os parece?

Así quedarían la webs finiquitadas y sería un opensource limpio y claro para los demás...

Aresillo!!
  #27 (permalink)  
Antiguo 26/11/2008, 01:32
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Cita:
Estaría muy bien que mucha gente (y sobre todo los "notables" ), os animárais a dar vuestra opinión,
No se si tenga lo necesario para ser de los notables, pero aquí estoy de cualquier modo.

Bueno, espero no repetir lo que ya se dijo ya que no he leído todos los comentarios.

HTML
Ambos casos están organizados, aun que me gusta mas el de Calizzz. Lo encuentro más sencillo y fácil de leer. He analizado usando Firebug, por si alguien quisiera saberlo. Sin embargo si encuentro algunos problemas:

Aresillo
-Usas mucho <br />. De forma excesiva diría yo. No lo hagas, eso es basura que estás metiendo en tu código.

-Te falta espacio entre la diagonal y el elemento que estás cerrando, por ejemplo <img/> cuando debería ser <img /> Eso no te causa fallo en la validación, pero te puede confundir navegadores antiguos.

-Te sugiero que uses width y height en las imágenes. Muchos te dirán que eso va en contra de las normas por que son propiedades para controlar la presentación y eso debe hacerse con CSS, pero no lo son. Son propiedades que el navegador necesita saber para no causar ese efecto de movimiento mientras se carga la pagina que se ve en muchos sitios. Un acomodo y desacomodo total mientras se carga. Al usar width y height el navegador sabe el espacio que tiene que dejar y acomoda los elementos sin que estos se estén moviendo. De esa manera el usuario puede empezar a leer el contenido aun cuando las imágenes no se han cargado.

-El efecto lupa lo pudiste lograr usando solo una imagen y no un span con una imagen.

-El div con id="tags" no es necesario. Puedes lograr el mismo efecto sin ese div.

Calizzz
Tu código está muy limpio y eso me gusta. No he encontrado problemas con el código en si, pero si con la semántica, ya pasaremos a eso en un rato.

CSS

Aresillo
-Haces buen uso de em y de las familias de puntos, eso es un punto a tu favor.

-Cometiste el error de usar imágenes como fondo para los menús. Eso te esta causando problemas en la forma en que se ven los elementos en ciertos navegadores.

-Te sugiero que trates de usar menos CSS. Tienes demasiado para lo que haces con el.

Calizz
-No estas usando una familia de fuentes y no me refiero a font-family, sino a una familia generica como serif, eso puede afectar la forma en que se ve tu web en distintos ordenadores aun usando el mismo navegador.

-Usas un width demasiado ancho para tus elementos contenedores, eso te está causando un molesto scroll horizontal. Intenta bajar el tamaño aun que sea uno 250px.

-Estas usando cm como medida en algunos elementos, eso te puede dar problemas dependiendo de la resolución y tamaño del monitor. cm es para medios impresos.

-Te recomiendo que uses shortland para los colores. Por ejemplo, #666 en lugar de #666666. Eso te ahorra algunos números y es mas fácil de leer.

Accesibilidad
Ambos usan acceskey, eso les suma un punto.

Aresillo
-tiene un punto extra por el uso de title y otro por el de alt.

-Cometiste el error de esconder el H1 de la cabecera. No tiene sentido que lo pongas si después lo vas a esconder como lo has hecho. Una forma un poco mas eficaz es desplazándolo usando por ejemplo text-indent. Pero aun así te puede causar problemas.

-Asegúrate de que tu web se vea bien aun cuando el usuario hace zoom 3 veces, mas de eso ya no hay problema, pero es sugerencia que la web se vea bien hasta los 3 zooms.

Calizzz
-El h1 en tu cabecera no se ve si las imágenes están desactivadas o inaccesibles.

-Categorías se pone por encima de frase del día cuando hace el tercer zoom. El mismo consejo que a Aresillo, asegúrate que se vea bien cuando menos con 3 zooms

-Te falta usar title, no es un gran problema, pero es mejor si lo usas. De esa forma puedes darle al usuario una mejor idea de hacia a donde lo dirige el enlace.

Diseño

En cuanto al diseño me inclino mas por el de Calizzz, el de Aresillo lo veo un poco desordenado y en algunas cosas, como el RSS, no mantiene el mismo estilo. Como que no se mantiene paralelo. Po otro lado el de Calizzz, aun que algo grande, es lipio y te invita más a leer el contenido. Ademas la cabecerá, aun que sin un elaborado logo como el de Aresillo, es atractiva y cumple su objetivo.

Semantica


Creo que ambos necesitan trabajar más en la semántica. Ni uno uso listas de definición que es lo que semanticamente se habría usado para las preguntas y respuestas. Traten de usar ids y clases mas descriptivos y apropiados, que describan el contenido y no la presentación del elemento al que representan.


Sin duda la competencia no parece de novatos. Ambos han hecho un gran trabajo y creo que ambos merecen el punto. Sin embargo, el hecho de que la web de calizzz se tenga que arreglar para poder ser vista correctamente devido a su excesivo tamaño no me deja otra opción y como hay solo un punto, me veo obligado a dárselo a Aresillo.


Aresillo: 5
Caliz: 0
  #28 (permalink)  
Antiguo 26/11/2008, 03:36
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Buen trabajo, buzu: te has tomado tu tiempo y has ofrecido algunas cosas interesantes.

Tened en cuenta que ha sido un poco exigente, y que por ejemplo todo se mantenga bien con 3 aumentos, hay miles y miles de webs profesionales que se destrozan con sólo 2 aumentos, y aunque es una de las últimas cosas en las que piensan los diseñadores, es algo bueno a recordar para próximos diseños. A la libreta
__________________
Visita mi nueva web idplus.org
  #29 (permalink)  
Antiguo 26/11/2008, 03:49
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

No, a mi se me destroza con tres aumentos mikmoro, aun que claro, eso no es gran problema considerando el tamaño de la letra en que ambas web tiene por default. Quien necesite tres aumentos es por que de veras tiene graves problemas jajaja... En cuanto a que si me tome mi tiempo, valla, hasta tengo una libreta en la que hice anotaciones y todo. Quise poder aportar algo, aun que creo que cosas ya se habían aportado. debí leer antes para ser menos redundante en ciertos aspectos. Pero bueno ahí le dejo y que siga la competencia. Espero ver mas comentarios, hasta ahora todos han aportado muy buenos puntos.

PD. Yo quiero participar en una para ver que tal ando. No es lo mismo pensar que lo haces bien a tener algunos cuantos revisando y valorando tu trabajo.
  #30 (permalink)  
Antiguo 26/11/2008, 11:38
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Votaciones Duelo Aresillo vs. CaLiZzZ

Woow... de verdad que si es educativa la critica... Duele mucho el saber que llevamos un punteo de 5 a 0... eso me pone triste, pero me alienta a que en la revancha sere mucho mas exigente con mi propia web y dare la buena batalla para la proxima...

Se que faltan muchas votaciones y aun espero que alguien apueste a mi web! xD

Como dije arriba Felicidades Aresillo! parece que los tienes a todos enamorados con tu web!

Saludos!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 13:28.