Módulo Didáctico Firma Corporativa

Diseño web

Comenzar

Diseño web

Comenzar

Índice

Diseño Web

01

Diseño UX/UI

02

Estructura de Contenido

03

Diseño Visual

04

CMS

05

Ejercicio

Diseño UX/UI

Ver +

1. UX (User Experience): Se refiere a cómo se siente un usuario al interactuar con un sitio web. Un buen diseño UX se centra en la facilidad de uso, la accesibilidad y la eficiencia.
2. UI (User Interface): Se refiere a la apariencia visual del sitio, incluidos los botones, colores, tipografías y todo lo que el usuario ve e interactúa.

Diseño UX/UI

Estructura de Contenido

Ver +

La estructura de contenido se refiere a cómo se organiza la información en un sitio web. Esto incluye la jerarquía de encabezados (H1, H2, H3), la ubicación de imágenes y videos, y cómo se presentan los productos o servicios.

Estructura de Contenido

Utilizar encabezados claros y descriptivos para mejorar la navegación y el SEO.Incluir una llamada a la acción (CTA) en lugares estratégicos para guiar al usuario a realizar una acción específica.

Prácticas recomedadas

Diseño Web

Abarca todos los elementos estéticos de un sitio web, como colores, tipografías, imágenes y disposición de los elementos.

+ info

Diseño Web

Mantener la coherencia visual con la identidad de la marca.Utilizar imágenes de alta calidad y optimizadas para web para evitar tiempos de carga lentos.

Prácticas recomedadas

CMS

Un CMS es una plataforma que permite crear y gestionar contenido web sin necesidad de codificación avanzada. Ejemplos populares incluyen WordPress, Shopify, y Kirby.

+ info

CMS

Elegir un CMS que se adapte a las necesidades del negocio.Mantener el CMS actualizado para asegurar el mejor rendimiento y seguridad.

Prácticas recomedadas

1. Selecciona un diseño en Astra.2. Diseña la página de inicio, considerando los elementos de UX/UI y el Diseño Visual.3. Diseña una entrada de Blog, considera UX/UI y Diseño Visual.4. Realiza una captura de pantalla y subela a Canvas.5. Realiza una Infografía donde menciones los principales aspectos del diseño

Ejercicio

+ info

• Lorem ipsum dolor sit amet.
• Consectetur adipiscing elit.
• Sed do eiusmod tempor incididunt ut.
• Labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua, sed do eiusmod.

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit

Su diseño UX se enfoca en una navegación fácil y en proporcionar recomendaciones personalizadas basadas en el historial de compras. Esto mejora la experiencia de compra y aumenta las ventas.

Amazon

Su diseño UI se caracteriza por ser limpio y minimalista, lo que refleja su marca de lujo y calidad. Cada elemento está diseñado para ser intuitivo y agradable a la vista.

Apple

AMAZON

• Lorem ipsum dolor sit amet.
• Consectetur adipiscing elit.
• Sed do eiusmod tempor incididunt ut.
• Labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua, sed do eiusmod.

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit

• Lorem ipsum dolor sit amet.
• Consectetur adipiscing elit.
• Sed do eiusmod tempor incididunt ut.
• Labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua, sed do eiusmod.

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit

Utiliza una estructura clara de encabezados y subencabezados que facilita la navegación por temas relacionados.

Wikipedia

Organiza su contenido en secciones claras, como productos, servicios y testimonios, lo que facilita al usuario encontrar lo que necesita rápidamente.

Shopify