Cómo negociar qué contenidos deben aparecer en la homepage

¿Cada campaña acaba ocupando un hueco en la homepage? Aprende a priorizar contenidos y a proponer alternativas con criterio.

Diseño homepage

Llega el momento de diseñar la homepage y empiezan a aparecer peticiones.

«Hay que destacar el proyecto nuevo.»

«También tenemos una campaña que termina este mes.»

«El próximo evento debería verse nada más entrar.»

«Podemos poner un aviso flotante encima del hero.»

«Y el premio que nos dieron, que da mucha confianza.»

Como siempre, cada petición tiene una explicación más que razonable: El proyecto nuevo ha requerido meses de trabajo, así que tenemos que lucirlo; necesitamos resultados, así que la campaña tiene que ser fácil de encontrar; el evento es dentro de muy pronto y necesitamos vender muchas entradas; el premio ha sido muy importante para el equipo y tenemos que motivarlos…

El problema aparece cuando todas esas prioridades internas terminan compitiendo entre sí.

Primero añadimos una pequeña franja encima de la cabecera. Después, otro destacado sobre el hero. Más adelante incorporamos un popup, un carrusel con tres campañas y una sección de novedades. Al final, la homepage parece el tablón de anuncios de una organización en la que todos los departamentos han conseguido reservar su espacio.

En este artículo, vamos a analizar cómo llevar esa conversación con el cliente, qué alternativas podemos proponer y qué reglas ayudan a mantener la jerarquía visual de la homepage cuando cambian las campañas y las prioridades.

Todas las peticiones responden a una necesidad legítima

Cuando un cliente propone añadir un elemento a la homepage, rara vez lo hace porque quiera complicar el diseño.

Quiere que una campaña consiga más visitas. Que un proyecto importante no pase desapercibido. Que los usuarios conozcan un servicio nuevo. Que el trabajo del equipo tenga reconocimiento. Que una inversión reciente produzca resultados.

La petición suele llegar formulada como una solución:

«Vamos a poner un banner encima del hero.»

Pero nosotros tenemos que entender la necesidad real que hay detrás:

«Queremos que más personas conozcan este proyecto.»

Esta diferencia es fundamental. Entender esto, cambia por completo nuestro papel como diseñadores y la conversación que tendremos con nuestro cliente.

Si aceptamos directamente la solución, nuestra capacidad de diseño queda reducida a decidir dónde colocarla, qué tamaño tendrá o qué color le pondremos. Si recuperamos el objetivo, podemos valorar muchas más opciones.

Quizá el proyecto necesite una landing con un contenido mejor y más claro.

Quizá la audiencia adecuada llegue desde una newsletter, una campaña de publicidad o determinados artículos del blog.

Quizá tenga sentido integrarlo en un bloque dentro de la homepage.

Quizá solo resulte relevante para los usuarios de una sección concreta.

El cliente conoce el negocio, sus prioridades y las circunstancias que rodean la petición. Nuestro trabajo consiste en aportar conocimiento sobre el comportamiento del usuario, la jerarquía de la interfaz, la conversión y las posibilidades técnicas de la web.

La conversación funciona mejor cuando combinamos ambas perspectivas.

Qué ocurre cuando las prioridades se acumulan

La homepage suele ser uno de los espacios más disputados porque ofrece mucha visibilidad.

Marketing quiere mostrar las campañas activas. Comunicación necesita destacar las últimas noticias. Ventas pide un acceso directo a determinados productos. Recursos Humanos quiere anunciar vacantes. Dirección considera imprescindible el vídeo corporativo.

Cada responsable defiende su objetivo, que es válido y tenemos que respetarlo. La dificultad está en decidir cuánto peso debe tener cada objetivo dentro del recorrido del usuario.

Si trasladamos directamente la estructura interna de la empresa a la interfaz, la página termina representando el organigrama. El usuario, en cambio, organiza la información según sus propias necesidades.

El usuario no reparte su atención entre departamentos. Tampoco conoce el presupuesto invertido en cada iniciativa ni el esfuerzo que ha supuesto desarrollarla.

