Fundamentos básicos sobre el Diseño Web

por | 14 septiembre 2008
Muchas son las personas que piensan que el realizar una página web es una tarea simple y sencilla. A este tipo de personas (que la mayoría de las veces son nuestros futuros clientes) hay que hacerles ver que piensan de forma erronea. Solo hay que hacerles navegar un poquito y explicarle un poco sobre el tema y rápidamente esa persona debería de cambiar de opinión. Es ahí donde debería preguntarse: ¿Realmente cuesta tanto hacer algo bueno visualmente?La respuesta a esta pregunta es obvia. El arte del diseño gráfico/web precisa de años de estudio y práctica, es imprescindible el dominio de la tipografía, las simetrías, espaciados, y un sin fín de cosas que la gente ignora conscientemente, pero que agradecen visualmente como no se imaginan. La mayoría de las personas piensan que el diseño es hacer que nuestras páginas sean visualmente bonitas, pero con eso no basta, nosotros como diseñadores debemos transmitir una idea y un sentimiento al navegante, y que todo esto se produzca de una manera clara y concisa. Para transmitir estos sentimientos deberemos usar correctamente algunas técnicas, entre las que destacan las siguientes: Tipografía Teoría del color Espaciado y composición TIPOGRAFÍA La tipografía en un PC no es como en cualquier otro soporte. Además, hay que añadirle que la tipografía en Internte tiene sus propias reglas; aunque como en el diseño gráfico la regla principal es que todo sea legible, es algo así como la regla de oro de las tipografías (si no se puede leer no mola). Todo texto que veamos en cualquieras de las páginas web se pueden separar en dos grandes grupos: Títulos y Cuerpos de texto o Mensajes. Los títulos generalmente son letras grandes, gruesas y detalladas. Para este tipo de texto, es esencial que las tipografías elegidas (y el color de estas) estén en consonancia perfectamente con el diseño de la página. Para los mensajes deberemos usar tipografías Sans Serif (Arial, Verdana), nunca usaremos fuentes Serif (Times). Las fuentes sans serif incluyen todas las Palo Seco, resultando especialmente indicadas para su visualización en la pantalla de un ordenador, resultando muy legibles a pequeños tamaños y bellas y limpias a tamaños grandes. En cambio, las tipografías Serif tienen muchos más detalles y a tamaños pequeños se hace poco legible en una pantalla, que no en papel. Otras de las cosas que debemos a la tecnología Flash principalmente es el nacimiento de las Pixel Fonts, que son unas tipografías especialmente diseñadas para que éstas se viesen bien a un determinado punto, ya que “caían” justo en el píxel del monitor. Éstas fuentes han tenido mucho éxito y son muy recomendables usarlas en Flash, ya que hacen los textos muy legibles y no se ven borrosas las letras. TEORÍA DEL COLOR El color es una sensación que se produce en respuesta a una estimulación nerviosa el ojo, causada por una longitud de onda luminosa. El color es un atributo que percibimos de los objetos cuando hay luz. Y es por esto, que los colores sobre los objetos nos producen determinadas sensaciones, por lo que hay que cuidar mucho los colores que elegimos en nuestras composiciones y a la hora de diseñar una web ya que dependerá mucho del color seleccionado la sensación que transmita la web. El color se estructura en conceptos propios que lo definen según las cualidades que contiene: Tono, matiz o croma es el atributo que diferencia el color y por la cual designamos los colores en sí. Saturación es la intensidad cromática o pureza de un color. Por pureza podemos entender la cantidad máxima de pigmentanción sin mezcla. Valor es la claridad u oscuridad de un color, está determinado por la cantidad de luz que un color tiene. Valor y luminosidad expresan lo mismo. El brillo es la cantidad de luz emitida por una fuente lumínica o reflejada por una superficie. Luminosidad es la cantidad de luz reflejada por una superficie en comparación con la reflejada por una superficie blanca en iguales condiciones de iluminación. El círculo cromático es el esquema resultante de distribuir alrededor de un círculo los colores que conforman el segmento de la luz visible del espectro solar. Los colores primarios son: amarillo, rojo y azul. Mezclando pigmentos de éstos colores se obtienen todos los demás colores. Los colores secundarios: verde, violeta y naranja. Los colores secundarios se obtienen de la mezcla en una misma proporción de los colores primarios. Los colores terciarios: rojo violáceo, rojo anaranjado, amarillo anaranjado, amarillo versoso, azul verdoso y azul voláceo. Los colores terciarios, surgen de la combinación en una misma proporción de un color primario y otro secundario. Algunas de las cosas más importantes que debemos saber del color son: Armonía y contraste El color y su expansión Significado del color Armonía y contraste El color es un factor clave del éxito de un diseño. Existen una infinidad de colores y matices para elegir, lo que hace dificil la elección de colores para un proyecto. De todas formas, existen algunas ideas básicas que deben tenerse claras para poder trabajar con soltura con los diseños a color. De entrada existen diferentes formas de enfocar el color en un proyecto: un tratamiento monocromo, o a base de grises tintados; colores matizados o apagados; colores pastel; colores vivos … y dentro de cada una de estas posibilidades podemos emplear diferentes combinaciones. Es por esto que cada diseñador debe realizar una paleta de colores armónica a la hora de realizar un proyecto. La selección cromática para un proyecto suele contar con unos pocos colores dominantes que armonizan entre sí. Una gran cantidad de colores diferentes resulta difícil de mantener a lo largo de una serie de páginas o pantallas si se pretende enfocar la atención en algo que no sean las manchas de colores. Por lo tanto podemos resumir que la armonía consiste en crear una gama de colores para nuestra web que este compuesta por colores de la misma gama o tono. El contraste de colores consiste en combinar diferentes colores para crear una gama como, por ejemplo, claros y oscuros, cálidos y fríos, etc. El tono es una de las dimensiones del color más importantes. El contraste más efectivo se obtiene combinando los diferentes tonos. Los colores opuestos contrastan mucho más, mientras que los análogos apenas lo hacen, perdiendo importancia visual ambos. El color y su expansión El espacio concretado en zonas de color es fundamental dentro de un diseño. Las diferentes tonalidades que se emplean en los elementos y las formas sirven para crear relaciones espaciales y focales, de gran interés para el receptor. se pueden llegar a conseguir efectos muy variados y especiales dependiendo de como se combinene. Por ejemplo, si usamos bastante espacio en blanco, se produce un descanso para el ojo. Si dejamos mucho espacio en blanco alrededor de algún objeto, palabra o imágen, estamos haciendo que destaque del resto de la composición.Los grandes márgenes ayudan a seguir el diseño de una forma más facil. El texto sobre fondo blanco es más legible y por lo tanto el lector debe forzar menos la vista, sintiéndose agradecido. En cambio, el texto sobre fondo negro a simple vista puede parecer más legible, pero cuando es un texto extenso el cansancio visual se verá reflejado. Esto también lo podemos ver en colores claros y oscuros, no es algo que suceda únicamente en blanco y negro. Significado del color Esta es una de las cosas más interesantes con respecto al color, su significado. ¿Algunos pensarán que como puede ser que un color signifique algo? Pues sí, aunque estos significados varían un poco según las culturas, ya que por tradición es posible que el amarillo signifique mala suerte en algunas partes y en otros no o que por ejemplo el blanco signifique y se utilize como “luto” en otras culturas. Blanco . Se halla en el extremo de la gama de los grises.. Es un color latente por su capacidad de potenciar los otros colores vecinos. El blanco puede expresar paz, soleado, feliz, activo, puro e inocente. El blanco es el fondo universal de la comunicación gráfica. Negro Al igual que el blanco, también se encuentra en el extremo de la gama de grises. Es el símbolo del silencio, del misterio y, en ocasiones, puede significar impuro y maligno. Confiere nobleza y elegancia, sobre todo cuando es brillante. Gris Simboliza la indecisión y la ausencia de energía, expresa duda y melancolía. Los colores metálicos tienen una imagen lustrosa, adoptando las cualidades de los metales que representan. Dan impresión de frialdad metálica, pero también dan sensación de brillantez, lujo, elegancia, por su asociación con los metales preciosos. Amarillo Es el color más luminoso, más cálido, ardiente y expansivo. Es el color del sol, de la luz y del oro, y como tal es violento, intenso y agudo. Suelen interpretarse como animados, joviales, excitantes, afectivos e impulsivos. No es recomendable usarlo como color principal de nuestra página, pues tiene demasiada fuerza y tiende a cansar al visitante. Naranja Posee fuerza activa, radiante y expansiva. Tiene un carácter acogedor, cálido, estimulante y una cualidad dinámica muy positiva y energética. Rojo Significa la vitalidad, es el color de la sangre, de la pasión, de la fuerza bruta y del fuego. Está ligado al principio de la vida, expresa la sensualidad, la virilidad, la energía; es exultante y agresivo. El rojo es el símbolo de la pasión ardiente y desbordada, de la sexualidad y el erotismo. Azul Es el símbolo de la profundidad. Inmaterial y frío, suscita una predisposición favorable. La sensación de placidez que provoca el azul es distinta de la calma o reposo terrestres, propios del verde. Expresa armonía, amistad, fidelidad, serenidad, sosiego… y posee la virtud de crear la ilusión óptica de retroceder. Este color se asocia con el cielo, el mar y el aire. El azul claro puede sugerir optimismo. Cuanto más se clarifica más pierde atracción y se vuelve indiferente y vacío. Cuanto más se oscurece más atrae hacia el infinito. Violeta Es el color de la templanza, de la lucidez y de la reflexión. Es místico, melancólico y podría representar también la introversión. En sus tonos más claros se vuelve un poco triste, en los más oscuros representa grandeza. Verde Es el color más tranquilo y sedante. Evoca la vegetación, el frescor y la naturaleza. Es el color de la calma indiferente: no transmite alegría, tristeza o pasión. Cuando algo reverdece suscita la esperanza de una vida renovada. Marrón Es un color masculino, severo, confortable. Es evocador del ambiente local otoñal y da la impresión de gravedad y equilibrio. Es el color realista, tal vez porque es el color de la tierra que pisamos. Espaciado y composición Bueno, esta parte es la más dificil en cuanto a poder ofrecerle datos y recomendarles algo. Puestos a recomendar, les recomiendo de que como diseñadores web, visualicen muchísimas páginas y vean como otros diseñadores plasman las ideas, los conceptos, las formas, composición de sus webs, etc … en sus páginas web. Esta forma es una muy buena forma de crecer como diseñadores. Ver el trabajo de los demás e intentar explicarse uno mismo el porqué ese diseñador que ha realizado esa web que ahora mismo estás visualizando ha hecho las cosas de ese modo. Intentar aprender de la experiencia de los demás es una de las mejores formas (sin duda alguna, también hay que aprender a base de nuestra experiencia). Fuente: http://www.diseno-flash.com/tutoriales/fundamentos-basicos-sobre-el-diseno-web (Javier España)
Compartir... Email this to someoneShare on LinkedIn0Pin on Pinterest0Share on StumbleUpon0Share on Tumblr0Tweet about this on Twitter