miércoles, 3 de junio de 2015

Diseño web: los ghost buttons o botones fantasma



¿Qué son?

Los botones fantasma, llamados también botones transparentes o ghost buttons, son formas planas sin relleno que sesuelen usar para hacer un call to action (llamada a la acción). De hecho técnicamente
un ghost button no es exactamente un botón en sí porque carece de relleno. Sería mejor describirlo como un marco, pero esto sería solo semántica.

Los ghost buttons acostumbran a ser botones simples, con trazado fino, sin relleno, con textos simples y algo más grandes que el resto de botones. Acostumbran a ponerse sobre fotografías y en la parte central de la pantalla. En definitiva, consiste en llevar los típicos botones web a la mínima expresión: un texto, un recuadro sin relleno y algún efecto hover, nada más.

¿Cómo se usan?

La mayoría de los ghost buttons son más grandes que los botones normales que puedes encontrar en otra parte de la página web. Esto nos lo permiten porque nunca obstruyen la parte trasera de la pantalla.

Esun recurso utilizado sobre todo en landing pages (webs de aterrizaje), ya que el objetivo principal de estas páginas es capturar la atención del visitante y conseguir una respuesta a la llamada a la atención que hago al usuario. Su uso es habitual en webs con fotografía o vídeo de gran formato, para no taparlo.

Pros
  1. No hay obstrucción de pantalla: no obstruyen la vista de los objetos que se encuentran detrás.
  2. Archivos más pequeños: Ya que solo son marcos, su peso es mucho menor. Esto facilita la carga de la web, y lo agradece el usuario (sobre todo móvil) y mejora el SEO
  3. Móvil: en un móvil cada pulgada del espacio de la pantalla tiene valor, y colocando ghost buttons aprovechamos cada rincón
  4. Utilidad: las tasas de conversión y testsA/B realizados demuestran que funcionan muy bien desde el punto de vista estético, son capaces de llamar la atención del visitante.
  5. Versátil:aunque inicialmente se aplicaron sobre todo en webs sobre tendencias y moda, su uso ya se ha extendido a todo tipo de diseño web, tipografía o sector.
  6. Embudo: poder colocar un botón transparente en un lugar estratégico, sin límitede tamaño y permitiendo ver el trasfondo, nos ayudará a hacer que el usuario trace su navegación como nosotros pretendemos
  7. Ventaja comparativa: los diseñadores que usan los ghost buttons tendránuna ventaja competitiva sobre los que no, por lo tanto puede ser algo único que ofrecer a tu cliente.
Contras

  1. Podríamos estar ante una moda pasajera, y su popularidad puede desvanecerse hasta el punto de que tengas que rediseñar tu página web en breve.
  2. Algunos diseñadortes están abusando de ello: puede ser que los ghost
    buttons no encajen en determinados esquemas de diseño, pero aún así algunos desarrolladores insisten en usarlos de todos modos; usarlos donde se necesitan tiene más sentido.
  3. Funcionalidad: si quieres que estos botones sean un elemento funcional en tu diseño web, ten en cuenta que debes mantenerlos limpios y  leíbles.
Desde La Teva Web estamos implementando los botones fantasma en algunos de nuestros proyectos, aquí teneis algunos ejemplos: Vila Hermanos, Coral Yachting, Fresh Laudry o Art&Servei.

No hay comentarios:

Publicar un comentario en la entrada