Hey, ¿hablamos?
WhatsApp
Sello Proven Expert
diseno og e1762097432558

Diccionario de Diseño Web completo

Contenido

3

Redirección 301:

Una redirección 301 es un método para "desviar" de forma permanente una dirección web (URL) a otra. Es como poner un cartel de "Nos hemos mudado" en una tienda vieja que guía automáticamente a los clientes (tanto a las personas como a los buscadores tipo Google) a la nueva dirección. Esto asegura que no pierdas visitantes y que la popularidad de la página antigua se transfiera a la nueva.

Error 404:

Un error 404 es un código que te muestra el navegador cuando intentas visitar una página web que no existe. Es el famoso mensaje de "Página no encontrada". Esto puede pasar porque escribiste mal la dirección, hiciste clic en un enlace roto o porque el dueño del sitio web eliminó esa página.

A

Accesibilidad:

La accesibilidad se asegura de que las páginas web puedan ser usadas y entendidas por todas las personas, incluidas aquellas con discapacidades. Esto incluye hacer que el sitio funcione bien con lectores de pantalla (para personas ciegas), que se pueda navegar usando solo el teclado (para personas con dificultades motoras) y poner texto alternativo en las imágenes (para describir qué se ve). El objetivo es que nadie quede excluido.

Alineación:

La alineación es la forma en que se ordenan y posicionan las cosas (como texto, imágenes o botones) en una página web. Por ejemplo, el texto de un libro suele estar alineado a la izquierda, pero los títulos a veces están centrados. Una buena alineación hace que la página se vea ordenada y sea más fácil de leer.

Texto Alt (Texto Alternativo):

Es una descripción corta que se añade a una imagen en el código de la web. Tiene dos propósitos principales: 1) Ayuda a las personas con discapacidad visual, ya que los lectores de pantalla les leen esta descripción para que sepan qué muestra la imagen. 2) Ayuda a los buscadores (como Google) a entender de qué trata la imagen, lo cual mejora el posicionamiento de la web.

Te puede interesarDiccionario de WordPress 2026Diccionario de WordPress 2026

Texto de Anclaje (Anchor Text):

Es el texto visible en el que puedes hacer clic dentro de un enlace (hipervínculo). Por ejemplo, si ves un texto que dice "haz clic aquí", ese es el texto de anclaje. Le da a los usuarios una idea de adónde les llevará el enlace si hacen clic. También es importante para los buscadores, ya que les ayuda a entender de qué trata la página enlazada.

"Above the Fold" (Parte superior visible):

Es un término que viene de los periódicos impresos (la parte que se veía doblada en el quiosco). En diseño web, se refiere a toda la parte de la página que ves en tu pantalla (ordenador, móvil, etc.) justo cuando carga, sin necesidad de empezar a bajar (hacer scroll). Es la zona más importante para captar la atención del visitante, por lo que suele contener el logo, el menú y el mensaje principal.

B

Back-End:

El "Back-End" es como la sala de máquinas o la cocina de un restaurante. Es la parte del sitio web que los visitantes no ven, pero que hace que todo funcione. Se encarga de cosas como guardar y organizar la información (por ejemplo, los datos de los usuarios, los productos de una tienda), procesar los formularios que envías y conectarse a bases de datos. Sin el back-end, la web sería solo un decorado vacío.

"Breadcrumbs" (Migas de Pan):

Las "migas de pan" (traducción literal de breadcrumbs) son una pequeña ruta de enlaces que te muestra dónde te encuentras dentro de un sitio web. Ayudan al usuario a entender la estructura de la web y a volver fácilmente a páginas anteriores. Por ejemplo, si estás leyendo un artículo, podrías ver algo como: Inicio > Blog > Tecnología > Nombre del Artículo.

"Below the Fold" (Parte inferior no visible):

Es lo opuesto a "Above the Fold". Se refiere a todo el contenido de una página web que no puedes ver hasta que empiezas a bajar (hacer scroll). Aunque es menos visible al principio, aquí es donde se suele desarrollar la información más detallada, como artículos completos, secciones de características, testimonios, etc.

Te puede interesarDiccionario de WordPress 2026Diccionario de WordPress 2026
Te puede interesarDiccionario de Marketing Digital OnlineDiccionario de Marketing Digital Online

Texto Principal (Body Text):