Una campaña puede ser muy importante para la empresa y afectar únicamente a una parte pequeña de quienes visitan la web. Una oferta de empleo puede resultar prioritaria para Recursos Humanos y quedar fuera del recorrido del usuario que quiere comprar el producto. Un premio puede reforzar la confianza, pero puede que funcione mejor junto a testimonios y casos de éxito que encima del hero.

A medida que aparecen nuevos destacados, todos empiezan a competir.

En móvil, la acumulación resulta todavía más evidente. La barra superior, la cabecera y el primer aviso pueden ocupar casi todo el primer viewport. El usuario tiene que hacer scroll antes de enterarse de qué va la web.

Además, cada nuevo componente introduce decisiones de diseño que alguien tendrá que resolver:

  • si puede cerrarse;
  • cuándo vuelve a mostrarse;
  • cómo se adapta a una pantalla pequeña;
  • qué ocurre cuando el texto crece;
  • quién actualiza el contenido;
  • quién se responsabiliza de retirarlo;
  • qué elemento ocupará ese espacio después;
  • cómo mediremos su rendimiento.

Una petición temporal puede convertirse rápidamente en una pieza permanente de la estructura, que dará más trabajo de mantenimiento a quien se ocupe de la actualización de los contenidos.

El hero tiene una función concreta

Buena parte de estas peticiones termina en el hero porque es la zona más visible de la homepage.

El razonamiento parece lógico: si queremos que algo se vea, debemos colocarlo nada más entrar.

Sin embargo, que algo sea visible no garantiza que el usuario le preste atención ni que lo comprenda. Cuando el primer bloque contiene demasiados mensajes, el usuario tiene que decidir qué leer para poder entender qué ofrece la web.

El hero necesita proporcionar contexto suficiente para responder a las primeras preguntas que se hace el usuario:

  • ¿Dónde estoy?
  • ¿Qué puedo encontrar aquí?
  • ¿Esto puede servirme?
  • ¿Cuál es el siguiente paso?

En algunos proyectos tendrá una llamada a la acción principal. En otros distribuirá hacia varias áreas. También puede presentar una campaña temporal cuando esa campaña representa una prioridad amplia y coherente con la mayoría del tráfico.

El problema surge cuando utilizamos el hero como superficie disponible para cualquier novedad.

Lo que pide el cliente y lo que realmente necesita

La siguiente tabla ayuda a desplazar la conversación desde la solución propuesta hacia el objetivo.

El cliente pide…Lo que quiere conseguirAlternativas que podemos valorar
«Pon un destacado flotante encima del hero para este proyecto»Dar visibilidad al proyecto y conseguir visitasCrear una landing que explique bien el proyecto, enlazarla desde páginas relacionadas y dirigir tráfico mediante email, redes sociales, relaciones públicas o publicidad. Si interesa a gran parte de la audiencia, puede aparecer como un bloque integrado dentro de la homepage.
«Añadamos un banner para esta campaña»Llevar usuarios hacia una oferta temporalOptimizar la landing, ajustar su mensaje y atraer tráfico cualificado. El banner puede complementar la campaña cuando la audiencia de la home coincide con la de la oferta.
«Tiene que verse nada más entrar»Evitar que el contenido pase desapercibidoRevisar a quién interesa y en qué momento necesita verlo. Podemos colocarlo en una sección relacionada, incluirlo en la navegación o segmentarlo según la procedencia del usuario.
«Ponlo en todas las páginas»Alcanzar al mayor número posible de personasMostrarlo en las páginas relacionadas con la iniciativa o reservar el aviso global para cambios que realmente afecten a todo el mundo.
«Añadamos otro botón al hero»Facilitar una segunda acción importanteMantener una acción principal y situar la secundaria cuando el usuario tenga más contexto. También puede aparecer en la navegación o en un bloque posterior.
«Metamos todas las promociones en un carrusel»Dar visibilidad a varias campañas al mismo tiempoPriorizar una campaña, crear una zona específica de promociones o personalizar el contenido según la categoría visitada. Las demás pueden apoyarse en otros canales.
«Queremos poner las últimas noticias en la home»Comunicar que la empresa está activaSeleccionar una noticia que aporte valor al usuario, mostrar casos recientes o mantener un acceso claro a la sección de actualidad.
«Hay que destacar el premio»Reforzar la autoridad y la confianzaIntegrarlo junto a testimonios, clientes, cifras o casos de éxito, donde puede funcionar como prueba.
«Mostremos todos los servicios en el primer pantallazo»Evitar que alguien se marche sin descubrir la ofertaExplicar la propuesta de valor y presentar después los servicios agrupados por necesidades. La navegación también puede facilitar el acceso directo.
«Pongamos un popup para anunciarlo»Conseguir atención inmediataIntegrar la información en el recorrido adecuado, usar un aviso menos intrusivo o activar el popup únicamente en condiciones concretas.
«Solo estará dos semanas»Justificar una excepción temporalDefinir la fecha de retirada, la persona responsable y el criterio que se aplicará a futuras campañas. También podemos prever un componente temporal dentro del sistema.
«No podemos quitar nada»Mantener representadas todas las prioridades internasRevisar datos, ordenar contenidos por objetivos y decidir qué perderá visibilidad cuando incorporemos el nuevo elemento.

