68. Diseño web para Membership Sites que convierten

En este sexagésimo octavo episodio de Membership Sites, te contamos cómo lograr un buen diseño web para un Membership Sites orientado a la conversión.

¿Quieres obtener ingresos recurrentes?

Pero antes, recuerda que en Bicicleta Studio somos especialistas en Membership Sites. Por eso te ayudamos a conseguir ingresos recurrentes creando la web de tu negocio de membresía para que vivas de lo que realmente te apasiona.

Cuéntanos tu proyecto. ¡Juntos haremos realidad tu Membership Site!

El Patrocinador

Wetopi nos ofrece un hosting especializado en WordPress para alojar tus sitios web así como para desarrollar los proyectos de tus clientes.

Se trata de un hosting ultrarápido, creado para simplificar el ciclo de trabajo de profesionales, desarrolladores y agencias creativas.

Buenas prácticas, ahorro de tiempo, más valor para tu propuesta y mayor seguridad en tus desarrollos, son algunos de los beneficios que obtendrás al trabajar con Wetopi.

Regístrate en Wetopi y consigue 40€ de forma 100% gratuita para probarlo ya mismo sin compromiso, y descubre por ti mismo las ventajas de su servicio de hosting especializado en WordPress 🙂

El tema de la semana: Diseño web para Membership Sites

Hoy te contamos cómo lograr un buen diseño web para Membership Sites orientado a la conversión.

Vamos a ir paso a paso. Empezamos por:

Escaleta del programa

Arquitectura de la información

Esquema funcional

Organización y estructura del contenido de forma que el usuario pueda navegar por él podemos tener desde un simple y sencillo sitio hasta un sistema de información complejo
Público objetivo
- Feedback de los usuarios/suscriptores para mejorar estos esquemas
- Una buena experiencia de usuario suele venir de una buena arquitectura de la información
Importancia de organizar el contenido en WordPress
- Utilización de los tipos de contenido
  - Posts, páginas y Custom Post Types (CPT)
- Utilización de las taxonomías
  - Categorías
  - Etiquetas
  - Custom Taxonomies
Herramientas:
- Papel y lápiz
- Presentaciones de Google o Keynote
- Cualquier software que te permita realizar un esquema fácil de entender, por ejemplo: octopus.do

Wireframes

Una vez planificado el flujo de navegación del usuario y las páginas del site pasamos a realizar un “esbozo”:

Uso de símbología:
- Imágenes como cajas
- Texto de relleno o líneas y rectángulos
- Botones como cajas
Distribución de la información en las diferentes páginas
- Retículas
- Módulos
- Primer prototipo “sin diseño visual”
Wireframes más o menos personalizados según se trate de un:
- Theme prediseñado, menos personalización
- Theme a medida, 100% personalizados
Herramientas:
- Papel y lápiz
- Adobe CC XD
- Sketch
- Figma
- Adobe CC Photoshop
- Zeplin

Diseño Web

Validados los wireframes por parte del cliente:

Siguiendo la Identidad Visual del proyecto:
- Colores
- Tipografia
- Imagen corporativa: logotipo, estilo imágenes, etc…
Es ideal diseñar con el contenido definitivo (no suele suceder casi nunca)
Usamos contenido de relleno:
- Lorem Ipsum
- Chiquito Ipsum
- Lorem Picsum
Buenas prácticas de diseño en un Membership Site:
Diseño responsive o multidispositivo (no todos los elementos deben aparecer en todos los dispositivos)
- Ordenador
- Móvil/smartphone
- Tablet
Diseño web que convierta:
Objetivo claro: CTA o llamada a la acción
2 segundos
700 px
Distribución de la información:
- Header
- Footer
Página de checkout (compra de una suscripción)
- Datos personales imprescindibles
- Sin carrito
Menos es más (estilo minimalista)

El diseño web es lo que sucede fuera de WordPress. Lo ideal es realizar un prototipo lo más real posible:

Estructura
Navegación
Aspecto Visual

Enlaces mencionados

Por cierto, sabías que…

El mayor problema de tu negocio es la falta de ingresos recurrentes.

Descubre nuestra metodología exacta para construir un negocio simple, estable y escalable que te genere ingresos recurrentes de forma inteligente.

Deja tu email y copia nuestro método:

Por favor, activa JavaScript en tu navegador para completar este formulario.

Correo electrónico