Es el texto principal de una página web; básicamente, los párrafos que lees. No incluye los títulos, subtítulos u otros elementos como menús o pies de página. Es el contenido más importante donde se explica el mensaje principal, se cuenta una historia o se describen los detalles de un producto.

Botón:

Un botón es un elemento gráfico en el que puedes hacer clic para que ocurra algo. Son fundamentales para que el usuario interactúe con la web. Se usan para realizar acciones como "Enviar" un formulario, "Comprar" un producto, "Ir a otra página" o "Suscribirse" a un boletín.

C

Caché:

La caché es como una "memoria a corto plazo" que usa tu navegador (Chrome, Firefox, etc.) o el servidor de la web. Guarda temporalmente archivos de las páginas que visitas (como imágenes, logos y códigos). De esta forma, la próxima vez que vuelvas a esa misma página, en lugar de descargar todo de nuevo, usa los archivos guardados en la caché y la página carga mucho más rápido.

Llamada a la Acción (CTA):

Una "Llamada a la Acción" (o CTA, por sus siglas en inglés) es un mensaje, botón o enlace diseñado para que el usuario haga algo específico. Es una instrucción directa que busca una respuesta. Ejemplos claros son botones que dicen: "Compra ahora", "Regístrate gratis", "Descarga la guía" o "Contacta con nosotros".

Core Web Vitals (Métricas Web Principales):

Son un conjunto de medidas específicas que usa Google para evaluar la experiencia real de un usuario en una página web. Se centran en tres cosas principales: 1) la velocidad de carga (qué tan rápido aparece el contenido principal), 2) la interactividad (cuánto tarda la página en responder cuando haces clic en algo) y 3) la estabilidad visual (si las cosas saltan o se mueven en la pantalla mientras carga). Tener buenos resultados aquí ayuda a que tu web guste más a Google.

Te puede interesarDiccionario de WordPress 2026Diccionario de WordPress 2026
Te puede interesarDiccionario de Marketing Digital OnlineDiccionario de Marketing Digital Online
Te puede interesarConstructores webs con IA: La verdad que no te cuentan

CMYK:

CMYK son las siglas de los colores Cyan (Cian, un tipo de azul), Magenta, Yellow (Amarillo) y Key (Negro). Es un modelo de color que se usa exclusivamente para la impresión (como en impresoras de casa, folletos, revistas o carteles). Funciona mezclando estas cuatro tintas para crear todos los demás colores. Es diferente del modelo RGB, que es el que usan las pantallas.

Paleta de Colores:

Es el conjunto de colores elegidos que se usan en el diseño de un sitio web. Al igual que un pintor usa una paleta para mezclar sus pinturas, un diseñador web usa una paleta (por ejemplo, 5 o 6 colores que combinan bien) para mantener un aspecto coherente en toda la web. Esto ayuda a reforzar la identidad de la marca (haciendo que la reconozcas por sus colores) y a que el diseño se vea profesional.

Contraste:

En diseño web, el contraste es la diferencia (normalmente de color o brillo) entre dos elementos que están juntos. El ejemplo más común es el contraste entre el color del texto y el color del fondo. Un buen contraste (como texto negro sobre fondo blanco) hace que la página sea fácil de leer, especialmente para personas con problemas de visión. Un mal contraste (como texto gris claro sobre fondo blanco) dificulta la lectura.

Recortar (Cropping):

Es la acción de "recortar" o eliminar partes de una imagen. Se usa para centrar la atención en la parte más importante de la foto, para eliminar "ruido" o elementos no deseados de los bordes, o para ajustar la imagen a un tamaño o forma específicos (como hacerla cuadrada para un perfil).

CSS:

CSS (siglas de Cascading Style Sheets u "Hojas de Estilo en Cascada") es el lenguaje de programación que se usa para definir el aspecto visual de una página web. Si HTML es el esqueleto (la estructura), el CSS es la ropa, el maquillaje y el peinado. Se encarga de definir los colores, los tipos de letra, los tamaños, los márgenes, cómo se colocan las cajas y, en general, de hacer que la web se vea bonita.

Te puede interesarDiccionario de WordPress 2026Diccionario de WordPress 2026
Te puede interesarDiccionario de Marketing Digital OnlineDiccionario de Marketing Digital Online
Te puede interesarConstructores webs con IA: La verdad que no te cuentan
Te puede interesarLa IA me robo mis visitas: Qué hacer si has perdido visitas y cómo recuperarloLa IA me robo mis visitas: Qué hacer si has perdido visitas y cómo recuperarlo