Esta tabla no pretende ofrecer respuestas automáticas para todas las situaciones. Su objetivo es ampliar las opciones que podemos valorar con el cliente.

Un banner puede ser una buena solución cuando la campaña resulte relevante para una parte importante del tráfico de la homepage. Un aviso global puede estar justificado si comunica una incidencia, un cambio importante o una información que afecta a todo el mundo.

La decisión depende del objetivo, la audiencia, el momento y el coste que introduce en el resto de la experiencia del usuario.

Cómo llevar la conversación hacia el objetivo

Decir «no podemos poner ese banner ahí porque no queda bien» aporta poco. El cliente puede interpretar que estamos defendiendo una preferencia estética y responder con otra preferencia.

Una conversación más útil puede seguir tres pasos.

1. Reconocer la necesidad

Primero confirmamos que hemos comprendido qué quiere conseguir:

«Entiendo que queréis dar más visibilidad a este proyecto y aprovechar el tráfico que recibe la homepage.»

En ese momento solo estamos confirmando que hemos entendido la necesidad que hay detrás de la petición, todavía no estamos aprobando la solución.

Este paso también evita que el cliente tenga que defender la importancia del proyecto. Ya hemos reconocido que es importante. Ahora podemos analizar cómo comunicarlo.

2. Explicar el coste de la solución propuesta

Después describimos las consecuencias concretas:

«Si añadimos otro destacado encima del hero, la propuesta principal bajará y en móvil puede quedar fuera del primer viewport. Además, ya tenemos un aviso activo en esa zona y ambos competirán por la atención.»

El argumento tiene que relacionarse con la experiencia, la conversión, el mantenimiento o la implementación.

Podemos explicar, por ejemplo, que:

  • la nueva llamada a la acción compite con la principal;
  • el contenido relevante aparecerá más abajo;
  • el aviso interesa a una audiencia muy pequeña;
  • la versión móvil quedará demasiado ocupada;
  • el elemento exige una gestión que todavía no está definida;
  • ya existe otro canal más próximo a la audiencia objetivo.

Así el cliente puede entender el impacto de la decisión.

3. Proponer varias opciones

Finalmente, ofrecemos alternativas proporcionadas:

«Podemos integrar el proyecto en un bloque dentro de la home, mostrarlo durante el periodo de campaña o trabajar una landing específica y llevar tráfico desde los canales donde sabemos que está su audiencia.»

No todas las alternativas tienen que excluir la homepage. La clave está en decidir qué papel desempeñará dentro del recorrido.

También ayuda presentar opciones con diferentes niveles de alcance y esfuerzo:

  • una mejora inmediata dentro de la página;
  • una solución de campaña con landing y otros canales;
  • un cambio estructural para gestionar futuras iniciativas.

