Sin una adecuada estructuración, la arquitectura web sería cuando menos un caos. La organización, la simplicidad, la interrelación entre los elementos y la prioridad por los más importantes son los fundamentos de la estructura de una web corporativa. Familiarizarse con las directrices de diseño (la regla de los tres clics, la adaptabilidad para el tráfico móvil) y con las páginas y elementos que lo componen (la home, los menús, las secciones de contacto, productos/servicios y about) son claves para saber cómo estructurar una página web.

Por estructura web entendemos el modo en que las páginas se relacionan entre sí, abarcando sensu lato todos los elementos constituyentes de este ‘andamiaje’, que servirá de soporte a los contenidos y garantizará una navegación, usabilidad y UX eficientes.

Atendiendo a su jerarquía, ¿cómo debe ser una web corporativa? Existe una amplia tipología de la que pueden destacarse tres modelos: (1) la estructura secuencial, donde el contenido se ordena cronológicamente, de manera que las páginas más recientes se posicionan en primer lugar, utilizada en medios de comunicación y en el blog de webs corporativas; (2) la estructura jerárquica o en árbol, donde una página principal enlaza al resto de páginas menores, que su vez pueden redireccionarle enlaces, y (3) la estructura en red o libre, donde una página principal enlaza a distintas secciones y páginas internas sin un patrón o jerarquía establecida, únicamente atendiendo a los objetivos y necesidades de la empresa.

Con independencia de la estructura web elegida, las estrategias de diseño deben respetar la regla de los tres clics o three-click rule, consistente en situar la información, productos, etcétera, a tres clics o menos de distancia con respecto a la página principal. Cuanto menor sea el número de clics necesarios para cumplimentar una acción, mayor será la fluidez en la navegación, necesaria para garantizar una óptima experiencia del usuario.

¿Cuáles son los elementos clave para estructurar el diseño web corporativo?

Página principal

La página principal de una web constituye la carta de presentación de la empresa y, en muchos casos, la primerísima toma de contacto del cliente con sus productos y servicios. Conocida a su vez como home page o main page, esta sección coincide con la URL raíz o root, del que parten el resto de páginas, categorías, fichas de productos, etcétera, de una web. Por su influencia en las restantes secciones, la página de inicio quizá sea el elemento más valioso de la estructura en un diseño web corporativo.

El objetivo de la página principal es organizar la información y los enlaces primarios que permitirán navegar por las páginas internas. La presencia de CTAs, frases copy y otros reclamos evidencian otra de las funciones de esta sección: vender. Su estructuración busca dosificar la información básica acerca del negocio y concentrar la atención del visitante en los elementos clave: la promoción del banner, el botón de ‘registrarse’, etcétera, guiándole a través de una o varias rutas deseadas para la empresa. Por ejemplo, la página de inicio de Dollar Shave Club hace hincapié en la suscripción a su membresía a través de banners y CTAs, pero también dedica un espacio a informar sobre sus servicios, con enlaces que permiten ampliar esta información básica.

Menús

Usabilidad y navegabilidad comparten algo más que una asonancia. Optimizando la navegación entre las diferentes páginas y secciones de una web se consigue elevar la usabilidad y la UX, y un primer paso para lograrlo reside en la creación de menús. En esencia existen dos tipos de menú en diseño web corporativo: (1) el menú del encabezado o header, considerado el principal y que se compone de los enlaces y páginas internas de mayor entidad, y (2) el menú a pie de página o del footer, que por lo general amplía las opciones del menú principal con la adición de páginas legales y de contacto. Estos menús no son excluyentes, y a menudo se complementan con submenús, enlaces de «regresar», menús hamburguesa o migas de pan, útiles para clarificar una jerarquía web demasiado compleja o escalonada. Incluso ciertas páginas pueden carecer de menú, como sucede con las páginas de inicio diseñadas siguiendo el esquema one page.

Versión móvil

Aunque no pueda considerarse un elemento sino una adaptación de elementos web, la versión móvil, responsiva o adaptativa desempeña un rol determinante en la percepción de la estructura de una página web corporativa. Tablets y móviles representan hoy el 54,8% del tráfico web en el mundo, de acuerdo a Statista. Responsivizar webs para los mobile users evita perder más de la mitad de las visitas online, y este proceso implica adaptar todos y cada uno de los elementos de diseño (banners, menús, párrafos, contenido audiovisual) a la limitaciones del dispositivo de acceso, como las dimensiones de la pantalla o la capacidad de procesamiento. Este condicionante, por ejemplo, fuerza a comprimir el peso de las imágenes y otros archivos de elevado caché; también implica suprimir elementos problemáticos (pop-ups, animaciones flash) en la navegación móvil.

Productos/servicios

