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

Desafío en CSS + XHTML: hereje

Estas en el tema de Desafío en CSS + XHTML: hereje en el foro de Competencias CSS en Foros del Web. Desafío lanzado desde este tema http://www.forosdelweb.com/showthread.php?t=362325 Propuesta de hereje http://www.tunait.com/css/hereje/hereje.html Sus comentarios sobre esta propuesta pueden dejarlos aquí. Saludos...
  #1 (permalink)  
Antiguo 08/02/2006, 16:30
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
Desafío en CSS + XHTML: hereje

Desafío lanzado desde este tema http://www.forosdelweb.com/f95/competencia-desaf-css-xhtml-362325/

Propuesta de hereje
http://www.tunait.com/css/hereje/hereje.html

Sus comentarios sobre esta propuesta pueden dejarlos aquí.

Saludos
  #2 (permalink)  
Antiguo 08/02/2006, 17:30
Avatar de Hereje  
Fecha de Ingreso: junio-2002
Ubicación: Córdoba, Argentina
Mensajes: 439
Antigüedad: 15 años, 6 meses
Puntos: 2
Hola a todos !!

Bueno, este es mi trabajo, espero puedan darme críticas constructivas que las recibiré con respeto, siempre tratando de cumplir con el objetivo de esta competencia que es APRENDER.

Seguramente cada uno de los participantes hicieron sus trabajos basandose en sus gustos y experencias personales al navegar por la web. También así se deben haber adaptado a las preferencias de sus configuraciones en su sistema operativo y explorador. Yo así lo hice, entonces decidí diseñar un sitio que sea "líquido", de buena vista y lectura en resoluciones grandes (1280, como yo utilizo) pero sin descuidar las otras resoluciones. También utilizo Firefox (se vé mejor en él) y las tipografias se ven mejor con redondeado ClearType.

La maquetación en realidad es de dos columnas, a la izquierda el menú y otras opciones que formarian parte de la plantilla ( en todas la páginas ) y a la derecha el contenido. A su vez, el contenido de la página de inico la dividí en dos columnas, en las cuales en la parte superior elegí poner editorial (a la derecha flota la lista de secciones editoriales para encontrarlas rápidamente) y en la derecha las notas de actualidad. Abajo quedaron los contenidos menos importantes.

El tema de la publicidad la coloqué junto con el pie de página para no sacrificar el diseño de arriba. De todas formas no me pareció mala idea, ya que queda llamativa de igual forma y, al no ser un espacio tradicional para publicidades, no pasa desapercibida.

Comentarios técnicos: como las bases del concurso lo dicen, utilicé XHTML 1.0 Estricto para la estructura y CSS para el diseño. El CSS esta dividido en dos, la plantilla para todas las paginas por un lado y el contenido específico de la sección en otra, para lograr tener organizado los estilos en difefrentes archivos y no todo en uno solo. En cuanto a Accesibilidad, cumple con el nivel A (con sólo algunos cambios pasaria a ser doble-A).

También como algunos de los colegas, yo en realidad soy desarrollador de aplicaciones web en asp, asp.net y php, y me fui metiendo en el diseño de a poquito, asi que seguro me falta mucho por aprender, y por eso la participación aquí.

Me gustó mucho la idea de la competencia, espero la proxima vez seamos más y podamos organizar la forma de aprender, los conocimientos adquiridos, etc. para que sea mas efectiva. También ver el tema de la difusión y más tiempo para preever las decisiones.

Saludos a todos!
__________________
Sergio

Última edición por Hereje; 08/02/2006 a las 19:04
  #3 (permalink)  
Antiguo 08/02/2006, 17:47
Avatar de RoQ
RoQ
 
Fecha de Ingreso: abril-2005
Mensajes: 771
Antigüedad: 12 años, 7 meses
Puntos: 0
me encanto ese diseño a 4 columnas
y el diseño tambien esta genial, le voy a dar una buena chequeada a tu CSS, la verdad que no se cual me gusta mas si este o el de fullmental
  #4 (permalink)  
Antiguo 08/02/2006, 18:12
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
sin desmerecer a los otros participantes, creo que este es la mejor propuesta (junto con la de kahlito )

Pegas: en 800 x 600 a 4 columnas como que no se si queda bien...
__________________
Pasamos tus PSD a HTML

Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. -

Última edición por webosiris; 08/02/2006 a las 18:20
  #5 (permalink)  
Antiguo 08/02/2006, 18:18
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
la verdad es que es el que se le nota más trabajo, tiene una estética bastante uniforme e interesante. Bravo hereje .

sin embargo me parece que le deja demasiado poco espacio al contenido de la página.....

creo que se gana el 1º lugar.....

(espero al menos quedar 2º )


Saludos.
  #6 (permalink)  
