Sirviendo como puerta de entrada virtual de su empresa, esta página es responsable de atraer la mayoría del tráfico de su sitio web. Aún así, a pesar de su prominencia, muchas empresas luchan por optimizarla adecuadamente.

Verás, tu página de inicio necesita usar muchos sombreros. En lugar de tratarla como una landing page dedicada construida en torno a una acción en particular, debe estar diseñada para servir a diferentes audiencias, de diferentes orígenes. Y para hacerlo de manera efectiva, debe construirse con un propósito. En otras palabras, necesitarás incorporar elementos que atraigan tráfico, eduquen a los visitantes e inviten a conversiones.

Para mejorar el rendimiento de tu página de inicio, echa un vistazo a estos elementos que debe tener cada página de inicio.

 Descarga gratuita: 77 Ejemplos de Diseño Web Brillante

12 Elementos Críticos Cada Página De Inicio Del Sitio Web Debe Tener

Guardar

12 elementos críticos para una infografía de la página de inicio de un sitio web

Guardar

Comparte esta Imagen En Tu Sitio Web

Lo que debes Incluir en el Diseño de la página de inicio de tu sitio Web

Titular

En tres segundos, un sitio web debe informar a los visitantes lo que el negocio tiene para ofrecer. Ahí es donde entra tu titular. Puede que solo sean unas pocas palabras, pero es una de las piezas de texto más importantes de tu sitio web.

Es posible que muchos tipos de personas visiten tu sitio web, y te resultará difícil encontrar algunas palabras que lleguen a casa para todos. En su lugar, escribe tu titular para dirigirte a un tercio de las personas que tienen más probabilidades de estar felices con tu producto.

Mantenga el titular claro y sencillo. El titular de Dropbox es un gran ejemplo: «Todo lo que necesitas para trabajar, todo en un solo lugar.»Es simple, pero potente — sin necesidad de decodificar jerga para averiguar qué es lo que realmente hace Dropbox.

 Página de inicio del sitio web de Dropbox

Subtítulo

Tu subtítulo debe complementar el título ofreciendo una breve descripción de lo que haces o lo que ofreces. Esto se puede hacer de manera efectiva concentrándose en un punto de dolor común que su producto o servicio resuelve.

Este es un ejemplo de un gran subtítulo de Mirror: «Escondiéndose a plena vista.»Se afina en el punto de venta principal del gimnasio mirror: Es un completo gimnasio en casa, entrenador personal y plan de entrenamiento, todo en la comodidad de su hogar sin ocupar preciosos metros cuadrados con equipo. Subtítulo de la página principal del sitio web espejo que se lee oculto a simple vista

Para optimizar tus titulares para dispositivos móviles, utiliza fuentes más grandes para ofrecer a los visitantes una mejor experiencia. Las fuentes pequeñas podrían obligar a los visitantes móviles a pellizcar y hacer zoom para leer e interactuar con el contenido de tu sitio. Nuestro consejo? Usa las opciones de encabezado en el editor de páginas. Los encabezados H1 son perfectos para los títulos de las páginas — solo debe haber un H1 en una página. Los subtítulos deben seguir el orden de la jerarquía, H2, H3 … H6, y así sucesivamente. Puedes tener varios de estos encabezados, solo asegúrate de que estén en orden. Por ejemplo, no querrá saltar de un H1 a un H3, elija un H2 en su lugar.

Llamadas a la acción primarias

El objetivo de tu página de inicio es obligar a los visitantes a profundizar en tu sitio web y moverlos por el embudo. Incluya dos o tres llamadas a la acción en la parte superior que dirijan a las personas a diferentes etapas del ciclo de compra, y colóquelas en lugares fáciles de encontrar.

Estos CTA deben ser visualmente llamativos, idealmente en un color que contrasta con el esquema de colores de su página de inicio, al tiempo que se adapta al diseño general. Mantén la copia breve (no más de cinco palabras) y orientada a la acción, para que obligue a los visitantes a hacer clic en lo que estés ofreciendo. Ejemplos de copia de CTA son «Regístrese»,» Haga una cita «o» Pruébelo gratis.»