Una buena respuesta reconoce el objetivo, explica el riesgo y propone una forma viable de avanzar, no se limita a decir que no se puede hacer lo que el cliente propone.

Qué preguntar antes de añadir un nuevo destacado

Antes de diseñar, conviene responder estas preguntas con el cliente o con los equipos implicados.

¿Qué resultado queremos conseguir?

Necesitamos formular el objetivo de manera concreta:

  • conseguir inscripciones;
  • aumentar las visitas a un proyecto;
  • vender un servicio;
  • atraer candidatos;
  • incrementar descargas;
  • comunicar un cambio importante.

«Dar visibilidad» describe una intención, pero todavía no permite evaluar el resultado. Podemos concretarla preguntando qué esperamos que haga el usuario después de ver el contenido.

¿A quién le interesa?

Una información que afecta a todo el mundo puede justificar una posición global. Una iniciativa dirigida a un público específico necesita un contexto más preciso.

También debemos considerar qué conocimiento previo tiene el usuario. Una persona que ya conoce la campaña puede responder a un mensaje breve. Quien la descubre por primera vez necesitará más explicación.

¿La homepage forma parte de ese recorrido?

Podemos comprobar desde dónde llega la audiencia y qué páginas visita.

Quizá la campaña se difunde principalmente por correo y sus usuarios entran directamente en la landing. Quizá el proyecto está relacionado con varios artículos que reciben mucho más tráfico cualificado que la homepage. O quizá la página de inicio sí constituye un punto habitual de orientación para ese público.

Los datos ayudan a elegir el canal y la ubicación.

¿Qué desplazamos para hacerle sitio?

Cada elemento nuevo modifica la jerarquía: puede retrasar la propuesta principal, introducir otra CTA, aumentar la longitud en móvil o reducir la atención que recibe un contenido anterior.

Así que conviene formular la decisión de manera explícita:

«Si este proyecto pasa a ser la prioridad principal, ¿qué contenido deja de ocupar ese lugar?»

La pregunta ayuda al cliente a comparar las prioridades antes de decidir.

¿Durante cuánto tiempo estará activo?

Los contenidos temporales necesitan una fecha de inicio, una fecha de retirada y una persona responsable.

También conviene decidir qué ocurrirá después: si se eliminará el bloque o si se sustituirá por otra campaña.

¿Cómo sabremos si ha funcionado?

Cada elemento se mide según el objetivo para el que fue diseñado.

Si un banner busca llevar tráfico a una campaña, podemos medir sus clics, su tasa de clic y el volumen de sesiones que genera en la landing. Si pretende aumentar las descargas de un recurso, tendremos que registrar esa acción. Si facilita solicitudes comerciales, analizaremos los contactos iniciados desde ese recorrido.

En GA4 podemos configurar un evento para el clic sobre el destacado e incluir parámetros como su ubicación, el nombre de la campaña o el texto de la CTA. De esta manera podremos distinguir el tráfico procedente de la homepage del que llega desde otros canales.

Si el tráfico cualificado, proveniente de otros canales, convierte más que el tráfico que viene desde la homepage, tendríamos más argumentos para proponer eliminar el banner de la homepage.

Cómo evitar que la homepage pierda coherencia con el tiempo

Una homepage puede estar bien resuelta el día de la publicación y que el diseño se rompa durante los meses siguientes.

Las campañas cambian. Aparecen nuevas prioridades. Distintas personas editan el sitio. Cada necesidad puntual puede introducir un color, un tamaño, un estilo de botón o un comportamiento diferente.

Por eso, además de diseñar la página, tenemos que definir cómo se va a actualizar y quién va a gestionar los contenidos, antes de que aparezca la siguiente campaña.

Crear reglas editoriales

En proyectos con campañas frecuentes, conviene acordar:

  • qué tipos de contenido pueden destacarse;
  • en qué zonas pueden aparecer;
  • cuántas campañas pueden estar activas;
  • cuánto tiempo permanecen;
  • quién aprueba su publicación;
  • quién se responsabiliza de retirarlas;
  • qué métricas se revisarán.

