Cómo diseñar una página de inicio efectiva para tu web

Dos segundos es el tiempo que necesita el usuario que llega a tu página de inicio por primera vez para formarse una opinión sobre tu web.

Si el primer impacto ha sido positivo te habrás ganado otros siete segundos para que escanee toda la homepage y decida si sigue navegando por tu sitio o si se marcha por donde ha venido.

Así que nueve segundos es lo que tienes para seducir a tu visitante y convencerle de que ha llegado al lugar adecuado, de ahí la importancia de hacer una página de inicio efectiva.

Piensa en ella como en el escaparate de una tienda física, en cuanto echas un vistazo a través del cristal sabes si te gusta o no lo que ves. Si tu primera impresión es negativa esa tienda ya puede darte por perdido.

Mucha gente compra una plantilla y empieza a meter todo el contenido que se le ocurre en la homepage sin estrategia alguna, no reflexionan sobre dónde ubicar cada elemento, qué cantidad de texto van a meter, qué pretenden conseguir… y luego nos quejamos de que la web no nos está dando los resultados que esperábamos…

Página de Inicio estática vs entradas del blog

Esta duda me la plantean muchos lectores ¿Qué pongo, una página de inicio con mis últimas entradas del blog o una página tipo landing? ¿Qué es mejor de cara al SEO? ¿Si soy una empresa que me conviene más?

Aquí no hay una respuesta acertada para todo el mundo. En la primera versión de mi web la página de inicio era tipo landing, luego pasé al formato blog y ahora vuelvo a tener una página estática.

Si tu blog tiene mucho tirón y el objetivo de tu web no es vender servicios o productos opta por el formato blog.

Si eres una empresa o emprendedor que vende algo, ya sean productos o servicios te recomiendo que optes por el formato landing, más que nada porque esta página de tu web será una de las que más visitas reciba, así que deberías aprovecharlo para conseguir conversiones. De esto te hablo más en el siguiente apartado.

Y en cuanto al SEO decirte que en la página estática tienes más control sobre todos los textos, los h2, etc. Si es tipo blog esos contenidos irán cambiando según vayas publicando entradas y unas veces te favorecerán más que otras.

De todas formas piensa que puedes optar por una fórmula mixta en la cual tienes una página estática con un apartado dedicado a tus últimas entradas. Esta estrategia es interesante porque le da visibilidad a tus entradas, el usuario ve de qué hablas en tu blog en un instante y además estás aportando más contenido relacionado con la temática de tu web, con lo cual estarás favoreciendo que Google vaya posicionando los términos relacionados con tu negocio.

Solo una advertencia. Si pones aquí tus entradas que sea solo un breve extracto de las mismas, si se muestra demasiado texto puedes generar problemas de contenido duplicado.

La página de inicio tiene un único propósito

En tu opinión ¿Para qué crees que sirve la página de inicio de una web? Te doy varias opciones:

• Debe ser un resumen de todo lo que puede encontrar el visitante en el sitio.
• Debe informar a tus clientes de los servicios que pretendes vender.
• Debe crear una primera impresión positiva mediante un diseño atractivo.

¿Cómo lo ves? ¿Te decantas por alguna de ellas? Porque si es así siento decirte que estás cometiendo el mismo error que comente la inmensa mayoría de emprendedores que hacen su propia web.

Te voy a poner un ejemplo muy concreto. Muchos diseñadores gráficos se esfuerzan en tener una página de inicio muy visual, donde sus diseños toman todo el protagonismo con la esperanza de que el potencial cliente caiga rendido ante la calidad de los trabajos que se muestran.

¿Por qué no es una estrategia adecuada? Porque el diseñador se está centrando en sí mismo, en sus cualidades y en los trabajos que considera mejores.

Pero ¿Y si el cliente no tiene ni idea de diseño? ¿Y si no sabe distinguir entre un trabajo normalito y uno de alta calidad? ¿Y si no llega a comprender cómo puede ayudar el trabajo del diseñador a su negocio?

En ese caso llegará a tu web, dirá “sí, muy bonito” y se irá porque no has sabido explicarle cómo puedes ayudarle.

El propósito principal de toda página de inicio debe ser conseguir que tu visita realice alguna acción en tu web. Recuerda la comparación con un local físico, la página de inicio es un escaparate, luego queremos que entren en nuestra tienda.

¿Qué tipo de acción queremos que haga? Eso ya lo decides tú, puede ser que te deje un email, que realice una compra, que te contacte via email, que lea una entrada de tu blog, etc. O como mínimo que hayas captado su atención y siga navegando hacia otras secciones.