El sitio web de la sede después de la Escuela cuenta con dos CTA en la parte superior, ambos dirigidos a los directores de programas que están interesados en promover sus programas después de la escuela a las familias en el sitio. La nota debajo del CTA más largo «Crea tu perfil Gratuito» da a los visitantes el empujón que necesitan para crear una cuenta, el primer paso para convertirse en un proveedor de la sede Después de la escuela.

Imagen de apoyo

La mayoría de las personas son visuales. Asegúrate de usar una imagen (o incluso un video corto) que indique claramente lo que ofreces. Usa imágenes que capten emociones, impulsen la acción y cuenten visualmente la historia sobre la que estás escribiendo.

Para optimizar las imágenes para los usuarios móviles, utilice imágenes de alta calidad con un tamaño de archivo reducido. (Los clientes de HubSpot no necesitan preocuparse por esto, ya que las imágenes subidas al software de HubSpot se comprimen automáticamente. De lo contrario, herramientas como TinyPNG harán el truco.) Además, siempre agrega texto alternativo a tus imágenes para hacerlas más accesibles a los visitantes que usan lectores de pantalla y para llevar tus esfuerzos de SEO a un nivel superior.

La página de inicio de 4 Ríos Smokehouse es un gran ejemplo de imágenes emocionales: Presenta una serie de videos cortos, de alta definición y deliciosos que se reproducen en bucle detrás de un simple titular, subtítulo y llamada a la acción principal:

4 página de inicio del sitio web de rivers smokehouse imagen destacada con una hamburguesa de queso

Beneficios

No solo es importante describir lo que haces, sino también por qué importa lo que haces. Los prospectos quieren saber sobre los beneficios de comprarte porque eso es lo que los obligará a quedarse.

Mantenga la copia ligera y fácil de leer, y hable el idioma de sus clientes. Evernote hace un gran trabajo al incluir beneficios en su página de inicio de una manera atractiva, agradable a la vista y fácil de entender:

Beneficios de la página web de Evernote

Prueba social

La prueba social es un poderoso indicador de confianza. Tu producto o servicio podría ser el mejor del mundo, y está bien afirmar eso, es solo que la gente puede no creerte a menos que también lo oigan de otras personas. Y eso es exactamente lo que hace la prueba social.

Incluya solo algunas de sus mejores citas (cortas) en la página de inicio, y enlace a estudios de casos, si corresponde. Agregar un nombre y una foto le da a estos testimonios más credibilidad. Lessonly clava esto en su página de inicio con testimonios brillantes de clientes reales.

Lessonly página de inicio del sitio web testimonios y reseñas

Navegación

El diseño y el contenido de la navegación de su página de inicio podrían significar la diferencia entre una conversión del sitio web y un rebote. Para disminuir la tasa de rebote, da a tus visitantes un camino claro a las páginas que necesitan directamente desde la página de inicio. Haga visible el menú de navegación en la parte superior de la página y organice los enlaces en una estructura jerárquica.

Nadie conoce tu sitio web mejor que aquellos que ayudaron a diseñarlo, así que asegúrate de realizar pruebas de usuario para asegurarte de que sea simple e intuitivo para los visitantes encontrar lo que están buscando en tu sitio. Incluya un cuadro de búsqueda si puede. (Lee esta publicación de blog para obtener más consejos útiles de navegación en el sitio web.)

Este es un ejemplo de un diseño de navegación claro y bien estructurado de la página de inicio de Slim & Husky’s Pizza Beeria:

 Navegación de la página web de Slim y huskys

Oferta de contenido

Para generar aún más clientes potenciales de su página de inicio, incluya una oferta de contenido realmente excelente, como un documento técnico, un libro electrónico o una guía. Las personas que no estén listas para comprar tal vez prefieran descargar una oferta que les brinde más información sobre un tema que les interese. Si necesitas inspiración, aquí hay varios tipos de contenido diferentes para elegir.