Estas reglas reducen la necesidad de volver a discutir toda la jerarquía cada vez que aparece una iniciativa.

Diseñar componentes específicos

Podemos crear un bloque previsto para campañas temporales con una estructura clara:

  • etiqueta opcional;
  • titular breve;
  • descripción limitada;
  • una única CTA;
  • imagen con una proporción definida;
  • comportamiento previsto para móvil.

El bloque puede aparecer dentro de una zona concreta de la homepage. Así las campañas cambian de contenido sin introducir un diseño nuevo cada vez.

También podemos preparar variantes según la importancia:

  • una mención breve dentro de un bloque editorial;
  • una tarjeta destacada;
  • una campaña principal que sustituye temporalmente a otro contenido;
  • un aviso global reservado para información crítica.

Trasladar las reglas a WordPress

En WordPress, podemos convertir estos criterios en herramientas concretas.

Un patrón sincronizado permite mantener la estructura del destacado y actualizarlo desde un único lugar cuando aparece en varias páginas. Si cada instancia necesita contenido distinto, podemos crear un patrón no sincronizado con una estructura aprobada.

También podemos bloquear determinadas opciones del patrón para que la persona que edita cambie el contenido sin modificar accidentalmente la composición. Dependiendo de la implementación, podemos restringir:

  • el movimiento o la eliminación de ciertos bloques;
  • la inserción de nuevos bloques dentro del componente;
  • los colores disponibles;
  • los tamaños tipográficos;
  • los espaciados;
  • las alineaciones;
  • los estilos de botón.

Cuantas menos decisiones arbitrarias tenga que tomar cada equipo, más fácil será mantener la coherencia.

Los permisos también forman parte del sistema. No todas las personas necesitan capacidad para modificar la estructura de la homepage. Podemos separar la edición de contenidos de los cambios de diseño o reservar determinadas acciones para perfiles con mayor responsabilidad editorial.

Por último, la documentación tiene que explicar el criterio de uso. Un patrón técnicamente correcto puede utilizarse mal si nadie sabe cuándo corresponde activarlo.

El sistema debe permitir cambios frecuentes sin obligar a rediseñar la homepage con cada campaña.

Diseñar la homepage también implica negociar prioridades

Una homepage reúne decisiones de negocio, contenido, diseño y tecnología. También hace visibles las tensiones de una organización porque varios equipos quieren ocupar el espacio con mayor atención.

Nuestro trabajo consiste en ayudarles a comparar prioridades y comprender el coste de cada decisión.

A veces una campaña merece un bloque principal. Un aviso puede necesitar presencia global porque afecta a todas las personas. Un destacado temporal puede orientar hacia una iniciativa relevante para buena parte de la audiencia.

En otros casos, la landing, el correo, las redes sociales, la publicidad o las páginas relacionadas ofrecerán un recorrido más eficaz.

La mejor respuesta aparece cuando entendemos qué necesita conseguir el cliente, a quién se dirige y qué lugar ocupa la homepage dentro de ese recorrido.

Negociar prioridades no consiste en defender el diseño frente al negocio. Consiste en construir un sistema con el cliente que permita al negocio comunicar lo importante y al usuario avanzar con facilidad.

¡Suscríbete gratis!

Recibe en tu buzón contenido inédito y personal sobre diseño y negocios online con WordPress, en qué ando metida y otras novedades.

Responsable: Ana Cirujano Garzo · Finalidad: Enviarte contenidos y novedades sobre diseño y WordPress · Legitimación: Tu consentimiento · Derechos: Puedes acceder, rectificar o suprimir tus datos cuando quieras.

¡No hago spam! Lee la política de privacidad.

Te lo ha contado

Ana Cirujano

Soy diseñadora y ayudo a negocios online a fortalecer su marca, mejorar la experiencia de usuario y obtener mejores resultados.

Antes de irte, echa un vistazo

Comparte este artículo

Si te ha gustado, compártelo con tus amigos; si no te ha gustado, compártelo con tus enemigos, ¡pero compártelo!