Contenidos Páginas web
Por favor verifique que temática se le asignó para que pueda desarrollar su pagina web y aplicación
móvil, el no incorporar todos los elementos aquí dispuestos hará que no cumpla con la evidencia.
Modelo 1: Página Web para un Restaurante – camilo cuellar
Tema: Restaurante con menú, reservas en línea y contacto.
Estructura:
1. Encabezado (Header):
• Logo: "Restaurante El Sabor de Casa" (a la izquierda).
• Menú de navegación:
• "Inicio", "Menú", "Reservas", "Sobre Nosotros", "Contacto".
• Iconos: En la esquina derecha, iconos de "Carrito" y "Llamada" (teléfono).
2. Sección 1: Hero (Banner Principal)
• Imagen de fondo: Foto atractiva de un plato principal (ej. pasta, ensalada, etc.).
• Texto:
• Título grande: "Bienvenidos a El Sabor de Casa"
• Subtítulo: "Donde cada bocado cuenta una historia."
• Botón CTA: "Ver Menú" (enlace a la sección de menú).
3. Sección 2: Menú Destacado
• Título: "Nuestros Platos Más Populares"
• Texto: Breve descripción de tres platos destacados, cada uno con una imagen.
• Plato 1: "Risotto con champiñones - Un plato cremoso y lleno de sabor."
• Plato 2: "Filete a la parrilla - La carne de calidad que estabas esperando."
• Plato 3: "Tarta de manzana casera - El postre perfecto para terminar tu
comida."
• Imágenes: Fotografías de alta calidad de cada plato, con nombre y descripción.
• Botón: "Ver el Menú Completo" (lleva a una página con el menú detallado).
4. Sección 3: Reservas
• Título: "Reserva tu mesa"
• Texto: "No esperes más, asegura tu lugar en El Sabor de Casa."
• Formulario de reserva:
• Nombre, Fecha, Hora, Número de personas.
• Botón CTA: "Reservar Ahora" (envía al sistema de reservas en línea o a
correo).
• Imagen: Foto del restaurante con un ambiente acogedor.
5. Sección 4: Sobre Nosotros
• Título: "Conoce Nuestra Historia"
• Texto:
• "En El Sabor de Casa, nos dedicamos a ofrecer una experiencia culinaria
única. Desde 2005, nuestra familia ha estado sirviendo recetas
tradicionales con un toque moderno."
• Imagen: Foto del equipo del restaurante o el chef trabajando.
6. Sección 5: Contacto
• Título: "Ponte en contacto con nosotros"
• Texto:
• Dirección: Calle del Sabor, 123, Ciudad.
• Teléfono: +34 123 456 789
• Email: [email protected]
• Formulario de contacto: Nombre, correo electrónico, mensaje.
• Iconos de redes sociales: Facebook, Instagram, Twitter.
7. Pie de página (Footer):
• Texto: "© 2024 El Sabor de Casa. Todos los derechos reservados."
• Enlaces adicionales: Política de privacidad, Términos y condiciones.
Recomendaciones para móvil:
• Menú colapsado (hamburguesa) para el header.
• Imágenes optimizadas para no afectar la carga en móviles.
• Formularios con campos de entrada grandes para facilitar su uso en dispositivos táctiles.
Modelo 2: Página Web para una Tienda de Ropa Online-zaidy fuentes
Tema: Tienda de ropa femenina con opciones de compra, categorías y carrito.
Estructura:
1. Encabezado (Header):
• Logo: "FashionChic" (a la izquierda).
• Menú de navegación:
• "Inicio", "Novedades", "Categorías", "Mi Cuenta", "Carrito".
• Barra de búsqueda: Ícono de lupa al lado del menú.
• Icono de carrito de compras con número de artículos (en la esquina superior
derecha).
2. Sección 1: Hero (Banner Principal)
• Imagen de fondo: Modelo usando ropa de temporada (camisa, vestido, etc.).
• Texto:
• Título: "Descubre las últimas tendencias"
• Subtítulo: "Nuevas colecciones de moda para cada ocasión."
• Botón CTA: "Compra Ahora" (lleva a la tienda de productos).
3. Sección 2: Productos Destacados
• Título: "Lo Más Vendido"
• Texto: Breve descripción de los productos más populares.
• Producto 1: "Vestido Floral – Ideal para el verano."
• Producto 2: "Chaqueta de cuero – Estilo y comodidad en uno."
• Producto 3: "Pantalones de mezclilla – Básico en tu armario."
• Galería de productos: Imágenes de productos con nombre, precio y un botón de
"Añadir al carrito".
4. Sección 3: Categorías
• Título: "Explora por Categorías"
• Texto: "Encuentra lo que necesitas en nuestras categorías."
• Lista de categorías:
• "Vestidos", "Pantalones", "Accesorios", "Novedades", "Rebajas".
• Imágenes de cada categoría.
5. Sección 4: Testimonios
• Título: "Lo que dicen nuestras clientes"
• Texto: Reseñas de clientas satisfechas con sus compras.
• "Me encantó el vestido floral. ¡Llegó rápido y de excelente calidad!" - Ana
M.
• "La chaqueta es perfecta para el invierno. ¡Comodidad total!" - Laura G.
6. Sección 5: Footer
• Enlaces: "Mi cuenta", "Política de privacidad", "Términos y condiciones", "Envíos".
• Redes sociales: Íconos de Instagram, Facebook, Pinterest.
• Suscripción al boletín: "Recibe nuestras ofertas exclusivas" con campo para
ingresar el correo.
Recomendaciones para móvil:
• Menú de hamburguesa para navegar por las categorías.
• Botones de "Añadir al carrito" grandes para facilitar la compra en dispositivos táctiles.
• Asegúrate de que las imágenes de los productos se redimensionen adecuadamente en
dispositivos móviles para evitar distorsiones.
Modelo 3: Página Web para una Agencia de Viajes- andres Felipe agredo
Tema: Agencia de viajes con información sobre destinos, paquetes y contacto.
Estructura:
1. Encabezado (Header):
• Logo: "ViajeMágico" (a la izquierda).
• Menú de navegación:
• "Inicio", "Destinos", "Paquetes", "Ofertas", "Contacto".
• Icono de carrito: Para reservas de viajes (derecha).
2. Sección 1: Hero (Banner Principal)
• Imagen de fondo: Foto de un destino turístico popular (playa, ciudad, montaña).
• Texto:
• Título: "Tu próximo destino te espera"
• Subtítulo: "Descubre destinos paradisíacos con nuestras ofertas
exclusivas."
• Botón CTA: "Explora destinos" (lleva a la página de destinos).
3. Sección 2: Destinos Populares
• Título: "Destinos Más Populares"
• Texto: Breve descripción de tres destinos destacados.
• Destino 1: "Bali - Playas, templos y cultura."
• Destino 2: "París - La ciudad del amor y la moda."
• Destino 3: "Machu Picchu - Aventura y naturaleza en el corazón de los
Andes."
• Imágenes: Fotos llamativas de cada destino.
• Botón CTA: "Ver más destinos" (lleva a una lista de destinos).
4. Sección 3: Paquetes Especiales
• Título: "Paquetes Exclusivos"
• Texto: "Ofrecemos paquetes todo incluido a destinos de ensueño."
• Lista de paquetes:
• "Paquete Bali: 7 días, todo incluido."
• "Paquete París: 5 noches con guía turístico."
• "Paquete Machu Picchu: Aventura todo terreno."
• Botones: "Ver Paquete" para cada uno.
5. Sección 4: Contacto
• Título: "Reserva tu viaje ahora"
• Texto: "Contáctanos para más información o para reservar tu próximo viaje."
• Formulario de contacto: Nombre, correo electrónico, destino deseado.
• Teléfono y email: Contacto rápido.
6. Pie de página (Footer):
• Enlaces: "FAQs", "Política de cancelación", "Términos y condiciones".
• Redes sociales: Facebook, Instagram, Twitter.
Recomendaciones para móvil:
• Botones de contacto grandes y visibles.
• Optimizar las imágenes de los destinos para que se carguen rápido en dispositivos móviles.
• Formularios de contacto con campos fáciles de llenar y bien alineados en móviles.