Hoy sigo con la serie sobre estructura web y me centro en el contenido principal: la zona donde realmente vive la información, los artículos, las páginas, las ventas y todo aquello que quiero que el usuario lea o haga.

Vengo de hablar del header y del menú de navegación. En este episodio toca la columna principal, y en los siguientes se completa la estructura con la barra lateral y el footer.

Lo primero que planteo es si necesito o no sidebar. Si el contenido ocupa el 100% del ancho, tendré que cuidar mucho la tipografía, los márgenes y la lectura. Si hay una barra lateral, el contenido queda más estrecho, pero gano espacio para navegación, llamadas a la acción o elementos secundarios. La pregunta no es si la sidebar está de moda, sino si está justificada.

El contenido principal debe ser cómodo de leer. Si ocupo mucho ancho con una letra pequeña y sin aire, la página se convierte en un bloque insoportable. Si uso una columna más estrecha, una tipografía adecuada y buen interlineado, el usuario tiene muchas más posibilidades de quedarse.

La paleta de colores también importa. No puedo dificultar la lectura con combinaciones agresivas o bajo contraste. Lo habitual es trabajar con fondo claro y texto oscuro, o variaciones suaves que no cansen. La gente ya lee poco de entrada; si encima le pongo obstáculos visuales, leerá todavía menos.

Otro punto esencial es el espaciado: padding, margin, line-height y separación entre elementos. El contenido no puede aparecer pegado, con líneas aplastadas o formatos inconsistentes. Recuerdo el problema típico de copiar y pegar desde Word, que suele traer estilos extraños. Mejor pegar en modo texto y después dar formato desde el editor.

La tipografía debe ser clara y fácil de leer. Las fuentes decorativas pueden funcionar en un logo o un título puntual, pero no en un artículo entero. Como norma general, dos tipografías son suficientes: una para títulos y otra para cuerpo de texto. Tres solo si hay una razón clara.

También se insiste en no convertir el contenido principal en un cajón de sastre. Si es una web corporativa, no tiene sentido llenar la zona principal con anuncios, elementos que distraen o bloques que no tienen relación con el objetivo de la página. Ahí debe ir la chicha.

Finalmente aparece el tema de las tendencias. No hace falta rediseñar una web cada mes, pero sí conviene revisarla cada dos o tres años para que no parezca abandonada. El diseño ayuda a presentar el contenido. El contenido es el rey, sí, pero el diseño ayuda a que ese rey sea conocido.

En resumen, el contenido principal no es solo "donde va el texto". Es la parte más importante de la experiencia: anchura, colores, tipografías, espacios, jerarquía y foco deben trabajar juntos para que leer sea fácil y para que el usuario entienda qué debe hacer.

Como siempre, gracias por estar ahí al otro lado. Mañana sigo con la barra lateral y el footer, viendo cuál es su papel y cómo pueden ayudar a la conversión.

Hoy sigo con la serie sobre estructura web y me centro en el menú de navegación. Es uno de los elementos más importantes de una página, porque acompaña al usuario en prácticamente toda la web y también envía señales muy claras a Google.

El menú suele estar presente en todas las páginas. Eso significa que sus enlaces se repiten una y otra vez, y por tanto indican cuáles son las secciones principales del sitio. Además, como normalmente está en la parte superior, esos enlaces tienen especial relevancia tanto para SEO como para usabilidad.

Desde el punto de vista del usuario, el menú funciona como mapa. Le dice dónde está lo importante, cómo volver al inicio y cómo contactar. Por eso conviene respetar ciertas convenciones: logo arriba a la izquierda, menú arriba a la derecha, inicio como primera opción y contacto como última.

¿Se puede innovar? Sí, claro. Pero si no hay una razón estratégica muy clara, romper esos patrones suele perjudicar la experiencia. La gente espera encontrar ciertos elementos en ciertos sitios, igual que en un coche espero que los mandos básicos estén donde suelen estar.

También os hablo de los submenús. La recomendación es clara: como mucho un nivel, y si puede ser, ninguno. Los menús desplegables complejos esconden información, complican la navegación y funcionan mal en dispositivos táctiles. Si usas submenú, el elemento principal también debería ser clicable y llevar a una página resumen.

Otro punto importante es el número de opciones. Más de seis empieza a ser demasiado. Si la primera es Inicio y la última Contacto, quedan unas pocas plazas para lo esencial: servicios, productos, quiénes soy, blog o la sección clave del negocio.

La página de quiénes soy merece estar en el menú en muchos casos. Antes de comprar o contactar, mucha gente quiere saber quién hay detrás. Esa visita suele formar parte del proceso de confianza, especialmente en negocios de servicios o ecommerce.

En resumen: el menú debe ser claro, previsible y útil. No es un sitio para meterlo todo, sino para priorizar. Menos opciones, mejor jerarquía, elementos clicables y una estructura que ayude al usuario a encontrar rápido lo importante.

Hoy empiezo una semana especial dedicada a los cinco puntos clave de la estructura de cualquier web. Cada día veré un elemento: header, menú de navegación, contenido principal, sidebar y footer. Y empiezo por el primero: el header o encabezado.

Antes de entrar en materia, Recuerdo tres cosas: la llamada a nuevos invitados para la nueva temporada, los próximos foros para suscriptores de Boluda.com y el programa en directo sobre plugins. Y a partir de ahí voy directo a la arquitectura web.

