Cómo diseñar una excelente Portada de Pagina Web o Home Page

Diseño de una Portada Web

En este artículo definimos las características más importantes para conseguir una buena portada de tu página web, desarrollar una correcta y eficiente home page en la mayoría de los casos marca el devenir del diseño y desarrollo de un proyecto. Por lo tanto podemos decir que la portada de un sitio web es la clave y la parte más importante de un diseño, por lo que es en ella donde debemos cuidar varios aspectos a partir de los consejos para el diseño de la página home que te ofrezco en este post.

diseño web atractivo

Errores comunes en el Diseño de una web

Un mal diseño web puede tener entre algunas de sus características principales el no ser comunicador de los contenidos que se intentan hacer transmitir al usuario, provocando así una mala experiencia de usuario y una confusión y frustración durante la navegación del sitio web.

Un diseño con una caótica estructura, maquetación o una poco trabajada usabilidad generará irremediablemente un alto % en la tasa de rebote de su tráfico órganico. Por tasa de rebotes entendemos al porcentaje de usuarios que visitan tu sitio web y se van de él sin navegar por ningún apartado o pestaña más del lugar.

Si quieres evitar errores en el planteamiento y desarrollo de un sitio web y conseguir una eficiente navegación web lee los siguintes consejos a tener en cuanta:

Características que una Portada Web o página home debe tener:

  • 1. El Logotipo

    subir logo

    El logotipo en sí es un aspecto muy importante, ya que crea una relación de confianza e identificación entre la marca de empresa y el usuario que está visitando la web. Un logotipo sencillo y puede ser lo más idóneo, en ocasiones queremos hacer logotipos sobrecargados que finalmente no luego son complicados de encajar en el resto del diseño.

  • 2. Diseño atrayente

    elementos diseño web

    Conseguir un diseño atractivo no es tarea sencilla, podrá gustar más o menos, pero siempre llamará la atención y será apreciado por los visitantes. Debemos cuidar detalles como la elección de tipografía, botones, colores principales, etc.
    A través de esta web llamada Adobe Kuler podemos componer bonitas y conseguidas gamas de colores para utilizar en nuestros diseños.

  • 3. El Gancho
    Ten en cuenta que la página home normalmente es la más visitada por lo cual debe existir un gancho que por ejemplo puede ser: un banner, un logotipo o imagen que da un toque de “atrevimiento” a la portada, o una persona señalando una zona de call to action con el dedo, la mano o la mirada.
  • 4. La estructura
    Debemos crear una estructura lógica que nos permita transmitir el mensaje al usuario en un primer vistazo, quienes somos, qué hacemos y la localización de los servicios o productos que estamos ofertando deben ser accesibles desde cualquier zona de navegación y dispositivo.
  • 5. El Scroll
    Existen muchas tendencias que comentan que el exceso de scroll es negativo dentro de un diseño, (obligar a que el usuario tenga que bajar con la rueda del ratón para continuar viendo los contenidos).
    En mi opinión estoy parcialmente de acuerdo, ya que si los contenidos y la estructura son buenos no necesariamente tiene porque ser un error si es que tenemos que detallar mucha profundidad sobre el concepto del que estamos tratando, escribiendo y maquetando.
  • 6. Call to actions a Servicios/productos con tipografías a buen tamaño

    tamaño tipografías h1, h2, h3

    EL uso de correctos tamaños de fuente para etiquetas de encabezado es imprescindible, antes de ponerte a diseñar en web revisa el tamaño de h1, h2, h3 en desktop y mobile, usa span o p para los call to action exentos de palabras clave o que no son títulos de página.

  • 7. Contenidos dinámicos
    Es aconsejable el uso de contenido dinámico dentro de tu portada web para el beneficio del posicionamiento SEO, ya que a los motores de búsqueda les encanta ver contenidos nuevos, utiliza siempre que puedas un shorcode con las últimas entradas de tu blog o algún elemento similar como comentarios recientes.
  • 8. Se conciso y original
    Se conciso sobre los diferentes servicios que ofreces y acompáñalos de elementos visuales o colores que los diferencien, además la originalidad también premia.

Si te gustó este artículo o te sirvió de ayuda por favor compártelo
Un saludo,
Óscar / DevService
Por Óscar Carrillo