Cookies:

Las "cookies" (galletas, en inglés) son pequeños archivos de texto que una página web guarda en tu ordenador o móvil cuando la visitas. Sirven para "recordar" cosas sobre ti. Por ejemplo, pueden guardar que ya has iniciado sesión (para que no tengas que meter tu contraseña cada vez), qué productos has añadido al carrito de la compra o qué preferencias de idioma has elegido.

Sistema de Gestión de Contenidos (CMS):

Un CMS (por sus siglas en inglés) es una herramienta o programa que te permite crear, editar y administrar el contenido de un sitio web (como textos, imágenes, artículos de blog) de una forma sencilla, sin necesidad de saber programar. Es como tener un panel de control para tu web. El ejemplo más famoso de un CMS es WordPress.

Carrusel (Carousel):

Un carrusel (a veces también llamado slider) es un componente de diseño que muestra una serie de imágenes o contenidos que van rotando automáticamente o que el usuario puede pasar (normalmente con flechas). Se usa mucho en las páginas de inicio para mostrar varias fotos, productos destacados u ofertas en un mismo espacio.

D

DHTML:

DHTML (HTML Dinámico) no es un lenguaje en sí, sino un término que describe la combinación de tecnologías (principalmente HTML, CSS y JavaScript) para crear páginas web interactivas. Permite que los elementos de la página cambien o se muevan (por ejemplo, menús que se despliegan o animaciones) sin tener que recargar la página entera.

Menú Desplegable:

Es un tipo de menú de navegación que, al hacer clic o pasar el ratón por encima de una opción principal, muestra una lista de sub-opciones hacia abajo. Se usa para organizar muchas páginas o secciones en un menú principal sin que ocupe demasiado espacio.

Sombra Paralela (Drop Shadow):

Es un efecto visual que añade una sombra detrás de un elemento (como un botón, una caja de texto o una imagen). Se usa para dar una sensación de profundidad y hacer que ese elemento "resalte" o parezca estar flotando por encima del fondo.

DNS:

El DNS (Sistema de Nombres de Dominio) es como la "agenda de teléfonos" de Internet. Los ordenadores no entienden nombres como "https://www.google.com/search?q=google.com", solo entienden números (direcciones IP, como 172.217.14.228). El DNS es el sistema que se encarga de traducir el nombre de la web que tú escribes en el navegador a la dirección IP numérica que el ordenador necesita para encontrarla.

Dominio:

Un dominio (o nombre de dominio) es el nombre único y fácil de recordar que usas para visitar un sitio web. Es la dirección que escribes en el navegador, como "https://www.google.com/search?q=google.com" o "wikipedia.org". Es, básicamente, el nombre de la "parcela" que ocupa tu web en Internet.

E

eCommerce (Comercio Electrónico):

Es simplemente la compra y venta de productos o servicios a través de Internet. Cualquier tienda online, desde Amazon hasta la pequeña tienda de artesanía de tu barrio que vende por su web, es un eCommerce.

Diseño Elástico (Elastic Layout):

Es un tipo de diseño web que se "estira" o "encoge" para adaptarse al tamaño de la pantalla del visitante. Funciona bien en diferentes tamaños de monitor, asegurando que el contenido ocupe el espacio disponible de forma proporcionada.

F

Favicon:

Es el pequeño icono o logo que aparece en la pestaña del navegador, justo al lado del título de la página web. También lo ves en tus listas de "Favoritos". Ayuda a los usuarios a identificar rápidamente tu sitio web cuando tienen muchas pestañas abiertas.

Front-End:

El "Front-End" es todo lo que el usuario ve e interactúa en un sitio web. Es la "fachada" o el "salón" del restaurante (en oposición al Back-End, que es la cocina). Incluye el diseño visual, los colores, los tipos de letra, los botones, los menús y cómo responde la web cuando haces clic.

Filtro:

Los filtros son efectos que se aplican a las imágenes o contenidos para cambiar su apariencia. Son como los filtros de Instagram: pueden cambiar los colores, poner una foto en blanco y negro, hacerla más borrosa o más nítida, todo para mejorar el estilo visual.

Punto Focal:

Es la parte de la página web (un elemento, una imagen o un texto) que está diseñada para atraer tu mirada inmediatamente. Es el centro de atención. Los diseñadores lo usan para destacar la información más importante o el botón de llamada a la acción.

