Antes de empezar a mencionar términos y significados es importante destacar que el diseño web es una disciplina que permite desarrollar nuevas y diferentes experiencias informativas y de navegabilidad, además, es un proceso en el que influyen varios profesionales, como diseñadores visuales, diseñadores de UX, diseñadores de interfaces y desarrolladores Front End.
Como podrás darte cuenta el diseño web es un proceso extenso y multidisciplinario, sin embargo, en este post nos centraremos únicamente en la etapa visual del diseño web; conoce los términos más usados en esta área, actualízate e incorpóralos a tu vocabulario profesional, de paso no quedarás en ¿? cuando estés en medio de diseñadores.
Gestalt : Es una palabra alemana que traduce forma, en diseño podría entenderse como un elemento que sin estar finalizado tiende a ser percibido en su totalidad. Ejemplo: Los guantes, zapatos y pantalón de Mickey Mouse, aun sin estar presente el personaje estos elementos son asociados instantáneamente con el famoso ratón.
Espacio negativo: Espacios vacíos dentro de piezas de diseño, algunos diseñadores utilizan este espacio para incorporar mensajes o elementos ocultos. Ejemplo: el logo de Carrefour con una C en el centro; el icono del Tour de Francia en su R simula un ciclista; Amazon en su logo marca una línea que parece una sonrisa, además indica que se encuentra cualquier producto de la A a la Z.
RGB (Red, green, blue): Modelo cromático digital que representa a partir de la mezcla del rojo, verde y azul otros colores.
GIF (Graphics Format Interchange, formato de intercambio de gráficos): Formato gráfico usado principalmente para diseños en la web.
SVG (Scalable Vector Graphics): Es un formato gráfico que se basa en el manejo de vectores.
Anti-aliasing: Técnica usada para suavizar elementos creados en formato rasterizado.
Translúcido: Efecto que permite ver parte de la imagen de fondo (sin ser visualmente claro las formas y colores) sobre la capa superior del diseño.
Motif: Patrones decorativos que integran un diseño (espirales, flores, líneas, figuras geométricas, etc.).
Skeuomorphic: Tendencia que hace que los elementos de un diseño se vean tan reales como en el plano físico.
Interfaz de usuario (User Interface): Superficie de contacto físico y cognitivo por el cual el usuario se comunica con la máquina.
Usabilidad (Usability): Es la facilidad con que las personas pueden utilizar una interfaz web, la cual tiene como finalidad alcanzar un objetivo concreto.
Diseño de interacción : Diseño encargado de definir cómo se utilizan los sitios web y aplicaciones, tiene como finalidad mejorar la experiencia de los usuarios así como facilitar el cumplimiento de los objetivos trazados.
Favicon: Imagen que acompaña la url de un sitio web en la barra de direcciones, su tamaño es de 16 por 16 píxeles y se usa para generar recordación de marca, además, si se tienen varias pestañas abiertas permite identificar cada una fácilmente.
Wireframes: Estructuras que jerarquizan el contenido que hará parte de un sitio web, en ellas se muestran la ubicación de cada uno de los componentes y el funcionamiento de los elementos en general.
Style Tiles : Proceso visual de diseño web creado por Samantha Warren, el cual se divide en cuatro etapas: escuchar lo que el cliente quiere, interpretar lo que el cliente dice, definir un lenguaje visual e interactuar con diferentes estilos de diseño para hacer cambios.
Sprites: Conjunto de imágenes agrupadas en una sola imagen.
Header: Cabezote de las páginas web donde se ubica el menú, el logo, el buscador y algunos datos sobre información de la empresa.
Footer: Parte final del sitio web donde se encuentran generalmente elementos como botones de redes sociales, links de navegación, información de contacto, entre otros.
Responsive Design: Técnica de diseño web que se implementa en sitios web y aplicaciones con el propósito de que se adapten a la pantalla de cualquier dispositivo desde donde el usuario navegue.
Parallax: Técnica de Scrolling que altera las velocidades de algunos de los elementos del primer plano para crear un efecto de profundidad en el sitio web.
Si crees que falta algún término en este glosario de diseño web añádelo en los comentarios, si te interesa profundizar un poco más puedes encontrar más términos y técnicas en el glosario de diseño gráfico. Por último, recuerda no se trata de leer como una maquinita, se trata de incluir en la rutina todo el conocimiento adquirido, al final del día es lo único que permanece.