Antiguo 08/02/2006, 18:33
Avatar de Hereje  
Fecha de Ingreso: junio-2002
Ubicación: Córdoba, Argentina
Mensajes: 439
Antigüedad: 15 años, 6 meses
Puntos: 2
Muchas gracias a todos por los comentarios y la buena onda!

Con respecto a lo que dice alvlin, sobre lo de poco espacio al contenido, es relativo explícitamente. Ésto es debido a que justamente ése es el bloque que se "estira" y se "contrae" según el tamaño de la ventana. Es cierto que podria haberle dado un ancho mínimo, pues lo tiene, pero está ajustado para la resolución 640.

De todas formas tendré en cuenta el detalle para el futuro. Muchas gracias!

Saludos!
__________________
Sergio
  #7 (permalink)  
Antiguo 08/02/2006, 18:33
Avatar de ramm  
Fecha de Ingreso: junio-2004
Ubicación: Guadalajara
Mensajes: 207
Antigüedad: 13 años, 5 meses
Puntos: 0


De verdad, entre todos este fue el que me gusto más también. El contenido se ve bien organizado, se encuentra todo fácilmente, y la combinación de colores esta muy buena, fácil de leer y no molesta.

Críticas:
-Echo en falta un poco de fuerza en el tope de la página, no es que se ve amal, pero se me hace un poco débil. Quizás era solo cuestión de agrandar los títulos, o de separarlos con otro color.
-La columna de "Secciones Editoriales" y "Popular en Editorial" creo que necesitaria algo que la "separe" del resto, quizas una línea vertical a los lados, on leve cambio al color de fondo...algo asi.
-El color de los vínculos de las columnas a la derecha, me llama mas la atención que la parte del editorial, no se si estoy mal, pero yo hubiera dado más importancia al editorial.
-Se ve un poco ahogado, creo que le faltaría un poco mas de aire. De hecho, si separaras un poco las entradas del editorial, al alargarse hacia abajo, podrías meter los "Sitios Amigos" y las "Reuniones y Eventos" en la primera columna (la izquierda), ya que no son tantos, así no quedaban un poco "desubicados" como están ahorita.

Anyway, este es solo mi criterio, de resto me parece un trabajo excelente, incluso no dudaría en usarlo (con las respectivas correcciones) en MDW, que ya le hace falta el cambio.

Good Job!!!
  #8 (permalink)  
Antiguo 08/02/2006, 19:01
Avatar de Hereje  
Fecha de Ingreso: junio-2002
Ubicación: Córdoba, Argentina
Mensajes: 439
Antigüedad: 15 años, 6 meses
Puntos: 2
Muchas gracias por tu tiempo ramm.

Estoy de acuerdo con algunas de tus críticas, las tendré en cuenta para el futuro.

Saludos!
__________________
Sergio
  #9 (permalink)  
Antiguo 08/02/2006, 19:41
Avatar de fullmental  
Fecha de Ingreso: octubre-2004
Ubicación: México DF, Xochimilco
Mensajes: 593
Antigüedad: 13 años, 1 mes
Puntos: 3


felicidades!!! me gusto bastante esta diagramación "liquida"... se nota que es la mas trabajada de las propuestas.

creo que todo esta en su debido lugar y tiene el peso necesario segun la relevancia, los colores son armónicos y quedan bien en conjunto. sólo me queda una duda: el patrocinador estará de acuerdo con el banner hasta allá abajo???
jeje en fin todo lo de mas me gusto mucho.
  #10 (permalink)  
Antiguo 09/02/2006, 01:45
Avatar de Hereje  
Fecha de Ingreso: junio-2002
Ubicación: Córdoba, Argentina
Mensajes: 439
Antigüedad: 15 años, 6 meses
Puntos: 2
fullmental, pensé bastante con el tema del banner, al final decidí que esta es mi propuesta y deberia hacer las cosas como ami me parecen con este tipo de decisiones triviales. De todas formas, armar un encabezado alternativo con el banner arriba no tardaria mucho, pero en realidad, estoy cansadisimo de los banner arriba, ya cae pesado (por lo frecuente), por lo menos eso siento cada vez que veo uno, los ignoro totalmente.

Saludos! Mañana prometo comentar cada uno de los trabajos, es que les quiero dedicar el tiempo que se merecen.
__________________
Sergio
  #11 (permalink)  
Antiguo 09/02/2006, 03:53
Avatar de kazafun  
Fecha de Ingreso: diciembre-2003
Ubicación: Elda
Mensajes: 843
Antigüedad: 14 años
Puntos: 13
Muy bueno!
Esas 4 columnas se salen de lo habitual, me encanta la combinacion de colores y la tipografia es muy facil de leer.
Es el tipico diseño que de un primer momento asusta ( letras por todos lados ) pero que luego se te hace imprescindible.

Aguanta muy bien cuando reduces la resolucion.

Gran trabajo!
  #12 (permalink)  