Fuente (Font):

La fuente es el diseño específico de un tipo de letra, incluyendo su estilo, tamaño y grosor. Por ejemplo, "Arial", "Times New Roman" o "Roboto" son fuentes. La elección de la fuente afecta mucho a cómo se lee la web y qué personalidad transmite (seria, moderna, divertida, etc.).

Familia de Fuentes (Font Family):

Una familia de fuentes es el grupo completo de una misma fuente, que incluye todas sus variaciones. Por ejemplo, la familia "Roboto" incluye Roboto Light (fina), Roboto Regular (normal), Roboto Italic (cursiva) y Roboto Bold (negrita).

Grosor de Fuente (Font Weight):

Se refiere a cómo de "gorda" o "fina" es una letra. El grosor va desde muy fino (llamado light o thin) hasta muy grueso (llamado bold o black). Se usa para dar más importancia a unas palabras que a otras (como en los títulos).

Tamaño de Fuente (Font Size):

Es simplemente la altura de las letras. Se mide en puntos (pt) o píxeles (px) y determina cómo de grande o pequeño se ve el texto en la pantalla.

Estilo de Fuente (Font Style):

Se refiere a las variaciones especiales dentro de una familia de fuentes, principalmente la cursiva (italic), que es una versión inclinada de la letra normal.

Pie de Página (Footer):

El pie de página es la sección que se encuentra al final de todo de una página web. Generalmente es la misma en todas las páginas. Suele contener información importante como los datos de contacto, el aviso de copyright (©), enlaces a la política de privacidad, iconos de redes sociales y, a veces, un mapa del sitio.

G

Rejilla (Grid):

Una rejilla (o grid) es una estructura invisible, hecha de filas y columnas, que los diseñadores usan para organizar el contenido en una página web. Ayuda a alinear todos los elementos (texto, imágenes) de forma ordenada y coherente, haciendo que el diseño se vea limpio y profesional.

GIF (Graphics Interchange Format):

Un GIF es un tipo de archivo de imagen que tiene una característica especial: puede moverse. Es como un mini vídeo muy corto que se repite en bucle (una y otra vez). Se usa mucho en Internet para crear animaciones simples, memes divertidos o reacciones.

Gradiente (o Degradado):

Un gradiente es una transición suave entre dos o más colores. En lugar de tener un fondo de un solo color sólido (como rojo), un gradiente puede empezar en rojo y terminar suavemente en naranja. Se usa mucho en fondos, botones y textos para darles un aspecto más moderno y visual.

GUI (Interfaz Gráfica de Usuario):

La GUI (por sus siglas en inglés) es todo lo visual que ves en una pantalla y que te permite interactuar con un programa o una web. Son los botones en los que haces clic, los iconos, los menús y las ventanas. Es lo que te permite usar el ordenador o el móvil sin tener que escribir códigos.

H

Cabecera (Header):

La cabecera es la parte superior de una página web. Generalmente es la misma en todas las páginas del sitio. Suele contener el logo de la empresa, el menú de navegación principal y, a veces, un buscador o botones de contacto.

Sección "Hero" (Sección Principal):

La sección "Hero" (o sección "héroe") es el gran bloque de contenido que aparece justo en la parte superior de una página web, normalmente en la página de inicio, justo debajo de la cabecera. Suele consistir en una imagen grande o un vídeo, un título llamativo y una llamada a la acción (CTA). Su objetivo es captar la atención del visitante de inmediato.

Página de Inicio (Homepage):

Es la página principal o la "puerta de entrada" de un sitio web. Es la página que carga cuando escribes el dominio principal (como "https://www.google.com/search?q=google.com"). Sirve como un resumen de lo que ofrece el sitio y dirige a los visitantes a las otras secciones importantes.

Código de Color HEX (Hexadecimal):

