Debido al cambio en el diseño que hice recientemente, recibí bastantes preguntas de los lectores: cómo lo has hecho, en qué te has basado,... Así que me he decidido a escribirte este artículo para contarte cómo diseñar una portada perfecta para tu blog con la que conseguir suscriptores y mejorar tu marca personal.
Si leíste el artículo anterior habrás visto que hice un rediseño completo de la portada y algunas páginas del blog.
Pues bien, este cambio no ha sido solo por estética, sino que está minuciosamente pensado para aumentar las conversiones a la par que mejoramos la parte estética.
Y no solo puedes ver una portada así en mi blog, sino que en las webs y blogs más importantes del mundo utilizan el mismo tipo de portada.
Por algo será, ¿no?
Y para que aún te creas más que este tipo de portadas funcionan, te voy a poner ejemplos reales con bloggers de habla hispana de éxito.
Seamos sinceros, el clásico diseño tipo blog donde ponías tus últimos artículos o los que tienen más actividad está muy desfasado y nada optimizado.
Así que hay lo primero que deberías hacer es empezar por la página más vista y optimizarla para conseguir conversiones y mejorar tu marca: tu portada.
El diseño para este fin debe ser una mezcla del tipo landing page o página de aterrizaje más secciones que dejen claro quién eres y qué es lo que haces.
El objetivo de este tipo de portadas es ir al grano con lo que ofreces evitando distracciones como sidebar, menús o imágenes que puedan desviar la mirada. Además se optimiza la captación de leads desde el mismo momento que cargue la página, que es lo que realmente se busca.
Respecto a dejar menú o no, debe ser decisión tuya. El menú se aleja del formato landing page y desviará las miradas de tus visitantes.
Tener el menú puesto en la parte superior de la portada no es la opción más recomendable porque disminuirá el ratio de conversión pero en mi caso he decidido ponerlo.
¿Quieres saber cómo diseñan sus portadas los profesionales?
Pues coge papel y boli y ¡vamos a ello!
Contenidos del Post
Diseño General
Como diseñador web, uno de los aspectos que considero más importantes en toda web son los colores corporativos que das a tu blog. No hace falta decir que a la hora pensar cómo hacer una página de portada en WordPress, debemos diseñarla en concordancia con estos colores.
En mi caso, y como puedes ver a lo largo de la web, son el azul, el naranja.
Uno de los colores debe resaltar por encima de los otros (en mi caso el naranja). Su función es dirigir la mirada del lector con el fin de captar su atención.
Por lo tanto, ese color se usará en los «Call to Action» o llamadas a la acción; esto es, en cualquier botón o enlace donde quieres que haga clic el lector.
Una vez aclarados los colores y cómo utilizarlos para captar la atención te preguntarás: ¿Qué debe tener una portada de una web para captar lectores y clientes?
Vamos a ir viendo punto por punto las secciones que debe tener toda portada de una web para conseguir conversiones.
Lo primero: la parte «On Screen»
Esta es la parte de la página de inicio que aparece directamente en las pantallas de los lectores nada más lleguen a la página. Esto es, la parte que se ve directamente al cargar la página sin que tengan que usar el ratón para desplazarse hacia abajo.
Esta sección no debe ir sobrecargada. Debe ser un diseño simple y lo más parecido a una landing page así que incluirá:
- Logotipo: aquí hay poco que decir, en el header de todas las páginas debería estar el logotipo. Mira cómo hacer un logo.
- Lead Magnet con llamada a la acción: debe tener un pequeño texto que exponga qué valor vas a dar con tu lead magnet y un botón de llamada a la acción que abra un formulario de suscripción; o directamente el formulario.
Además, la zona del lead magnet debe ir acompañada de una imagen para hacerlo más atractivo. Puedes utilizar una imagen de la portada del lead magnet o una fotografía tuya si quieres potenciar más tu marca personal. Otra opción es utilizar una imagen de fondo (background) para tu texto y Call to Action.
La clave de esta zona es persuadir con un pequeño texto donde mostrar qué beneficios tendrán por suscribirse y tu regalo que solucione un problema básico de tu público objetivo (el lead magnet).
Salvo esta sección, el resto de secciones las puedes colocar en orden distinto según tus objetivos.
Aquí te dejo de ejemplo la portada de estos cracks donde puedes como es fundamental empezar con la captación de suscriptores:
¿Cómo ayudas a tus lectores?
Esta es la parte donde tienes que contar a todo el que te visite qué es lo que haces.
Si tienes un blog, es la sección ideal para poner las categorías generales de tu blog.
Además, si ofreces algún tipo de servicio o producto, puedes suprimir las categorías para colocar tus servicios, o incluso poner tanto los servicios como las categorías en dos secciones diferentes.
Recomiendo hacer las dos secciones de modo que el lector desde el primer momento sepa sobre qué escribes y qué haces para solventar sus problemas.
Aquí lo más importante es el título introductorio a la sección y el pequeño texto que incluyas en cada apartado.
Un ejemplo de título puede ser «En este blog aprenderás sobre…» o «Lo que encontrarás en mi blog» para las categorías; o «Mis servicios/productos destacados» si decides incluirlos en tu portada.
Importante: Los títulos y textos descriptivos que incluyas en cada apartado no tienen por qué ir optimizados para el SEO. Se trata de hacer ver al lector la calidad de lo que ofreces y que quiera saber más sobre ello.
Deja claro quién eres
Una sección donde expliques brevemente quién eres y qué puedes aportar al lector es imprescindible.
Ojo a esto, porque si digo imprescindible es que lo considero obligatorio para toda portada.
Si no incluiste una fotografía tuya en la sección de la portada que se ve nada más cargar la página, debes incluirla aquí.
Además es fundamental incluir un texto pequeño pero directo para que sepan quién eres.
La clave para esta sección es formularte estas preguntas:
- ¿A quién va dirigido mi blog? Céntrate en tu público objetivo y descríbelo.
- ¿Qué problemas tienen?
- ¿Cómo les ayudo?
- ¿Qué beneficios tienen?
A modo de ejemplo y para que lo entiendas mejor con colores, el texto de esta sección podría ser: «Soy Pepito, masajista de orejas profesional. Con mis servicios y el contenido de este blog ayudo a personas con gafas que sufren dolores en las orejas para que puedan llevar gafas de más de un kilo de peso sin sufrimiento.«
Aquí tienes otros dos ejemplos:
Por último deberías colocar un botón o pequeño enlace hacia tu página de «Sobre mí» o «Acerca de».
¿Que qué te aporta esta sección?
Lo primero de todo confianza y credibilidad. Si tienes un blog profesional tienes que dar la cara aunque estés en internet. Una web o blog donde no se sepa quién está detrás genera bastante desconfianza.
Además, a todo el mundo nos encanta ver que hay alguien detrás y saber algo más sobre él. Al fin y al cabo, un blogger o webmaster no es una máquina, sino que hay una o varias personas detrás de un proyecto.
Y lo segundo que tendrás es una mejoría de tu branding. Dar la cara y atribuirte la autoría de una buena web es la mejor carta de presentación que puedes tener.
[thrive_leads id=’1399′]
Confirma tu reputación
¿De qué sirve decir que eres quién eres y qué haces si no pueden confirmarlo?
Esta sección consiste en añadir testimonios y/o nombres y logotipos de empresas y blogs con los que has trabajado.
Cuanta mayor relevancia tengan estos bloggers y empresas mayor será tu reconocimiento como experto en tu sector.
Puedes colocar los logos donde has trabajado con un título como «He colaborado con…», «Me has podido ver en…», «Los que confían en mí», etc.
Para las reseñas o testimonios de otros blogueros puedes usar un slider con 4 o 5 testimonios de empresas o blog; o, si eres de los que no le gustan los sliders (como yo) pon testimonios cortos de forma que no ocupen un gran porcentaje del espacio de toda la portada.
No olvides poner su fotografía o logo y nombrar su web para contrastar su veracidad. Por supuesto, ni se te ocurra inventártelos si no quieres cargarte tu marca.
Enlaza tus artículos desde la portada
Bien. Ya se han descargado tu lead magnet, saben quién eres, lo que haces y que otros confían en ti. Ahora toca mostrarles algo de tu contenido.
Y aquí viene un gran dilema: ¿mostrar los últimos artículos, los que tienen más comentarios o los que quieres que más se lean?
Eso es una decisión personal que tendrás que meditar. Encontrarás mucha variedad respecto a qué artículos poner en la portada. Incluso hay algunos bloggers reconocidos que no ponen esta sección.
Mostrar los últimos artículos te permite tener tu portada actualizada sin tener que modificarla pero quizás uno de tus últimos artículos no lo consideras relevante como para estar en portada.
Por otro lado, también puedes hacer un mix añadiendo una sección más: una con los últimos artículos, y otra con los artículos más destacados o que más tráfico te generan.
Muy importante para esta sección: si no has añadido un menú en el header de la portada, ¡no te olvides de incluir un botón hacia tu blog!
Otras secciones
Además de todo lo visto, cada portada debe ser única y aquí solo te muestro las diferentes áreas más importantes que puedes añadir a la portada de tu web o blog.
El límite está en tu imaginación y puedes añadir o quitar los apartados que tú consideres para los objetivos que te has marcado.
Redes Sociales
¿Eres un influencer o tienes muchos seguidores en las redes sociales?
Si es tu caso no dudes en añadir una sección con tus números en redes sociales y un pequeño texto de lo que has conseguido en ellas.
¿Eres un youtuber? ¿Por qué no añadir una pequeña sección con tus vídeos más populares?
Incluir el número de seguidores o suscriptores es un buen reclamo para captar lectores.
Seamos sinceros, si vemos que alguien tiene muchos seguidores nos pica la curiosidad y queremos saber más de él y de lo que hace.
Aprovecha tus enlaces de afiliado
Sabes que la portada es la página más vista de tu web, ¿verdad?
Pues si quieres aprovecharla para mejorar tus comisiones con las herramientas o productos que recomiendas puedes añadir una sección con las herramientas que más recomiendas.
Ya hay bastantes casos conocidos de bloggers que usan sus portadas para obtener alguna comisión extra.
Ahora que ya sabes qué secciones son vitales para el diseño efectivo de tu página de inicio solo queda ponerse manos a la obra.
Créeme, diseña una portada profesional y notarás los resultados.
Te toca a ti:
- Comenta qué te ha parecido el artículo y si tienes o estás diseñando una portada profesional.
- Comparte en las redes sociales si te ha gustado.
- Díselo a un amigo que necesite un buen diseño.
¡Nos leemos!
¡Hola David!
Me parece excelente el análisis que haces sobre cada sección. Es un artículo muy completo.
Fíjate que añadir una sección de afiliados en la página de inicio no me lo había planteado, pero es un buen punto. Además de que es muy útil para el usuario saber qué herramientas utilizamos en el día a día.
Por otro lado, lo que mencionas acerca del menú, también me parece muy acertado, ya que no vas a otras páginas y si te interesa, vas viendo el resto de secciones en la misma página de inicio. En mi caso, el menú lo he dejado para que los usuarios puedan ir a otras secciones desde ahí, suponiendo por ejemplo que es un usuario que ya me conoce y para facilitarle el acceso y tener que hacer scroll. Pero estaré midiendo qué tan efectivo es esto.
Un saludo 🙂
Hola Jean,
lo primero gracias por comentar, me es de gran ayuda para ver qué les ha parecido a los demás.
Lo del tema del menú depende mucho de lo que se quiera medir.
Si se quiere hacer una portada tipo landing page pura no debería de existir el menú, pero sí que es verdad que para los que ya te conocen puede ser algo tedioso tener que hacer scroll para poder ir al blog.
Una opción intermedia sería poner un menú diferente con las secciones a las que quieres que vayan de forma directa. Como en mi caso, por ejemplo, que el menú tiene solo dos opciones: una para el blog y otra para captar suscriptores a través del lead magnet.
¡Un saludo!
Muy buen artículo David.
Como bien dices hay que ver qué hacen los grandes para darte cuenta de que yo en mi blog (por ejemplo) no lo he hecho bien 😀 Pero ya estoy intentando cambiarlo, así que tus consejos me vienen genial para el cambio.
¡Gracias!
Gracias a ti por comentar Tania!
Ya verás que en cuanto cambies la página de inicio notas un aumento en las conversiones.
Un abrazo!