Anatomía web

Guía práctica deanatomía web.

Pasa el cursor o enfoca los marcadores numerados del diagrama para ver qué es cada elemento y cómo apoya el siguiente paso del usuario.

Diagrama de una homepage ficticia llamada Nexora con 15 elementos comunes, desde logo y navegación hasta footer y widget de chat.
Diagrama de anatomía web*

Referencia adicional

Otros elementos comunes de un sitio.

Estos elementos son comunes en sitios modernos, pero no forman parte del diagrama numerado de arriba.

Navegación móvil

Menú hamburguesa

Un botón compacto que abre la navegación principal en pantallas pequeñas o interfaces densas.

Herramienta para encontrar

Búsqueda

Un buscador ayuda al usuario a ir directo a productos, artículos, servicios o contenido de soporte.

Ruta de página

Breadcrumbs

Los enlaces de ruta muestran dónde vive una página dentro del sitio y ayudan a subir un nivel.

Captura de leads

Formulario de contacto

Un formulario reúne los datos necesarios para responder, calificar un lead, agendar o dirigir una solicitud.

Respuestas expandibles

Acordeón de FAQ

Un acordeón mantiene las preguntas comunes fáciles de escanear y deja abrir solo las respuestas necesarias.

Aviso prioritario

Barra de anuncios

Una barra delgada puede destacar actualizaciones urgentes, promociones, eventos o cambios de servicio.

Aviso de consentimiento

Banner de cookies

Un banner de consentimiento permite gestionar preferencias cuando se usan cookies de analítica o marketing.

Canales externos

Enlaces sociales

Los enlaces sociales llevan a canales públicos activos sin distraer de la acción principal del sitio.

Abrir chat

¿Intentas identificar algo en tu sitio?

Escribe tu dominio y/o describe la parte que estás viendo. El chat de SWATS se abrirá con tu nota para identificarla.

Puedes agregar capturas o más contexto cuando el chat esté abierto.

Ejemplo ficticio

Esta guía usa una página de muestra y un nombre de marca ficticios con fines educativos. Fue generada desde cero y no está afiliada, respaldada ni destinada a representar a ninguna empresa, producto o marca real que use el mismo nombre o uno similar.