¿Crees que vas a conseguir todo esto hablando de ti y de lo bueno que eres? Ya te digo yo que no. En la página de inicio tienes que mostrar a tu cliente potencial cómo puedes ayudarle a solucionar su problema.

En el caso del diseñador que te estaba poniendo como ejemplo, sería mucho más efectivo explicar cómo sus servicios pueden solucionar los problemas que pueda tener el cliente.

Si solo muestras tus mejores diseños (y ten en cuenta que el gusto es subjetivo) estarás hablando de ti, de lo bien que diseñas y de lo bueno que eres en lo tuyo, cuando deberías estar hablando del cliente, de los problemas que tiene y cómo puedes ayudarle a solucionarlos.

El primer error que comete mucha gente en su página de inicio es centrarse en lo que quieren que el cliente lea, cuando deberían centrarse en lo que el cliente necesita.

Tu visitante no quiere escuchar lo que tú le quieras decir, quiere escuchar que tienes la solución a su problema.

Si consigues convencerle de que tienes una solución para él, estarás mucho más cerca de que realice la acción que buscabas y por tanto de que tu homepage haya cumplido con su cometido.

El contenido siempre va antes que el diseño

Siguiendo con la lógica del punto anterior pensaremos siempre en el contenido antes que en el diseño. Lo más importante es que tengas claro el mensaje que quieres enviar y luego ya lo pondremos todo bonito.

Es mejor que llegues a la reunión con un cliente con unos vaqueros, una camiseta y un gran producto, que llegar con un traje de 2000€ y un producto que no hay quien lo compre.

¿Ves por dónde voy? Primero consigue un producto y un mensaje potentes, luego ponte el traje. Internet está lleno de blogs con diseños obsoletos, pero con información valiosa. Mientras aportes valor la gente irá a tu web, aunque el diseño no sea el más cuidado del mundo.

Al contrario la cosa no funciona igual.

La importancia del copywriting en tu homepage

A la hora de generar los contenidos para crear tu página de inicio te recomiendo que analices los siguientes puntos:

Quiénes son tus clientes

Este tema te puede parecer una obviedad, pero debes tener clara la edad de tu cliente, su poder adquisitivo, sexo, nivel educativo, gustos e intereses, las redes sociales en las que se mueve, etc.

Esa información marcará:

• El tono en el que te comunicarás con él, no te puedes dirigir igual a un joven de 20 años sin estudios que a un ejecutivo de 45.
• El tipo de producto que vas a ofertar.
• Las cualidades que quieres destacar de tus servicios.

Si tienes claro cuál es tu cliente serás capaz de definir mucho mejor el mensaje y por tanto las posibilidades de que éste sea efectivo se multiplicarán.

Cuáles son sus problemas

Lamento decírtelo pero tú no tienes el poder de crear necesidades en los demás y por tanto no puedes vender lo que quieras, tienes que vender lo que tu cliente necesita. Si quieres tener un negocio exitoso primero necesitas identificar los problemas de tus clientes y luego ser capaz de aportar una solución.

Si decides lanzar un proyecto sin conocer las necesidades del cliente y luego resulta que no hay una demanda real del producto que vendes, tu aventura empresarial durará muy poco.

Para ilustrar este punto te voy a poner mi propio ejemplo. Cuando empecé como diseñador freelance ofrecía todo tipo de servicios relacionados con el diseño (logotipos, identidad corporativa, infografías, 3D, animaciones, diseño web, diseño publicitario, etc.), básicamente porque no tenía ni idea de cuáles eran las necesidades reales de mi cliente.

A día de hoy solo ofrezco una serie de servicios muy concretos y le doy toda la prioridad a WordPress. Ahí está mi cliente. Mi cliente necesita una web y más concretamente un tipo de web que pueda gestionar el mismo y que esté preparada y diseñada para generar ingresos.

Eso es lo que hago. No hago webs de directorios de anuncios ni hago diseño 3D. Hago lo que he visto que me demandaban más y me esfuerzo porque mi página de inicio ofrezca respuestas y soluciones a ese tipo de cliente.

Todo lo que mi cliente no demanda lo he descartado. No tiene sentido que me empeñe en intentar vender un producto que no me pide nadie.

Qué soluciones puedes aportarles

Si has identificado correctamente a tu cliente y conoces sus necesidades no debería costarte demasiado diseñar una solución para él.

Ahora toca presentarla en tu página de inicio de una forma clara y concisa. Mi consejo es que te centres en el beneficio que obtendrá el cliente.

