Este documento define varios términos clave relacionados con el diseño web, incluyendo conceptos como gestalt, espacio negativo, formatos como RGB, GIF y SVG, y técnicas como anti-aliasing, translúcido y responsive design. El diseño web es un proceso multidisciplinario que involucra diseñadores visuales, de UX y Front End para crear nuevas experiencias de navegación e información en la web.

1. TERMINOLOGIA WEB
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.

2. 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.