Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Max Camuñas: ¡No seas una fotocopia! Consejos de diseño para tener una web con gancho

325 views

Published on

Adictos al Marketing llega a Barcelona organizado por SiteGround con el objetivo de compartir las últimas tendencias que unen la tecnología y el marketing compartiendo experiencias, conocimiento y estrategias que utilizan los mejores profesionales del sector.

A lo largo de la jornada pudimos ver que pasos deberías seguir en el diseño de tu página web, que deberías estar revisando en tu ecommerce para asegurar el máximo de ventas, cómo utilizar el design thinking y el inbound marketing en la estrategia de tu negocio… y también tuvimos tiempo de hablar de SEO y hacer networking.

Max Camuñas se encargó de mostrarnos los puntos esenciales para crear una web con gancho.

No te pierdas los vídeos de las charlas en nuestro canal de YouTube.

Puedes ver todas las ponencias en nuestra playlist aquí
👇👇
https://bit.ly/2BxlVaz

Obtén más info y descarga las presentaciones de los ponentes en nuestro blog
👇👇
https://bit.ly/2BB6luq

Published in: Science
  • Be the first to comment

Max Camuñas: ¡No seas una fotocopia! Consejos de diseño para tener una web con gancho

  1. 1. Bienvenidos a ADICTOS AL MARKETING ¡No seas una fotocopia! Consejos de diseño para tener una web con gancho @SiteGround_ES #SGAdictosMKT
  2. 2. DE QUÉ VAMOS A HABLAR ● ¿Qué es una web con gancho? ● Ejemplos ● Cómo planificar una página web ● Branding ● Estructura ● Diseño y maquetación ● Ajustes finales @SiteGround_ES #SGAdictosMKT
  3. 3. ¿QUIÉN ES MAX CAMUÑAS? ● Alguien que estudió Turismo en la Universidad ● Bloguero desde 2011 (autor de maxcf.es) ● Especializado en diseño web en WordPress con el theme Divi ● Diseño páginas web con gancho ● Consultor de marketing online ● Cautiva, fascina y enamora con tu página web @SiteGround_ES #SGAdictosMKT
  4. 4. ¡VAMOS AL LÍO! @SiteGround_ES #SGAdictosMKT
  5. 5. ¿QUÉ ES UNA WEB CON GANCHO? Una web con gancho es aquella que refleja perfectamente la personalidad y los valores de la marca o autor que está detrás de ella. @SiteGround_ES #SGAdictosMKT
  6. 6. ¿QUÉ ES UNA WEB CON GANCHO? Incluye elementos que la hacen diferentes al resto de webs que puedes encontrar en internet. @SiteGround_ES #SGAdictosMKT
  7. 7. UNA WEB CON GANCHO Diseño creativo + Con alma y personalidad + Estrategia @SiteGround_ES #SGAdictosMKT
  8. 8. EJEMPLOS DE WEB CON GANCHO @SiteGround_ES #SGAdictosMKT
  9. 9. EJEMPLOS DE WEB CON GANCHO @SiteGround_ES #SGAdictosMKT
  10. 10. EJEMPLOS DE WEB CON GANCHO @SiteGround_ES #SGAdictosMKT
  11. 11. EJEMPLOS DE WEB CON GANCHO @SiteGround_ES #SGAdictosMKT
  12. 12. CÓMO PLANIFICAR UNA WEB ● Registrar el dominio ● Contratar el proveedor de hosting @SiteGround_ES #SGAdictosMKT 1. Dominio + hosting
  13. 13. CÓMO PLANIFICAR UNA WEB ● Paleta de colores ● Tipografías ● Logotipo ● Estilo para las imágenes ● Biblioteca de elementos gráficos: iconos, vectores... @SiteGround_ES #SGAdictosMKT 2. Branding
  14. 14. CÓMO PLANIFICAR UNA WEB ● Definir la estructura de páginas ● Establecer las secciones de cada página ● Paquetizar los servicios ● Redactar los copys ● Propuesta de valor ● Diseñar la estrategia: conversiones, ventas, captación de suscriptores… @SiteGround_ES #SGAdictosMKT 3. Estructura web
  15. 15. CÓMO PLANIFICAR UNA WEB Diseño y maquetación de todas las páginas y secciones de la web a partir del branding, estructura y estrategia que has definido previamente. @SiteGround_ES #SGAdictosMKT 4. Diseño y maquetación
  16. 16. CÓMO PLANIFICAR UNA WEB ● SEO ● Search Console ● Google Analytics ● Píxel de Facebook ● + servicios complementarios @SiteGround_ES #SGAdictosMKT 5. Ajustes finales
  17. 17. EJEMPLO @SiteGround_ES #SGAdictosMKT LOGO TIPOGRAFÍAS ESTILOS COLORES ESTRUCTURA PROPUESTA DE VALOR
  18. 18. BRANDING @SiteGround_ES #SGAdictosMKT 1. Paleta de colores
  19. 19. BRANDING @SiteGround_ES #SGAdictosMKT 2. Tipografías Son las fuentes o tipos de letras empleadas en el diseño de cada uno de los elementos que forman parte de la identidad de marca: logotipo, web, banners, creatividades, merchandising...
  20. 20. BRANDING @SiteGround_ES #SGAdictosMKT Recomendaciones para elegir tipografías ● No abusar de tipografías diferentes ● Elegir tipografías que reflejen la personalidad de tu marca ● Busca una buena combinación de tipografías
  21. 21. BRANDING @SiteGround_ES #SGAdictosMKT Ejemplos de combinaciones tipográficas Títulos: Playfair Display Cuerpo de texto: Raleway
  22. 22. BRANDING @SiteGround_ES #SGAdictosMKT Ejemplos de combinaciones tipográficas Títulos: Poppins Cuerpo de texto: Muli
  23. 23. BRANDING @SiteGround_ES #SGAdictosMKT 3. Logotipo web ● Parte superior de la web ● Legible a todos los tamaños ● Adaptable a todos los dispositivos ● Visible en todo momento ● Enlazado a la página de inicio
  24. 24. BRANDING @SiteGround_ES #SGAdictosMKT 4. Imágenes y fotografías web ● Imágenes profesionales ● Contextualizadas ● Alineadas con la imagen de marca
  25. 25. BRANDING @SiteGround_ES #SGAdictosMKT Ejemplos de imágenes para web
  26. 26. BRANDING @SiteGround_ES #SGAdictosMKT Ejemplos de imágenes para web
  27. 27. BRANDING @SiteGround_ES #SGAdictosMKT 5. Elementos gráficos ● Iconos ● Botones ● Subrayados ● Estilos ● Vectores
  28. 28. BRANDING @SiteGround_ES #SGAdictosMKT
  29. 29. ESTRUCTURA @SiteGround_ES #SGAdictosMKT ● Propuesta de valor ● Páginas ● Secciones de cada página ● Categorías y subcategorías ● Menú ● Servicios ● Objetivo / estrategia
  30. 30. ESTRUCTURA @SiteGround_ES #SGAdictosMKT
  31. 31. ESTRUCTURA @SiteGround_ES #SGAdictosMKT
  32. 32. ESTRUCTURA @SiteGround_ES #SGAdictosMKT
  33. 33. DISEÑO / MAQUETACIÓN @SiteGround_ES #SGAdictosMKT ● Desarrollo a medida ● Comprar una plantilla ● Usar un maquetador: Divi, Elementor, Visual Composer, Thrive Architect…
  34. 34. AJUSTES FINALES @SiteGround_ES #SGAdictosMKT ● Revisar el SEO: títulos, meta descripciones, keywords en cada página ● Dar de alta la web en Search Console ● Vincular con Google Analytics ● Insertar el píxel de Facebook ● Extras: afiliación, email marketing, otras herramientas (Metricool)…
  35. 35. @SiteGround_ES #SGAdictosMKT ¡No seas una fotocopia! Diseña una web con gancho MUCHAS GRACIAS ! www.maxcf.es " @maxcf # hola@maxcf.es

×