Si te fijas en mi homepage la frase que se lleva todo el protagonismo es “Aprende a hacer tu propia web con WordPress”. Desde el primer instante dejo claro qué beneficio va a conseguir el usuario que llega a mi sitio.

Este debe ser el elemento con mayor protagonismo de la página, así que destácalo como se merece e intenta no eclipsarlo con imágenes llamativas, colores chillones o cualquier otra cosa que distraiga la atención del usuario (botones, cajas, enlaces, etc.).

Estructura efectiva en una página de inicio

Un consejo, no intentes reinventar la rueda.

Cuando me llega un cliente y me empieza a decir que quiere algo espectacular, fuera de lo común, diferente a todo lo que hay por ahí, etc. Primero tiemblo y luego le pregunto por qué.

¿Por qué quieres algo radicalmente distinto? La respuesta habitual es que todas las páginas le parecen iguales, todas tienen la misma estructura y él quiere algo más original.

Mi respuesta siempre es la misma. Si hay tantas páginas con un formato similar es porque dicho formato está más que contrastado y funciona.

El usuario ha desarrollado unos hábitos de navegación por Internet y va a esperar que el menú esté en la parte superior, si se lo cambiamos de sitio vamos a desconcertarle y a obligarle a buscarlo. Si nos ponemos demasiado “innovadores” en el mejor de los casos estaremos incomodando a nuestro invitado, en el peor estaremos provocando que pierda la paciencia y se vaya ¿Te parece que merezca la pena?

El problema que subyace en esta situación ya te lo comenté antes, mi cliente (o el emprendedor que quiere crear su propia web) está pensando egoístamente desde su punto de vista: Yo quiero algo original, Yo no quiero tener lo mismo que todo el mundo, Yo quiero que mi web sea única.

¿Qué tal si pensamos en el usuario? Queremos que el usuario se sienta cómodo, que le resulte fácil navegar, que encuentre la información que necesita.

¿Quieres que tu visitante se quede con la boca abierta o que se convierta en un cliente? Tú decides, pero yo te voy a explicar cómo hacer una homepage efectiva, no una homepage de fantasía.

Elementos comunes a todas las páginas de la web, no solo a la de inicio

Estos se muestran en todas las páginas de la web, pero lógicamente forman parte de la homepage también, así que vamos a ver cómo optimizar su uso.

El logotipo

Hay muchos diseñadores que le dan una importancia capital al logotipo. En mi opinión el logotipo tiene una importancia relativa y cuando hablamos de una web con que no desmerezca al resto de la página me basta.

Creo que hay que mimar otros muchos aspectos antes que el logotipo, sinceramente.

Dicho esto, el logo deberías colocarlo:

• En la parte superior a la izquierda.
• En el centro como único elemento.

Si lo pones arriba a la izquierda no te pases con el tamaño, debe encajar bien con el header de tu web y no cobrar demasiado protagonismo. Recuerda que tu mensaje principal es el que debe captar la atención. Mi web sería un ejemplo de dicha ubicación, aquí te dejo otro.

También puedes situarlo en el centro. Ahí ganará presencia, aunque en muchos casos perderás un espacio valioso en la cabecera de tu web. En algunas páginas minimalistas o de fotógrafos esta fórmula funciona bastante bien.

El menú principal

Cuanto más sencillo y claro mejor, aunque aquí estarás condicionado por la cantidad de páginas que tengas, categorías, etc. Como mínimo debería tener los siguientes apartados:

• Sobre mí.
• Servicios.
• Blog.
• Contacto.

Luego puedes añadir una galería de fotos, un portfolio, testimonios de clientes, categorías del blog, tus instalaciones, ofertas y descuentos, etc. Esto ya dependiendo de a qué te dediques y qué quieras que esté accesible a simple vista.

Si tu web tiene muchos contenidos una buena idea puede ser el colocar una caja de búsqueda para que el usuario encuentre lo que necesita con mayor facilidad. En mi opinión Blogger 3.0 es un buen ejemplo de cómo utilizar los menús.

Si tus publicaciones son muy extensas también puede ser interesante el fijar el menú a la parte superior de tu web y que este vaya acompañándote según haces scroll. En mi blog lo tengo hecho así, aunque no en la homepage.

El footer

Esta suele ser una parte destinada a la información corporativa, las páginas legales y la información de contacto. También puedes utilizarlo para poner los enlaces a tus redes sociales y un formulario de suscripción.

Hace unos años se pusieron de moda los footer con un montón de contenidos y tantos enlaces que parecían una segunda web, la tendencia hoy en día es a la inversa, vamos hacia el minimalismo y por tanto los pies de página cada vez contienen menos información y apartados.

