Diseño web: ¿Qué es una Web One Page?

Las Web One Pages son cada vez más utilizadas debido a diferentes motivos como por ejemplo que son más rápidas de crear y más fáciles de mantener. Sin embargo, y a pesar de su relativa simplicidad, el diseño de este tipo de webs requiere también de una planificación minuciosa complementada con una propuesta gráfica cuidada en cada uno de sus pixels.

¿Qué es una sitio web one page?

La definición técnica de este tipo de web es bastante sencilla; un sitio web que utiliza una única página HTML para mostrar todo su contenido. En esta página web no existe ninguna otra página con contenido, por lo que cualquier enlace de navegación servirá para llevar al usuario a otra parte de la web, marcando así la forma de navegación.

¿Cuándo debemos optar por este tipo de webs?

Lo primero que hay que valorar es la función y utilidad que va a tener la web para nuestro cliente. Por ello es importante definir bien los objetivos de la marca y la definición del público objetivo que queremos que consuma nuestro contenido.

Este tipo de webs se recomiendan para:

• Sitios web personales.
• Pequeños portafolios (que no necesiten SEO).
• Páginas de campañas de publicidad.
• Pequeños eventos.
• Páginas de marketing.
• Páginas de mailing.
• Tienda online de un solo producto (E-commerce).

Ventajas.

Son webs que permiten cierta libertad en términos de diseño, maquetación y efectos, obteniendo sitios con un alto atractivo en Ui/Ux, consiguiendo resultados impactantes a nivel gráfico.

Un punto a favor importante de las web one page responsive es una mejor experiencia de usuario puesto que toda la información de la web está a simple vista y evitamos que el usuario tengan que navegar por varias páginas para consumir toda la información.

Este tipo de páginas están orientadas normalmente a la obtención de conversiones para obtener leads, por lo que son utilizadas en campaña de marketing online.

Por último, como hemos mencionado al comienzo de esta noticia, tienen un proceso de creación más simple que las webs “clásicas” de varias páginas y por ello requiere un mantenimiento más sencillo.

Desventajas.

Un punto que hay que tener en cuenta a la hora de la planificación del proyectos es si requiere de un trabajo de posicionamiento orgánico, SEO. Es importante puesto que las páginas one page son incompatibles este servicio puesto que es imposible indexar varias páginas, trabajar diferentes keywords, definir metadescripciones… por lo que tendrá un efecto negativo en el rendimiento del tráfico orgánico y por consiguiente en la visibilidad en buscadores.

La medición de la interacción de los usuarios es más complicada puesto que al estar compuesta por menos páginas y tener menos contenido, es más difícil saber qué hacen los usuarios durante sus visitas obteniendo unas métricas más complejas.

Por último, el contenido no puede ser demasiado extenso para evitar tanto un scroll demasiado largo y como consecuencia una velocidad de carga más elevada.

Buenas prácticas de diseño para crear una web one page.

1. Definir la jerarquía visual.

Para tener un diseño atractivo y efectivo utilizaremos distintos recursos para controlar la jerarquía visual para los distintos dispositivos (escritorio, tablet y mobile): el tamaño, el color, el contraste, la proximidad y la repetición.

Dado que en un sitio de esta tipología se tiene que mostrar todo el contenido en una única página hay que crear diferentes secciones con el objetivo de tener una estructura entendible. Hay que evitar excederse con la cantidad de información y decoración, dejando que los elementos que componen la página respiren de una manera correcta. Nunca es tarde para recordar que el espacio en blanco también juega un papel muy importante en la comunicación.

2. Un diseño atractivo y funcional.

Una vez definida la jerarquía nos centraremos en “vestirla” para guiar a los usuarios a través del contenido dividiendo sus secciones por medio de diferentes estilos de texto, colores de fondo, imágenes, etc.

Es importante conocer realmente al usuario al que nos dirigimos para crear un sitio comprensible que consiga captar la atención sin dejar lugar a las confusiones. Un equilibrio perfecto entre lo atractivo y la claridad.

3. Agregar una navegación alternativa.

Un punto importante a controlar es el scroll. Si no lo controlamos y obtenemos una web con un scroll infinito, podemos desorientar a los usuarios. Si durante el proceso de diseño y desarrollo vemos que obtenemos una estructura compleja de muchas secciones, tendremos que tener preparado una navegación alternativa. Con este recurso permitiremos que los usuarios naveguen rápidamente a la sección que necesitan con menús anclados y accesibles en todo momento, de esta forma mantendremos una UX agradable e intuitiva.

4. Incluir una llamada a la acción.

Las webs one-page son perfectas para incluir una llamada a la acción (CTA) debido a su estructura y finalidad. Si la web se crea para un propósito específico (recolectar información con formulario de contacto, descarga de aplicaciones móviles o venta de un producto), el diseño tiene que girar en torno a él. Para ello hay que conseguir que la acción destaque en todo momento ya sea través de su color o forma, además de facilitar su interacción en todo momento.

5. Tiempos de carga.

Dependiendo de la naturaleza y del contenido del sitio web tendremos más o menos carga de imágenes y elementos visuales. Siempre hay que tener en cuenta que un uso excesivo de imágenes y/o vídeos ralentizará la carga de la página. ¿Creemos que los usuarios serán lo suficientemente pacientes como para esperar hasta que se cargue la web completa o preferirán buscar mejores opciones?

Para ello, optimizaremos el sitio web y sus recursos para que la navegación sea la más optima por parte del usuario y garantizar que tenga una buena experiencia de navegación. Por supuesto, durante el desarrollo nos preocupamos en detalle de los dispositivos móviles, ya que a día de hoy son el medio más utilizado por los usuarios.

Como apunte, nos gustaría indicar que a día de hoy, en Europa, no es real que una web tenga una única página ya que debido LOPD todas las webs tendrán que tener una páginas legales de forma obligatoria por lo que tendremos que crear la página de Aviso Legal, Política de privacidad y Política de cookies dentro de cada proyecto.

En resumen, el diseño de una web one page depende en gran medida de los objetivos a conseguir y del público objetivo. Ambos puntos deben estar bien definidos en la estrategia de marca. Desde Drool estamos disponibles para ayudarte en enfocar tu proyecto. Contacta con nosotros y estaremos encantados de orientarte y ayudarte en todo lo que esté en nuestro alcance.