El header es lo primero que ve el usuario. En menos de un cuarto de segundo ya se está formando una opinión sobre la web, así que no puedo desperdiciar la parte superior de la pantalla con un encabezado enorme, confuso o mal planteado.

La primera recomendación es evitar el superheader. Muchos sitios ocupan demasiada altura porque tienen un logo cuadrado o porque colocan logo y menú en dos líneas. El problema es que cada píxel que consume el header se lo quito al contenido importante. En escritorio puede molestar, pero en móvil todavía más: si el usuario tiene que hacer scroll antes de entender de qué va la web, he perdido parte de la oportunidad.

Como referencia, Recomiendo headers alrededor de los 100 píxeles de alto o menos. En Boluda.com, por ejemplo, el header rondaba los 84 píxeles. Si tengo un logo cuadrado, conviene pedir al diseñador una versión horizontal o apaisada para web, igual que a veces tengo versiones alternativas para fondos oscuros o claros.

La estructura recomendada es sencilla: logo a la izquierda y menú a la derecha. No hace falta reinventar la rueda. Los usuarios ya esperan encontrar esa distribución y eso reduce fricción. Colocar el logo encima y el menú debajo ocupa más espacio. Colocar el menú a la izquierda y el logo a la derecha puede resultar extraño. En usabilidad, muchas veces lo familiar funciona mejor que lo creativo.

También hablo del logo como texto o imagen. Si el título de la web puede ser texto, mejor para SEO, porque Google entiende exactamente qué ve el usuario. WordPress, cuando el theme está bien hecho, usa el nombre del sitio y la descripción como elementos importantes, incluso como título y H1 según el contexto. Una imagen puede usar atributos `alt` y `title`, pero el texto sigue siendo más claro para buscadores.

Otra opción interesante es el header fijo, que se mantiene visible al hacer scroll. Puede ser útil, pero precisamente por eso debe ser bajo. Un header fijo demasiado alto acaba robando espacio constantemente, especialmente en pantallas pequeñas.

En resumen: el header debe ser claro, compacto y esperado. Debe ayudar a identificar la marca, orientar al usuario y facilitar la navegación, no ocupar media pantalla ni competir con el contenido. Logo horizontal, menú claro, altura controlada y nada de inventos que perjudiquen la experiencia.

Enlaces mencionados:

Mañana sigo con el segundo elemento de esta serie: el menú de navegación. Veré cuántos elementos debería tener, qué conviene incluir y qué debería evitar. ¡Hasta mañana!

Muy buenos días a todos y bienvenidos a Marketing Online, el programa en el que vivimos en Internet y soñamos con la vida real. Hoy responderemos a un oyente que nos pregunta cómo hacer linkbuilding.

Pero antes, recordar los tres puntos del día:

Espero que el programa os guste y que podáis aplicar todo lo que os he mencionado. En el caso que sea así, ya sabéis que esa valoración de 5 estrellas en iTunes será el mejor regalo del mundo entero :)

Hoy os hablo de la etiqueta title y de la metaetiqueta description, dos pequenos fragmentos de codigo que tienen muchisimo impacto en SEO, visibilidad y clics desde Google.

Antes de entrar en materia, recuerdo la llamada a invitados del podcast, los foros para alumnos y el directo sobre plugins previsto para septiembre. Y ahora si, vamos con dos conceptos tecnicos traducidos a lenguaje de la calle.

El title es el titulo de la pagina a nivel de codigo. El usuario puede verlo en la pestana o barra del navegador, y Google suele usarlo como el enlace principal azul en los resultados de busqueda. Por eso es tan importante: ayuda a Google a entender de que trata la pagina y ayuda al usuario a decidir si hacer clic.

La recomendacion es no desperdiciarlo con nombres que solo entiende quien ya me conoce. Si soy una carpinteria de aluminio en Valladolid, no basta con poner el nombre de la empresa. Conviene incluir la busqueda generica por la que quiero aparecer: servicio, especialidad y ubicacion si aplica.

La description, en cambio, es una metaetiqueta. No aparece dentro del contenido visible de la pagina, pero Google puede mostrarla como fragmento descriptivo bajo el resultado. Y aqui llega una confusion muy habitual: la meta description no posiciona directamente como factor SEO clasico.

Entonces, ¿por que importa? Porque influye en el clic. Es el texto que puede convencer al usuario cuando me ve en la pagina de resultados. Si el title ayuda a Google y al usuario a entender el tema, la description debe actuar como una invitacion breve, clara y persuasiva.

Recomiendo aprovechar bien esos caracteres, sin quedarse demasiado corto ni pasarse para que se corte. La idea es escribir para humanos: que ofrezco, por que deberian entrar, que beneficio van a encontrar o que diferencia me hace relevante.

Otro detalle interesante es que las palabras buscadas pueden aparecer en negrita si coinciden con el title o la description. Eso aumenta visibilidad y ayuda al usuario a reconocer rapido que mi resultado encaja con su intencion.

Enlaces mencionados:

En resumen: cuidad el title pensando en SEO y claridad, y cuidad la description pensando en el clic. Dos lineas bien escritas pueden marcar la diferencia entre aparecer y recibir visitas.

Como siempre, gracias por vuestras valoraciones de cinco estrellas y por escuchar el podcast. Nos escuchamos manana con mas marketing online.