Por la variedad de diseños disponibles, no existe una página prototípica para exponer los productos y servicios de una empresa. La multinacional californiana Cisco lista sus soluciones de redes y software en divs o bloques, incluyendo el título, un resumen y el enlace, mientras que Apple prefiere dedicar una landing page a cada uno de sus productos, casi siempre de diseño one page que dosifique la información y calidades de sus teléfonos y relojes inteligentes. Sin embargo, todas secciones de productos/servicios de éxito comparten rasgos y elementos, como la presencia de fichas de características técnicas, el uso de abundante material audiovisual o las pruebas sociales, es decir, los testimonios de clientes satisfechos que recomiendan al visitante dar el «sí, quiero» al producto en cuestión.

Acerca de

Indispensable en la estructura de una página web corporativa es la sección ‘acerca de’ o about (si bien recibe múltiples nombres: ‘empresa’, ‘nosotros’, etcétera). «Una excelente manera de distinguirse de la multitud es tener una página about verdaderamente única», ha expresado el diseñador Mark Nutter a Smashing Magazine. Pero la originalidad, aún siendo un atributo deseable, no es el más importante. Las mejores páginas about se caracterizan por ser directas, ordenadas, prolijas en contenido y escaneables de un vistazo. Estas últimas cualidades serían difíciles de conciliar sin el orden. Aunque Ford y Microsoft cuentan con páginas about realmente densas, aciertan al dosificar la información en páginas internas y relacionadas —en el caso de la multinacional de Bill Gates, su página about enlaza con ‘Nuestra empresa’, ‘Staff’, ‘Nuestros valores’, etcétera. Estrechamente relacionada con esta sección de una página web corporativa se encuentran otras como las dedicadas a los afiliados y partners, la sala de prensa o las de oportunidades de empleo, dado que en muchos casos se incorporan a la página de about.

Páginas de contacto y atención al cliente

Estos elementos, a menudo separados en distintas secciones, se vinculan con frecuencia entre sí, siendo en cualquier caso páginas de diseño simple, claro y directo, con la información justa para facilitar las vías de contacto al usuario. Las páginas de contacto, atención al cliente o soporte tienden a confundirse en determinados casos. Buen ejemplo es Amazon, ecommerce que muestra a pie de página la sección ‘¿Necesitas ayuda?’ con un popurrí de opciones relacionadas con la atención al cliente (localizar envíos, Amazon Assistant, etcétera).

Similar es la solución ofrecida por Zappos, cuyo apartado ‘Customer Service’ cumple esta misma función e integra secciones vinculadas frecuentemente con el contacto, como el FAQs o la política de envíos y devolución. Pero no todas las organizaciones se decantan por aglutinar estas secciones. La compañía HP, que cuenta con un diseño paradigmático de cómo hacer una web corporativa, incluye en el footer la sección ‘Contacte con HP’ en el apartado ‘Acerca de nosotros’, separando el apartado de ‘Soporte’ para las páginas relacionadas con la asistencia al cliente.

Blog/noticias

La bitácora y la sala de prensa de un negocio son espacios distintos: la primera comparte los conocimientos de la marca buscando ayudar, atraer o educar a su clientela, mientras que el segundo actúan como un canal de difusión de noticias y comunicados de la empresa. Aunque es imposible detallar en unos párrafos todas las directrices de diseño que garantizan el éxito de un blog, sintetizaremos las fundamentales: (1) desarrollar contenido de valor y calidad para una audiencia determinada, (2) publicar con regularidad y consistencia, y (3) difundirlo a través de las redes sociales, la newsletter y otros canales propicios. Quizá te interese conocer las ventajas que presenta un blog corporativo.

Por su parte, la sala de prensa o press room es un elemento característico de una web corporativa y dispone en principio de una estructura similar a un blog: una especie de página principal con el listado o grid de publicaciones recientes, y las publicaciones propiamente con el titular y el cuerpo del texto. A diferencia de la bitácora, las noticias de la sala de prensa emplean un estilo neutro y un diseño más sobrio, careciendo en ocasiones de sidebar y de banner de suscripción, que sí están presentes en las entradas de un blog.

Páginas legales

El seguimiento legal en páginas web es hoy exhaustivo, y las sanciones por irregularidades –de hasta 600.000 euros en acciones graves– están a la orden del día. La información identificativa básica, la responsabilidad y derechos del usuario o el procesamiento de sus datos personales deben ser accesibles al público visitante (usuarios, clientes, proveedores, etcétera). Tres son las páginas destinadas a facilitar esta información: el aviso legal, la política de privacidad y la política de cookies.

Primeramente, el aviso legal contiene los datos identificativos de la empresa responsable de la web, así como los términos y condiciones generales para navegar por la misma. En la política de privacidad, por su parte, se especifica el procesamiento y uso de la información sensible del usuario, desde su recolección hasta el abandono de su tratamiento, siempre en función del Reglamente General de Protección de Datos (RGPD). Por último, la política de cookies explica qué son estos archivos y detalla su tipología, duración, finalidad y ente regulador que los gestiona.