DE MI....

DE MI....

FANTASIA

TU IMAGINACION ES TU FANTASIA, COMPARTELA...

miércoles, 24 de noviembre de 2010

DISEÑOS

 Esta página web personal trata de ser como una gran academia virtual, con muchísimos apuntes además de un blog. No me gusta innovar en algo que ya está desarrollado, por eso yo en esta página no quiero crear lo que ya existe. Por eso siempre estoy buscando información y fijándome en los diseños de las páginas web que visito. Siempre estoy cogiendo cosas de aqui y de allá. En esa búsqueda he llegado a esta página: Current Style in Web, la cual os traduzco porque me parece muy interesante lo que dice. Trata de las páginas webs que tienen excelentes diseños. Hay muchas ideas que podéis utilizar para llegar a ser un gran webmaster.
El estudio se llevó a cabo eligiendo 12 páginas webs con buenos diseños y luego se explica el porqué de la elección y que puntos buenos, diseñalmente hablando, tienen. Las páginas son estas: Avalonstar, Sirruf, Plaxo, emaginacion9rules, LinkedIn 31Three, Icon BuffetMozillaSquarespace, Iomega y Wishingline. El autor del artículo dice que "No estoy diciendo que estas sean las mejores páginas web, solo que ellas son tipicas del diseño de hoy en día".
Reflection from Iomega.com  Fade from 31Three.com Reflection from sirruf.com Drop shadow on squarespace.com Drop shadow on Iconbuffet.com
Flash from emaginacion Flash from 31three Flash from www.folieto.at Flash from www.bmf.jugem.cc Flash from sirruf.com 

Características Comunes

Las páginas web escritas arriba comparten las siguientes características de diseño:
  • Disposición simple
  • Efectos en 3D, usado escasamente
  • Fondo suave, colores de fondo neutros
  • Colores fuertes, usados escasamente
  • Iconos lindos, usados escasamente
  • Un montón de espacio en blanco
  • Bonito texto grande
Ahora vamos a ver estas características una a una.

Disposición simple

Parece que estamos viendo más simples diseños de 1 o 2 columnas que en años anteriores. En la selección que hicimos:
El sentimiento general es que esos diseñadores generalmente están de acuerdo en que las páginas simples trabajan mejor. 

Efectos en 3D, usados escasamente

Cada una de las páginas de la sección usan gradientes sutiles, para dar a las barras un ligera redondez, creando un sensación suave en el fondo, o para hacer que el icono permaneza destacado y gotas sombra sutiles.
Reflejos y atenuaciones estan muy presentes. Gotas-sombras son todavía usadas, pero con cuidado.
Reflection from Iomega.com  Fade from 31Three.com Reflection from sirruf.com Drop shadow on squarespace.com Drop shadow on Iconbuffet.com
Los flashes redondos de la marca registrada están por todas partes.
Flash from emaginacion Flash from 31three Flash from www.folieto.at Flash from www.bmf.jugem.cc Flash from sirruf.com 

Fondo suave, colores de fondo neutros

Todas las páginas de la selección tienen un fondo plano, el más popular sigue siendo el blanco y un gradiente de escala de grises. Esto da un estupendo, neutral, fondo sobre el cual se puede dibujar con colores fuertes para guiar el ojo a lo que interesa.
Excepciones son emaginacion la cual usa el popular blanco a cielo azul gradiente, y squarespace el cual tiene como fondo colores de la tierra firme.

Colores fuertes, usados escasamente

Un fondo suave, un fondo estilizado es una perfecta base para añadir características que capten la atención del ojo. Colores fuertes y contraste de tonos son importantes para conducir al ojo a los elementos más importantes de la página.
 Strong colour from 31Three.com Strong colour from LinkedIn.com Strong colour from Patrickhaney.com Strong colour from Stonewall.co.za Strong colour from Iconbuffet.com
Iomega usa más colores fuertes que otras páginas de la selección, con una intensa roja oscura área de promoción. No obstante esto "no ahoga" el resto de la página, porque el color es constante y simple en forma.

Lindos iconos, usados escasamente

Hay un tema aqui: No uses demasiados atractivos elementos en el misma página, el ojo se pierde atención al haber tantos detalles.
Como los colores fuertes y los efectos en 3D, los iconos y los botones atractivos pueden añadir un poco de poder para auyudar a dar a la página una más alta calidad. Pero si se usan demasiado, harán el efecto contrario, estorbando la página y confundiendo al usuario que la lee.
Cute icon from Patrickhaney.com  Cute icon from Iconbuffet.com Cute icon from Plaxo.com Cute icon from 31Three.com 

Montón de espacio en blanco

Hoy en día los diseños de las páginas web son frescos, parecen como si estuvieran en un profundo respiro. El ojo necesita espacio para poder ver clara y limpiamente las cosas. Es muy raro que mire una página y piensa "Dios, realmente necesitaban abarrotar la página con tantas cosas". Es estupendo ver muchos diseños usando margenes generosos y dejando espacio entre los elementos, y una extra-linea de altura para ayudar a la lectura de la página. 
Mirar estos estupendos y refrescantes espacios en blanco!
White space on LinkedIn White space on Mozilla 

Estupendo gran texto

No estoy diciendo que el texto en tu página web debería ser en tamaño grande. De hecho, en algunos escenarios, pequeños textos son estupendos. Lo que estos buenos diseños muestran es:

Haz el texto más importante de la página en un tamaño más grande que el texto normal

Asi como otras técnicas que hemos visto, esto trabaja usado en moderación. Si todo el texto es grande, luego nada de tu texto es grande.
Usa texto grande para ayudar a tu visitante a ver rápidamente de que trata la página, que es lo más importante, y guialos para encontrar lo que realmente es importante.

No hay comentarios:

Publicar un comentario