Taller de Dise単o Web
Conceptos aplicados a la Web
Color: Si uno mira a su alrededor se puede dar cuenta de que estamos rodeados de colores por todas partes. Los colores nos envían impulsos que se convierten en sensaciones, los colores pueden provocarnos tranquilidad, excitación, alegría e incluso depresión. En el mundo del diseño la forma en la que aplicamos el color es un aspecto de la máxima importancia, a través de los colores somos capaces de comunicar sensaciones o sentimientos empleando muy poco espacio y muy poco tiempo. Estos dos aspectos hacen que sea básico su uso en una página Web, donde en un tiempo menor de diez segundos debemos captar la atención de nuestros visitantes si no queremos que abandonen nuestra Web para irse a otro lugar que capte más su atención. Un uso adecuado del color en una página es una clave segura para su éxito. A la hora de navegar por la red todos nos hemos encontrado con las típicas páginas con aspecto descuidado, o con páginas donde a veces el texto era ilegible debido a una mala combinación de los colores. O donde el uso de colores chillones nos ha alterado y enseguida nos hemos ido a otro lugar más agradable. Círculo cromático: También llamado rueda de colores, es un círculo dividido en sectores de diferentes colores que nos permite estudiar las relaciones entre estos. Existen en ella tres colores primarios (rojo, verde y azul) cuyas combinaciones nos permiten obtener todos los demás. En la figura tenemos una rueda de tan solo 12 colores, como sabes en la Web disponemos de bastantes más colores.
Los colores en nuestros monitores se forman mezclando el rojo, verde y azul. En inglés Red, Green, Blue, estas iniciales dan lugar al nombre RGB para definir los diferentes colores. Así un color se describe por la cantidad de cada uno de estos colores primarios, cantidad que va de 0 a 255. Habitualmente esto se expresa en hexadecimal como un código de 6 dígitos (RRGGBB) dos dígitos para cada componente. Por ejemplo: un color 10A2C0, tiene un componente de rojo igual a 10, de verde igual a A2 y de azul C0. ¿Un lío? En decimales Rojo = 16, Verde = 162, Azul = 192. Por ejemplo el blanco es el FFFFFF (máximo de rojo, verde y azul), mientras que el negro es el 000000, ausencia de todo color.
Percepción Visual: La percepción visual es la interpretación o discriminación de los estímulos externos visuales relacionados con el conocimiento previo y el estado emocional del individuo. Percepción visual es un proceso activo mediante el cual el cerebro transforma la información lumínica que capta el ojo en una recreación de la realidad externa o copia de ella, que es personal, basada en programas genéticamente determinados y que adquiere una tonalidad emocional única. En la confección de mensajes visuales, el significado no consiste solo en la acumulación de efectos causados por la disposición de elementos básicos sino también en el mecanismo perceptivo que comparte universalmente el organismo. Por decirlo con palabras más sencillas: creamos un diseño a partir de muchos colores, contornos, texturas, tonos y proporciones relativas. Interaccionamos activamente esos elementos, y pretendemos un significado. El resultado es la composición, la intención del diseñador. Entre el ambiente de información visual y un mensaje específico y definido se interpone otro campo más que es la funcionalidad. No olvidemos que en la mayoría de los casos la Web a de servir a un propósito.
Diagramación: Los proyectos Web que generan un resultado de alta calidad se construyen a partir de un concepto creativo y una base sólida. El concepto esta compuesto por las diferentes ideas del cliente y la diagramación Web eficaz es el primer paso para construir los cimientos de un buen proyecto. El resultado de un estudio de objetivos del proyecto, análisis funcional, de arquitectura y de contenidos del mismo, estableciendo un esquema visual que nos permita tener una idea clara de la estructura y alcance del proyecto. Lo que coloquialmente se ha entendido como "hacer un mapa Web". El proceso de diagramar una página Web, consiste en decidir: ¿Donde colocar sus elementos y por qué?, al ejecutar este paso con los objetivos básicos de crear vínculos para que la navegación sea intuitiva y crear una estructura adecuada de código de programación, se ha empezado por el buen camino. Diagramar y programar un sitio Web partiendo de los objetivos ya mencionados garantiza la funcionalidad del mismo. Una página Web visualmente atractiva que además sea altamente funcional son los primeros ingredientes de un proyecto Web de calidad y mucho éxito.
Composición: La composición se define como una distribución o disposición de todos los elementos que incluiremos en un diseño o composición, de una forma perfecta y equilibrada. En un diseño lo primero que se debe elegir son todos los elementos que aparecerán en el, luego debemos distribuirlos, para colocarlos con el espacio disponible. Los elementos pueden ser tanto imágenes, como espacios en blanco, etc. Es muy importante, tener en cuenta de que forma situaremos estos elementos, en nuestra composición, para que tengan un equilibrio formal y un peso igualado. El peso de un elemento, se determina no sólo por su tamaño, que es bastante importante, si no por la posición en que este ocupe respecto del resto de elementos. Por ejemplo, si queremos hacer destacar un elemento en concreto, lo colocaremos en el centro.
Tipografía: La tipografía es el arte del manejo y selección de tipos (las letras diseñadas con unidad de estilo) para desarrollar un trabajo de impresión. Se trata de un oficio o técnica que se encarga de todo lo referente a las letras, números y símbolos de un texto impreso. El diseño, la forma y el tamaño de los tipos dependen de la tipografía. Es posible distinguir distintas ramas o divisiones en este arte, como la tipografía creativa, entre otras. A la hora de seleccionar las fuentes que vamos a usar en una página, deberemos tener en cuenta que existen algunas especialmente diseñadas para su visualización en la pantalla de un monitor, por lo que suelen resultar las más apropiadas para la Web. Estas fuentes suelen ser sans serif, destacando entre ellas Verdana, Arial y Helvetica, pudiendo especificarse también el tipo genérico sans-serif, con lo que el navegador usará la fuente sans serif que por defecto tenga instalada la máquina del usuario. En caso de facilitar a los usuarios de la Web documentos o páginas para impresión, es conveniente sustituir las fuentes anteriores por alguna tipo serif (con remates en sus extremos), ya que son más legibles en documentos impresos y menos monótonas.
Entre ellas podemos destacar Times New Roman, Courier y Courier New, pudiendo especificarse también el tipo genérico serif, con lo que el navegador usará la fuente serif que por defecto tenga instalada la máquina del usuario.