HTML5 Mini Template

Un buen artículo en el que nos explican cómo pasar nuestro diseño a diseño web 2.0. Claro, cada cual tiene sus gustos y sus conceptos de diseño y puede que no esté de acuerdo con todo lo que se dice, pero aún así es un artículo a tener en cuenta.

Resumiendo un poco el post, nos encontramos con los siguientes consejos:

• Simplicidad: cuanto más sencillo mejor, es necesario tener en cuenta que todos los sitios webs tienen sus metas y que cada página tiene su propósito. Es necesario obtener la atención del usuario, pero cuidado que su atención es algo que se acaba. La simplicidad es algo que siempre deberíamos tener en cuenta, elimininando contenido innecesario pero sin quitar funcionalidad.
• Layout centrado: muy característico de la web 2.0 es tener en contenido centrado en la página.
• Menos columnas: mientras que antes lo normal era un diseño en 4 columnas, ahora lo más utilizado son las dos columnas, evitando así llenar completamente la pantalla y reforzando el primer punto, la simplicidad.
• Navegación arriba: separar la navegación del contenido principal no es nada nuevo, pero en este caso se resalta que se situe arriba.
• Diferenciar distintas áreas: que a simple vista, cada área con diferente funcionalidad sea claramente diferenciable, incluso sin ser resaltadas con diferentes colores.
• Navegación sencilla: debemos conseguir que el usuario sepa dónde está y a qué contenidos puede acceder desde donde está.
• Logos en negrita: limpios, en negrita y fuertemente marcados.
• Tamaño de texto grande: haciendo el texto grande se consigue mayor atención que con el texto pequeño.
• Introducciones en negrita: consiguiendo así mayor impacto visual sobre las cosas más importantes.
• Colores fuertes: usando colores brillantes y fuertes se consigue una separación de contenidos más sencilla.
• Superficies con detalle: ya sea mediante sombras, resaltados, difuminados, que las superficies no sean simples, sino más realistas.
• Gradientes
• Reflejos
• Iconos atractivos: es necesario que sean fácilmente reconocibles, que no provoquen confusión.
• Contornos estrellados: sobre todo con el beta dentro.

Web 2.0 how-to design style guide

Vía / dzone