Llamadas a la acción secundarias

Incluye CTA secundarios en tu página de inicio para ofrecer oportunidades de conversión adicionales para clientes potenciales que no estén interesados en tu objetivo principal. Piense en ellos como el plan de contingencia: ofrecen otro camino para los visitantes que aún no están listos para algo tan comprometido como lo está pidiendo.

Mientras que tus CTA principales deben estar encima del pliegue, coloca CTA secundarios debajo del pliegue para dar a los visitantes cosas en las que hacer clic cuando se desplacen hacia abajo. Por ejemplo, debajo del pliegue de la página de inicio de Spanx, encontrarás tres llamadas a la acción claramente etiquetadas que brindan a las personas que se han desplazado hasta ese momento algunas opciones más para hacer clic. Estos CTA secundarios son para dos tipos diferentes de conversiones: uno en el extremo izquierdo por un descuento de 2 20 y otro, «compre ahora» para explorar el catálogo en línea.

 Página web de Spanx CTAs secundarias

Características

Además de los beneficios, enumere algunas de sus características clave. Esto le da a la gente una mayor comprensión de lo que proporcionan tus productos y servicios. Una vez más, mantenga la copia ligera y fácil de leer. Dropbox para Empresas, por ejemplo, no rehúsa mostrar una matriz de características justo en su página de inicio, debajo del pliegue.

 características de la página de inicio del sitio web de dropbox para empresas

Recursos

De nuevo, la mayoría de los visitantes de tu sitio web no estarán listos para comprar … aun. Para las personas que buscan más información, ofrezca un enlace a un centro de recursos donde puedan buscar información relevante. Esto no solo los mantiene en su página web por más tiempo, sino que también lo ayuda a establecer su credibilidad como líder de pensamiento en su industria.

Lovesac agrega un enlace de recursos al pie de página debajo del pliegue. Observe cómo cada uno de estos CTA secundarios cubre varias etapas del ciclo de compra: un enlace de tarjeta de crédito para ayudar a los clientes a comprar sus muebles fácilmente, una guía de muestras de tela para aquellos que aún buscan el color perfecto antes de hacer una compra y un catálogo en línea para personas que están en el mercado de muebles nuevos pero aún no están listas para hacer una compra.

 Página de inicio del sitio web de lovesac con recursos y CTA en el pie de página

Indicadores de éxito

Además de las historias de éxito de los clientes, tanto los premios como el reconocimiento también pueden ayudar a inspirar una buena primera impresión. ¿Su empresa es un restaurante aclamado por la crítica? ¿Te votaron como la mejor aplicación nueva de este año? Informa a los visitantes de tu página de inicio de tus logros. Al igual que la prueba social, le dará a tu negocio más credibilidad a aquellos que no te conocen.

En la página de inicio de Calendly, por ejemplo, encontrarás los nombres de organizaciones famosas que los han reconocido, como Gartner y Dropbox.

 Página de inicio del sitio web de Calendly

Una página que vale la pena Visitar

La página de inicio de su sitio es la primera introducción que cada visitante tendrá a su negocio. Antes de decidirse a convertirse en cliente, revisarán tu página de inicio para tener una idea de lo que vendes, por qué eso les importa y cómo pueden beneficiarse de lo que tienes para ofrecer.

Haga una primera impresión brillante con una página de inicio que incorpora los elementos descritos anteriormente. Y para obtener más inspiración, echa un vistazo a impresionantes ejemplos de páginas de inicio descargando el lookbook gratuito a continuación.

Nota del editor: Este artículo se publicó originalmente en enero de 2012 y se ha actualizado para garantizar su frescura, precisión y exhaustividad.

 ejemplos de diseño brillante de página de inicio, blog y landing page

Deja una respuesta

Tu dirección de correo electrónico no será publicada.