Antiguo 10/02/2006, 05:10
Avatar de kahlito
Colaborador
 
Fecha de Ingreso: marzo-2003
Ubicación: En el Estrecho y el mar
Mensajes: 2.893
Antigüedad: 14 años, 9 meses
Puntos: 60
Hola a todos.

Hereje, este es el que más me ha gustado, el estilo a 4 columnas tambien ha sido mi propuesta, con la única diferencia de que al final la 3 columna la dejé con una imagen ya que lo veia todo muy saturado en contenido, de ahí la única pequeña pega que le veo a tu diseño que la información de la zona derecha se hace un poco seguida y monótona, aún así te ha quedado bastante legible. Personalmente le hubiese puesto a tu columna 3 ( Secciones editoriales y popular en el Editorial) un fondo de otro color para así diferenciar aun más las zonas.

En general se nota que es un trabajo muy bien realizado, muy bueno felicidades
  #13 (permalink)  
Antiguo 10/02/2006, 08:37
Avatar de kemie  
Fecha de Ingreso: junio-2003
Ubicación: estocolmo<-->mexico
Mensajes: 1.627
Antigüedad: 14 años, 5 meses
Puntos: 1
Me encanta la sencillez del diseño. minimalismo bien hecho. muy legible.

sufre de una div-itis un poco extraña por ahi...( <div class="dis0"><div class="dis1"><div class="dis2"><div class="dis3"><div class="dis4"><div class="dis5">)
__________________
::::::::::::::::::::::::::::: WebHostNinja | diseñorama.com::::::::::::::::::::::::::::::
  #14 (permalink)  
Antiguo 10/02/2006, 08:46
Avatar de jesusbet
(Desactivado)
 
Fecha de Ingreso: mayo-2004
Ubicación: Monterrey, MX
Mensajes: 2.667
Antigüedad: 13 años, 7 meses
Puntos: 2
sip, muy bonito, legible, claro, excelente.

Pero quitándole las hojas de estilo, el contenido principal queda debajo del contenido del sidebar :s
  #15 (permalink)  
Antiguo 10/02/2006, 10:31
Avatar de Hereje  
Fecha de Ingreso: junio-2002
Ubicación: Córdoba, Argentina
Mensajes: 439
Antigüedad: 15 años, 6 meses
Puntos: 2
Hola kemie, esa "div-itis" se debe a los bordes redondeados (primero era flexible la botonera), y no los pude pulir por falta de tiempo. Mientras diseñaba, la maquetación sufrió bastantes cambios radicales y éstos son los resultados, por ahi se me pasaron varias cosas, también en las hojas de estilos.

Saludos!

Editado: por cierto kemie, ¿a qué se debe tu ausencia en este evento?
__________________
Sergio

Última edición por Hereje; 10/02/2006 a las 10:49
  #16 (permalink)  
Antiguo 11/02/2006, 10:16
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Hola:

Enhorabuena. Uno de los trabajos más agradables a la vista... me gustó la combinación de colores, y es una que no se descuadra con los cambios de tamaños de la ventana del explorador.

Felicidades
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #17 (permalink)  
Antiguo 11/02/2006, 13:09
 
Fecha de Ingreso: octubre-2005
Mensajes: 536
Antigüedad: 12 años, 1 mes
Puntos: 1
Hola a todos hola hereje.

Enhorabuena.

Visualmente, tu propuesta es me ha encantado.

1- la ausencia de cabecera: los contenidos empiezan arriba.

2- la liquidez: los contenidos empiezan arriba y lo ocupan todo.

3- el banner abajo: sí señor.

4- los colores: azul a los lados, verde en el centro, puntos naranja envolviendo...
  #18 (permalink)  
Antiguo 28/02/2006, 05:21
Avatar de metacortex
Viejo demente
 
Fecha de Ingreso: junio-2004
Ubicación: Caracas - Venezuela
Mensajes: 9.020
Antigüedad: 13 años, 6 meses
Puntos: 832
Otro de los mejores trabajos que he visto hasta ahora. No me atrevo a decir que es el mejor hasta no verlos todos. Qué buen dominio del CSS. También del equilibrio del color, el uso de fondos, tamaño de fuentes. Un código fuente muy bien comentado, entendible, al igual que la hoja de estilos. Buen trabajo Hereje, te felicito de veras.

Observaciones: Por la jerarquía del bloque, las Notas de Actualidad debieron tomar el lugar de Secciones Editoriales y viceversa, ya que supuestamente representan datos dinámicos de artículos, mientras que los otros son links fijos que pueden ocupar una posición menos relevante. Muchos de los enlaces podrían haber sido resumidos en un formulario o menú desplegable. La publicidad no se encuentra en un lugar privilegiado sino en el pie de la página.

Saludos.
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




La zona horaria es GMT -6. Ahora son las 11:41.