Entendido.

Este sitio utiliza cookies para analizar la navegación. Si continúa navegando se entiende que acepta su uso. Ver más detalles.";

Logo

Aprende Web

Crea y diseña tus sitios en la Web.

Complementos

Manuales necesarios para el desarrollo web distintos de la programación.


Y ahora tambien aprende a programar en C++ con Aprende Web C++

logo rss RSS. Suscribir canal.

Buscar en Aprende Web

Traducir página

Visita nuestro blog:

bolg.aprende-web.net

y entérate de las novedades o deja un comentario.

Dudas y sugerencias:

aprendeweb@aprende-web.net





Sobre ésta página

Ültima modificación: 29-01-2016.

Visitas este mes: 135

Visitas el mes pasado: 193

logo
WEB-GRAFÍA

Mi agradecimiento a los siguientes sitios en los que me he basado para la elaboración de esta sección:

Diseño web
Wikipedia
Curso práctrico de diseño web
Desarrollo Web
Breve guía para iniciarse en el diseño web.
La webera.es
Diseño de páginas Web
www.um - Francisco Hurtado - pdf.
Diseñando sitios amigables para el IPhone
Maestros del Web

Donativos

Si este sitio te parece interesante puedes contribuir con una pequeña aportación.




Diseño de páginas (II)

Principios del diseño

Finalidad del diseño

diseño web

Como ya se dijo en la página anterior la finalidad del diseño web es conseguir que las páginas que hagamos sean útiles y atractivas, es decir marcamos como claves de un buen diseño la funcionalidad y la estética.

En principio podemos pensar que para conseguir ésto nos basta con el sentido común y el buen gusto. Sin embargo, no está de más tener en cuenta una serie de principios y de técnicas que pueden ayudarnos a construir mejor nuestra página. Por supuesto no debemos dejar de lado el sentido común y el buen gusto, y la finalidad de todo diseño web: crear una página útil y atractiva.

Empezaremos por los principios del diseño web. estos indican la manera en que debe estar esructurada la página y son : balance, contraste, énfasis, ritmo o repetición, y unidad o proximidad.


Balance

Por balance se entiende un cierto equilibrio entre los distintos elementos que componen la página. Las distintas zonas de la página (cabeceras, menús, textos, imágenes, zonas oscuras y claras, elementos grandes o pequeños, etc) deben estar distribuídos de forma que haya un cierto equilibrio entre ellos, sin que la página se vea descompensada en la distribución de sus elementos.

Mediante el balance podemos también hacer que se destaquen más unos elementos que otros, dependiendo de la posición en que estén y el equilibrio que guarden en la página.

El balance en una página web se consigue mediante simetrías, es decir la página estará más o menos equilibrada o descompensada, dependiendo del tipo de simetrías o asimetrías que utilicemos. Distinguimos así tres tipos de balance:


Contraste

El contraste es la diferencia que existe entre dos o más elementos relacionados. Podemos tener un mayor o menor contraste entre los elementos dependiendo de si éstos tienen mayores o menores diferencias. Depende del efecto buscado pondremos un mayor o menor contraste entre los elementos. Podemos tener varios tipos de contraste:

Circulo cromático
Contraste de color

Dependiendo de los colores que usemos, unos elementos resaltarán más que otros, los colores vivos y fuertes resaltan más que los colores apagados o tonos pastel.

Por otra parte los colores contrastarán más cuanto más alejados estén en el circulo cromático. Así los colores fríos contrastan con los colores cálidos, y cada color tendrá su máximo contraste en su color opuesto o complementario.

Especial importancia en el contraste tienen los textos, los cuales deben contrastar nítidamente con el fondo para una fácil lectura. Lo más usado suele ser el texto negro sobre fondo blanco, por tener uno de los mayores contrastes.

Contraste de contorno

Los contornos irregulares o abstractos atraen más la atención que los contornos simétricos. Colocar un elemento con contorno irregular requiere el uso de imágenes, ya que todos los elementos en la web son de forma rectangular.

También podemos resaltar un elemento poniendole diferentes tipos de contorno: bordes, sombras, esquinas redondeadas, etc.

Contraste por alineación

Una correcta alineación de los elementos es fundamental en la página web. Las cosas aparecen más claras cuando las vemos alineadas y en su sitio.

Con la alineación, no sólo nos referimos a los textos, los cuales lucen mejor si están perfectamente alineados, sino también a otros elementos, como pueden ser fotografías, recuadros, secciones, etc.

Contraste por tamaño

El tamaño de los distintos elementos influye en la forma de visualizar la página. Los elementos de mayor tamaño estarán más resaltados que los elementos de pequeño tamaño.


El énfasis

Como tercer principio del diseño tenemos el énfasis. El énfasis consiste en resaltar algunos elementos respecto del resto de la página. Podemos distinguir tres tipos de elementos destacados:

Para dar énfasis lo normal es utilizar los siguientes recursos :


El ritmo o repetición

El ritmo es la repetición o alternancia de elementos. Conseguimos así una regularidad en la página que crea una sensación de orden y coherencia, facilita la búsqueda de los elementos, y da una cierta estabilidad a la página.

La repetición también suele darse entre las distintas páginas de un mismo sitio, las cuales suelen tener un aspecto similar (misma distribución, mismos colores, mismo encabezado, etc.). Esto hace que el usuario que navega por las distintas páginas de un mismo sitio, sepa en todo momento en qué sitio está.

Podemos distinguir tres tipos de ritmo, estos son:


Proximidad

El principio de proximidad indica que todos los elementos similares deben estar próximos entre sí. Un ejemplo claro son los menús de navegación, los cuales suelen agrupar todos los enlaces para ir a las distiintas partes del sitio.

Para agrupar elementos similares, no sólo debemos tener en cuenta que estén próximos, sino que éstos deben tener tambien un aspecto similar (mismos colores, misma forma, etc). De esta manera el usuario relaciona estos elementos como parte de un bloque, con lo cual le es más fácil encontrarlos y manejarlos.

La distribución por proximidad hace también que la página se divida en bloques, distintos entre sí, pero que cada uno de ellos tiene elementos similares. Este tipo de distribución hace que el usuario encuentre fácilmente los distintos bloques de la página, para centrarse en el que más le interese.


Conclusión

La finalidad de estos principios del diseño es ayudarnos a buscar el diseño más adecuado para nuestra página. Debemos plantearnos primero cuales son los efectos que buscamos en el usuario al visualizar nuestra página, y después aplicar más o menos cada uno de estos principios.

No está de más, antes de ponernos a diseñar nuestra página directamente en HTML o CSS, hacernos un boceto en papel de cómo queremos que se vea nuestra página en la pantalla. Los principios del diseño son una ayuda para conseguir un buen diseño, en el cual sepamos transmitir al usuario los efectos deseados.



Complementos/Diseño

Anterior siguiente ... Siguiente siguiente


imprimir esta página

Página creada por ANYELGUTI.

Sugerencias: aprendeweb@aprende-web.net. Envia un manda un correo

Visita nuestro blog par saber en qué estamos trabajando: Aprende Web Blog

Más sobre anyelguti en http://anyelguti.16mb.com