Es un código de 6 caracteres (números y letras) que se usa en diseño web para decirle al ordenador qué color exacto mostrar. Siempre empieza con una almohadilla (#). Por ejemplo, #FFFFFF es blanco puro, #000000 es negro puro y #FF0000 es rojo brillante. Es la forma más precisa de definir colores en CSS.

HTML:

HTML (siglas de Hypertext Markup Language) es el lenguaje básico para construir páginas web. Es como el "esqueleto" o los "ladrillos" de una web. Le dice al navegador qué es cada cosa: esto es un título, esto es un párrafo, esto es una imagen, esto es un enlace. No define cómo se ve (eso lo hace CSS), solo define la estructura.

HTTP:

HTTP (Protocolo de Transferencia de Hipertexto) es el conjunto de reglas básicas que usan los navegadores para pedir y recibir información (páginas web, imágenes) de los servidores en Internet. Es el idioma fundamental de la web, aunque no es seguro.

HTTPS:

HTTPS (Protocolo de Transferencia de Hipertexto Seguro) es la versión segura de HTTP. La "S" final significa "Seguro". Añade una capa de encriptación (cifrado) a la comunicación entre tu navegador y el sitio web. Esto significa que si metes una contraseña o tu tarjeta de crédito, los hackers no pueden robar esa información fácilmente. Sabes que una web usa HTTPS porque ves un candado en la barra de direcciones.

Hosting (Alojamiento Web):

El hosting o alojamiento es el servicio que te permite "alquilar" un espacio en un ordenador muy potente (llamado servidor) que está conectado a Internet 24 horas al día. En ese espacio es donde guardas todos los archivos de tu página web (HTML, CSS, imágenes) para que cualquier persona en el mundo pueda visitarla en cualquier momento.

I

Icono:

Los iconos son pequeñas imágenes o símbolos muy simples que se usan en una web para representar una idea, una acción o una sección. Por ejemplo, un icono de un sobre se usa para "email", un icono de un carrito de la compra para "comprar", o una lupa para "buscar". Ayudan a entender la web de un vistazo.

Superposición de Imagen (Image Overlay):

Es un efecto visual donde se coloca un color semitransparente, un texto u otra imagen por encima de una imagen principal. A menudo se usa para oscurecer un poco una foto de fondo y hacer que el texto que está encima sea más fácil de leer, o para mostrar información adicional cuando pasas el ratón por encima de la imagen.

iFrame (Marco Incorporado):

Un iFrame es como una "ventana" dentro de tu página web que te permite mostrar contenido de otra página web distinta. Se usa muchísimo para insertar cosas como un mapa de Google Maps, un vídeo de YouTube o una publicación de una red social dentro de tu propio artículo o página.

J

JPEG:

JPEG (a veces visto como .jpg) es uno de los formatos de archivo de imagen más comunes en Internet. Es el formato ideal para fotografías y para imágenes que tienen muchos colores diferentes y degradados. Comprime la imagen para que pese menos (cargue más rápido), aunque puede perder un poco de calidad si se comprime demasiado.

K

Kerning:

El kerning es un término de tipografía (diseño de texto) que se refiere al ajuste del espacio que hay entre dos letras específicas. No es el espacio general entre todas las letras, sino el ajuste fino entre pares concretos (por ejemplo, juntar un poco una 'A' y una 'V') para que la lectura sea visualmente más agradable y equilibrada.

L

Página de Aterrizaje (Landing Page):

Una "página de aterrizaje" es una página web independiente creada con un solo objetivo en mente. Se usa mucho en campañas de marketing o publicidad. Por ejemplo, si haces clic en un anuncio, te lleva a una landing page que solo habla de ese producto y te pide que lo compres o te registres. No tiene distracciones como el menú principal o el pie de página habitual.

Carga Perezosa (Lazy Loading):

Es una técnica para hacer que las páginas web carguen más rápido. En lugar de cargar todas las imágenes y contenidos de la página de golpe (incluso los que están muy abajo), la "carga perezosa" solo carga lo que se ve en la pantalla. A medida que el usuario va bajando (haciendo scroll), la web va cargando las siguientes imágenes justo antes de que aparezcan.

Lightbox:

Un lightbox (o caja de luz) es el efecto que ocurre cuando haces clic en una imagen pequeña y esta se abre en grande en el centro de la pantalla, mientras que el fondo de la página se oscurece. Permite ver detalles de una foto sin salir de la página en la que estás.

M

Mockup (Maqueta):

Una maqueta es una representación visual de cómo se verá el diseño de la página web. A diferencia de un wireframe (que es solo un esquema), la maqueta ya incluye los colores, las tipografías y las imágenes reales. Es una imagen estática (no funciona, no se puede hacer clic) que muestra el aspecto final del diseño.

Menú:

Un menú es como el índice o la guía principal de un sitio web. Es una lista de enlaces o botones que te ayuda a moverte por las diferentes secciones o páginas del sitio (como "Inicio", "Sobre nosotros", "Servicios", "Contacto"). Puede estar en la parte de arriba (cabecera), en un lateral o incluso abajo.

Margen (Margin):

El margen es el espacio exterior de un elemento. Es el espacio en blanco que hay fuera del borde de una caja, texto o imagen, y que lo separa de otros elementos a su alrededor. Se usa para "dar aire" al diseño y que las cosas no estén pegadas entre sí.

N

Navegación:

La navegación es el conjunto de todos los elementos que te permiten moverte por un sitio web. Esto incluye el menú principal, los enlaces, los botones, las "migas de pan" y el buscador. Un buen sistema de navegación hace que sea fácil e intuitivo para el usuario encontrar lo que busca.

O

Opacidad:

La opacidad es el nivel de transparencia que tiene un elemento. Una opacidad del 100% significa que el objeto es totalmente sólido (no se ve a través de él). Una opacidad del 0% significa que es totalmente transparente (invisible). Una opacidad del 50% lo haría semitransparente, dejando ver lo que hay detrás.

Optimización:

En el contexto web, la optimización es el proceso de hacer ajustes y mejoras en un sitio web para que funcione mejor. Esto puede incluir muchas cosas: optimizar las imágenes para que pesen menos (y la web cargue más rápido), mejorar el código o ajustar el contenido para gustar más a Google (SEO).

P

PNG:

PNG (Portable Network Graphics) es un formato de archivo de imagen muy popular. Su gran ventaja sobre el JPEG es que puede guardar imágenes con fondo transparente. Por eso es el formato ideal para logos, iconos y gráficos que necesitas poner sobre un fondo de color sin que se vea un recuadro blanco alrededor.

Relleno (Padding):

El relleno es el espacio interior de un elemento. Es el espacio que hay entre el contenido (como un texto) y el borde dentro de su caja. Se usa para que el texto no esté pegado a los bordes de un botón o de un recuadro, dándole "espacio para respirar".

Píxel:

Un píxel es el punto más pequeño de luz en una pantalla digital. Tu pantalla de ordenador o móvil está formada por millones de estos diminutos puntos. Todo lo que ves (imágenes, texto) está hecho de píxeles. Cuando hablamos del tamaño de una imagen (ej. 1920x1080), hablamos de cuántos píxeles tiene de ancho y de alto.

Prototipo:

Un prototipo es una versión de prueba de un sitio web que ya funciona. A diferencia de una maqueta (que es solo una imagen), en un prototipo puedes hacer clic en los botones, navegar por los menús y probar cómo se siente usar la web. Ayuda a encontrar problemas y probar ideas antes de construir la web real.

PPI (Píxeles Por Pulgada):

PPI (Pixels Per Inch) es una medida que indica cuántos píxeles hay en una pulgada de pantalla. Cuanto más alto es el número de PPI, más "densos" están los píxeles y, por lo tanto, más nítida y clara se ve la imagen. Es lo que hace que las pantallas "Retina" de los móviles se vean tan bien.

Permalink (Enlace Permanente):

Un permalink (enlace permanente) es la dirección URL completa y definitiva de una página o artículo específico de un sitio web. Es una dirección que está diseñada para no cambiar nunca. Por ejemplo, la dirección de un artículo de blog. Esto permite que otras personas puedan enlazar a ese contenido sabiendo que siempre estará ahí.

R

RGB:

RGB son las siglas de Red (Rojo), Green (Verde) y Blue (Azul). Es el modelo de color que usan todas las pantallas (móviles, TV, ordenadores). Funciona "sumando" luz de estos tres colores básicos para crear todos los demás. Es el opuesto al CMYK, que se usa para imprimir.

Resolución:

La resolución es el número total de píxeles que tiene una imagen o una pantalla. Normalmente se expresa midiendo el ancho por el alto (por ejemplo, 1920x1080 píxeles). A mayor resolución, más píxeles hay y, por lo tanto, la imagen tiene más detalle y se ve más nítida.

Gráficos Rasterizados (Raster Graphics):

Son imágenes que están hechas de una rejilla de píxeles (como las fotos JPEG o PNG). Son perfectas para fotografías. Su principal desventaja es que, si las intentas hacer más grandes de su tamaño original, "se pixelan", es decir, se vuelven borrosas y pierden calidad.

Diseño Responsivo (Responsive Design):

Es una forma de diseñar y construir sitios web para que se vean bien y funcionen correctamente en cualquier dispositivo, sin importar el tamaño de la pantalla. La página web "responde" y reorganiza su contenido automáticamente si la estás viendo en un ordenador grande, una tablet o un móvil pequeño.

Robots.txt:

Es un archivo de texto simple que se pone en el servidor de un sitio web. Su función es dar instrucciones a los "robots" de los buscadores (como el de Google). En este archivo, el dueño de la web les dice qué partes del sitio no deben rastrear o incluir en sus resultados de búsqueda (por ejemplo, páginas privadas o de administración).

Campos Obligatorios:

Son las casillas de un formulario (como un formulario de contacto o de registro) que el usuario debe rellenar obligatoriamente para poder enviarlo. Suelen estar marcadas con un asterisco (*) para indicar que no te las puedes saltar.

Fragmentos Enriquecidos (Rich Snippets):

Son los resultados de búsqueda de Google que muestran información extra y más visual, además del título y la descripción normales. Por ejemplo, cuando buscas una receta y ves las estrellitas de valoración, el tiempo de cocción y una foto. O cuando buscas un producto y ves el precio y la disponibilidad.

S

Barra de Búsqueda:

Es la caja de texto (a menudo con un icono de lupa) que permite a los usuarios escribir palabras clave para buscar contenido específico dentro de un sitio web. Es como tener un pequeño Google solo para esa página.

Slider (o Carrusel):

Un slider (o carrusel) es un componente de diseño que muestra una serie de imágenes o contenidos que van rotando automáticamente o que el usuario puede pasar (normalmente con flechas). Se usa mucho en las páginas de inicio para mostrar varias fotos, productos destacados u ofertas en un mismo espacio.

SVG:

SVG (Gráficos Vectoriales Escalables) es un formato de imagen basado en matemáticas y no en píxeles. Es ideal para logos, iconos e ilustraciones. Su mayor ventaja es que se puede hacer tan grande o tan pequeño como quieras sin que pierda absolutamente nada de calidad; nunca se ve borroso.

SERP:

SERP (Página de Resultados del Motor de Búsqueda) es simplemente la página que te muestra Google (u otro buscador) después de que has hecho una búsqueda. Es la lista de enlaces azules, anuncios y fragmentos enriquecidos que ves como resultado.

Trazo (Stroke):

El trazo es el borde o la línea de contorno de una forma o de un texto. En diseño, puedes cambiar el grosor de ese trazo, su color o incluso si es una línea continua, punteada o de guiones.

Barra Lateral (Sidebar):

Una barra lateral es una columna que se coloca a la izquierda o a la derecha del contenido principal de una página web. Se usa para poner información secundaria que no es la principal, pero que es útil, como un menú de categorías, publicidad, enlaces a artículos recientes o un formulario de suscripción.

Página Estática:

Una página estática es una página web cuyo contenido está fijo y no cambia, a menos que un programador edite el archivo. Muestra la misma información a todos los visitantes. Es lo contrario a una página dinámica (como Facebook), que cambia constantemente según el usuario. Las páginas de "Contacto" o "Sobre nosotros" suelen ser estáticas.

SEO:

SEO (siglas de Search Engine Optimization u "Optimización para Motores de Búsqueda") es el conjunto de técnicas y estrategias que se usan para mejorar la visibilidad de un sitio web en los resultados de buscadores como Google. El objetivo del SEO es hacer que tu página aparezca lo más arriba posible cuando alguien busca algo relacionado con tu contenido, para así conseguir más visitas.

T

TIFF:

TIFF es un formato de archivo de imagen de muy alta calidad. A diferencia de JPEG, no pierde calidad al guardarse, por lo que los archivos son muy pesados. No se usa mucho en páginas web (porque tardaría mucho en cargar), pero es el formato preferido para la impresión profesional de alta calidad (como en revistas o libros de fotografía).

Tipo de Letra (Typeface):

El tipo de letra (a veces confundido con fuente) es el diseño general de un conjunto de caracteres. Por ejemplo, "Helvetica" es un tipo de letra. La familia de fuentes "Helvetica" incluiría todas sus variantes (negrita, cursiva, fina, etc.). En la práctica, la gente suele usar "fuente" y "tipo de letra" como si fueran lo mismo.

Plantilla (Template):

Una plantilla es un diseño de página web ya hecho. Es una estructura prediseñada que puedes usar como punto de partida, y luego solo tienes que cambiar el texto, las imágenes y los colores por los tuyos. Es una forma rápida de crear una web sin empezar desde cero.

Tipografía:

La tipografía es el arte y la técnica de organizar el texto para que sea legible, claro y visualmente atractivo. Incluye todo lo relacionado con el texto: elegir el tipo de letra, decidir el tamaño, ajustar el espacio entre líneas y entre letras, y elegir los colores.

U

Interfaz de Usuario (UI):

La Interfaz de Usuario (o UI, de User Interface) es el medio visual a través del cual una persona interactúa con la página web. Son todos los elementos que ves y con los que puedes "jugar": los botones, los menús, los formularios, los colores, la tipografía. Un buen diseño de UI es el que hace que la web sea bonita, clara y fácil de entender a simple vista.

Experiencia de Usuario (UX):

La Experiencia de Usuario (o UX, de User Experience) es la sensación general que tiene una persona al usar un sitio web. No se trata solo de si es bonito (eso es la UI), sino de si es fácil de usar, si encuentra lo que busca rápidamente, si la página carga rápido y si, al final, se siente satisfecho o frustrado. Un buen UX significa que la web es útil, lógica y agradable de navegar.

URL:

Una URL (Localizador Uniforme de Recursos) es, simplemente, la dirección completa de una página web. Es lo que escribes o pegas en la barra de direcciones del navegador para ir a un sitio específico, incluyendo el "https://" al principio y toda la ruta de la página.

V

Vector (Gráficos Vectoriales):

Los gráficos vectoriales son imágenes creadas usando fórmulas matemáticas (puntos, líneas y curvas) en lugar de píxeles. El formato SVG es un ejemplo. Se usan para logos e iconos porque se pueden escalar (agrandar o achicar) infinitamente sin perder nada de calidad.

W

Wireframe (Estructura o Esqueleto):

Un wireframe es un boceto o esquema muy simple de una página web. Es como el plano de una casa. No tiene colores, ni imágenes bonitas, ni tipos de letra definidos; solo usa cajas y líneas para mostrar dónde irá cada elemento (dónde irá el menú, dónde el texto, dónde las imágenes, dónde los botones). Sirve para planificar la estructura y la organización antes de empezar a diseñar.

Espacio en Blanco (White Space):

El espacio en blanco (o espacio negativo) es el espacio vacío que hay entre los elementos de una página web (entre párrafos, alrededor de las imágenes, en los márgenes). Aunque esté "vacío", es una parte muy importante del diseño, ya que ayuda a que la página no se vea sobrecargada, guía la vista del usuario y hace que el contenido sea mucho más fácil de leer.

WYSIWYG (Lo que ves es lo que obtienes):

WYSIWYG (siglas de What You See Is What You Get) se refiere a un tipo de editor de contenido que te permite diseñar una página web viendo el resultado final en tiempo real. En lugar de escribir código, trabajas con herramientas visuales (como en Word o PowerPoint). Mueves cajas, cambias colores y escribes texto, y lo que ves en el editor es exactamente cómo se verá en la web.

Marca de Agua:

Una marca de agua es un texto o un logo semitransparente que se coloca encima de una imagen o un documento. Se usa principalmente para proteger los derechos de autor (para que no te roben la foto y digan que es suya) o para indicar que es un borrador.

X

XHTML:

XHTML (Lenguaje de Marcado de Hipertexto Extensible) es una versión de HTML que es más estricta y ordenada. Es como una mezcla entre HTML y XML. Obliga a los programadores a escribir el código de una manera más limpia y sin errores. Hoy en día no es tan común, ya que ha sido reemplazado por HTML5.

Mapa del Sitio XML (XML Sitemap):

Un mapa del sitio XML es un archivo especial que se crea para los motores de búsqueda (como Google). Es una lista o un índice de todas las páginas importantes que existen dentro de tu sitio web. Ayuda a Google a encontrar y entender todas tus páginas más fácilmente, especialmente si tu web es muy grande.

Z

Archivo ZIP:

Un archivo ZIP es un paquete comprimido que puede contener muchos archivos y carpetas dentro de uno solo. Es como meter muchos documentos en una maleta y cerrarla para que ocupe menos espacio. Se usa para agrupar muchos archivos (como las fotos de un viaje) y poder enviarlos o descargarlos más fácilmente como un solo archivo.

Javi Morales

Diseñador Web y SEO especializado en pequeños proyectos de emprendedores hispanohablantes

Te puede interesar:

Subir