Elementos específicos de una buena página de inicio

Ahora sí, vamos a ver las secciones específicas de una homepage efectiva.

El mensaje principal y la llamada a la acción

Aquí llegamos al meollo de la cuestión, inmediatamente debajo del logo y el menú debería aparecer tu mensaje principal (ese que has definido después de analizar a fondo a tu cliente y sus necesidades) y tu llamada a la acción para que el usuario haga lo que pretendes.

El mensaje principal debe dejar claro el beneficio que va a obtener el usuario que visita la web o qué soluciones tienes a su problema.

La llamada a la acción puede servir para que tu invitado:

• Te envíe un correo.
• Añada un producto al carrito.
• Se suscriba a tu newsletter.
• Lea un contenido estratégico.
• Se registre en tu web.
• Etc.

En mi página de inicio la llamada a la acción persigue que el usuario se suscriba a mi newsletter. Si lo hace ya doy por buena la visita, aunque no lea nada más de mi web en ese momento.

Para que esta parte de la web esté optimizada debes ser generoso con el tamaño del texto, que se lea fácil y que destaque. Además deberías ser conciso, no se trata de explicar lo que puedes hacer en 300 palabras, solo tienes que lanzar una idea, dar una pincelada. Tu visita leerá una frase de 10 palabras, pero no una parrafada de 200.

Intenta que el fondo acompañe, pero que no distraiga y utiliza ahí el color más llamativo de tu paleta para destacar el botón de la llamada a la acción.

Te dejo algunos ejemplos para que te inspires.

Productos y servicios

Si vendes servicios o productos ha llegado el momento de exponerlos. Estos deben ser una muestra de los que puedes ofrecer al cliente.

Si tienes muchos servicios limita los que expones en esta parte de la web a un máximo de seis, aunque te recomendaría que no sean más de cuatro. Solo los más importantes a nivel de rentabilidad para ti o los que destacan por su valor estratégico. Luego, si quieres, puedes añadir un botón para acceder al resto de servicios.

De todas formas piensa que el usuario siempre podrá acceder a todos ellos desde el menú principal y que cuantas más opciones tengas en tu homepage más fácil será que el usuario se distraiga y que disminuyan las conversiones.

Pocas opciones, claras y elegidas con un objetivo. Lo importante es que hagas un diseño web estratégico.

Generación de confianza

La clave para vender cualquier producto o servicio a través de internet es ser capaz de generar confianza. ¿Cómo puedes hacer esto? Tienes muchas opciones, pero yo destacaría tres:

• Cuidando tu marca personal.
• Siendo transparente en tu página “sobre mí”.
• Mostrando los testimonios de otros clientes.

Aparte de estas medidas también puedes mostrar los logotipos de las empresas para las que hayas trabajado, de las asociaciones a las que perteneces o de los medios donde hayas aparecido.

Lo importante es que tu visita perciba que eres alguien serio, que transmitas profesionalidad y buenas vibraciones.

Últimas entradas del blog

Este punto depende, lógicamente, de si tienes un blog o no, aunque en mi opinión deberías tenerlo sí o sí.

Y aunque lo tengas tampoco es obligatorio que vaya en la página de inicio, pero en mi opinión el ponerlo refuerza tu mensaje, mantiene actualizado el contenido de tu homepage a los ojos de Google y te da una oportunidad más para que el usuario haga click en algún enlace y que por tanto siga en tu web en vez de marcharse.

Si te decides a hacerlo con que pongas el título y el extracto de cinco entradas será suficiente.

Deshazte de todo lo innecesario

A lo mejor tenías en mente meter muchas más cosas en tu homepage, pero mi consejo es que solo pongas lo más importante y que proporciones enlaces a otras partes de tu web, pero recuerda que el objetivo de la página de inicio no es ser un resumen de todo tu sitio.

Por tanto considero que no te hace falta mostrar aquí:

• Un slider con cuatro o cinco diapositivas. Nadie se queda esperando a ver todo lo que le quieres enseñar en el slider. La gente llega, echa una vistazo a lo primero que se le muestra y empieza a hacer scroll. Si crees que alguien se va a esperar a que pasen todas las diapositivas y que va a leer lo que tienes que decirle con atención estás muy equivocado. Es mucho más efectiva una única frase con una llamada a la acción.
• Un listado completo con todos tus servicios. Esto lo he visto mucho en páginas de abogados, donde la home se convierte en un listado interminable de las diferentes problemáticas legales que abarcan. Es innecesario, aburrido y anti estético.
• Las cajas de Facebook y twitter. Lo sé, aquí va a haber alguno que se me va a echar encima, pero ¿Realmente cuánta gente crees que le da al me gusta en tu homepage? Que tengas estas cajas en la sidebar de tu blog pase, pero en la página de inicio no les veo mucho sentido. Además ¿Sabías que estas cajas son una de las cosas que más perjudican tus tiempos de carga? Tenlo en cuenta.
• Tu curriculum y el dominio que tienes de ciertas herramientas. Si alguien está interesado en conocer tu bagaje profesional lo más seguro es que vaya a buscarlo a la página “sobre mí”, no hace falta que lo pongas en la home.

10 errores frecuentes que debes evitar en tu homepage

Vamos a acabar la entrada con una serie de errores que veo muy a menudo en las páginas de inicio y que deberías evitar a toda costa:

1- Evita añadir demasiados elementos. No la satures de imágenes, botones, banners, párrafos interminables, etc. Mantenla limpia, clara y concisa. Menos es más.

2- Mejor pocas fotos de buena calidad. No abuses de las fotografías, mejorarás la velocidad de carga y la página será más clara.

3- Cuidado con las fotos de stock. Las fotos de stock te pueden venir muy bien como fondo de la cabecera o de algunas secciones de ancho completo. En algunos casos también pueden ilustrar ciertos servicios, pero no las utilices como fotos de tu equipo humano o de tus instalaciones. Se verá a la legua que son falsas y provocarán un sentimiento de rechazo.

4- Evita las páginas de acceso a la web. Me refiero a la típica página que llegas y te pone “entrar en la web”, “haz click aquí para entrar” o “ir a la tienda”. Vamos a ver ¿Para qué haces eso? Esa página apenas tiene contenido con lo cual mal hecho a los ojos de Google, además obligas al usario a hacer un click extra ¿Me quieres explicar qué beneficio te aporta este tipo de pre-home?

5- No malgastes tu espacio y mi tiempo con frases innecesarias. “Bienvenido a mi web” podría ser un claro ejemplo de frase que no aporta nada y que te come un espacio valioso. Sé conciso y al grano. En tu web quiero que me respondas:

• ¿Qué haces?
• ¿Cómo me puedes ayudar?
• ¿Qué me voy a encontrar aquí?

Y todo eso quiero saberlo en nueve segundos. Las palabritas amables ya las dejamos para cuando quedemos a tomar una caña 😉

6- No te enrolles. Conceptos claros, textos concisos. Prepara los textos de tu homepage y cuando los tengas redúcelos a la mitad, fuera todo lo que no sea fundamental. No seas ingenuo y pienses que tu visita se va a leer todo lo que has escrito. La gente escanea, lee brevemente y sigue navegando.

7- Deja el menú a la vista. Ya sé que se están poniendo de moda los menús tipo hamburguesa, pero mucha gente todavía no está acostumbrada a ellos (sobre todo en las versiones de escritorio) así que usa un menú de los de toda la vida, no le compliques la navegación a tu invitado sin necesidad.

8- No hagas de tu homepage una página más. Esta página es especial y debe ser diferente a todas las demás. Por supuesto debes mantener los estilos y colores, pero atrévete con anchos completos, secciones diferentes, etc. Dale un toque de exclusividad. Para conseguir resultados especiales yo me ayudo de GeneratePress y Thrive Content Builder.

9- Los gustos son subjetivos, no te ates a los tuyos. Piensa en qué le gustará a tu audiencia, no en lo que te gusta a ti. Escribes para ellos, quieres captar su atención así que olvídate de ti y piensa en cómo reaccionarán ellos ante tu propuesta.

10- Mantener la página de inicio siempre igual. Cambia, compara, analiza los resultados y vuelve a empezar. Que tu llamada a la acción no funciona demasiado bien… pues diseña otra, que un servicio destacado no se vende e intuyes que hay otro que podría funcionar mejor… pues lo sustituyes, que ves que te falta o te sobra algo… pues lo cambias. Es lo bueno de WordPress, tú tienes el control y puedes hacer todos los cambios que quieras cuando quieras. Aprovéchalo para sacarle el máximo rendimiento a tu web.

Y con esto ya hemos acabado ¿Qué te ha parecido? ¿Aplicas estas estrategias en tu página de inicio? ¿Crees que se debería añadir algún elemento más? ¿Te sobra alguno?

Como siempre me encantaría debatirlo contigo en los comentarios así que anímate y cuéntame cómo has hecho la página de inicio de tu web.