Icono del sitio Blog de Programación y Desarrollo – Nube Colectiva

Como Crear una Página Web con Bootstrap 5 – Parte 3

Demo

En la parte anterior llamada Como Crear una Página Web con Bootstrap 5 – Parte 2, creamos el contenido para la página Home del stitio web, agregamos un carousel con imágenes que apunta a diferentes páginas, asimismo agregamos unos planes de pago que son como un contenido de ejemplo para este proyecto, tu decidirás que poner en su lugar. En esta tercera parte vamos a crear el contenido para la página nosotros, vamos con ello.

Partes

Antes de continuar te invito a leer los siguientes artículos:

Asimismo, te invito a escuchar el Podcast: “Consejos Para Tener Más Tiempo Para Programar” (En Spotify, Sound Cloud y Apple Podcasts) y “La Inteligencia Artificial (IA) y El Machine Learning (ML) Siempre Trabajan de la Mano” (Anchor Podcast):

Spotify: Sound Cloud: Apple Podcasts Anchor Podcasts

Bien ahora continuemos con el Post: Como Crear una Página Web con Bootstrap 5 – Parte 3. 

Página Nosotros

Para esta página voy a crear un archivo HTML con el nombre nosotros.html dentro del directorio principal del proyeto. 


En la página Nosotros colocaré un texto que diga Nosotros, una imagen con un texto de introducción, debajo colocaré información sobre el objetivo, la misión y la visión de la organización. 

Introducción (Nosotros)

Para esta sección de introducción a la página nosotros, colocaré un encabezado h1 con el texto Nosotros, luego una imágen y debajo un texto que describe la sección, el texto que usaré es Loremp Ipsum (texto de mentira) para organizar el contenido:


Si voy al navegador debería de ver los elementos sin problemas:

Ahora pasaré a crear la información con el objetio, misión y visión de la organización.

Objetivo, Misión y Visión

Estos datos los voy a colocar en 3 columnas, cada una con una imagen referencial, las cuales las dividiré usando clases CSS de bootstrap 5:


Igualmente, si voy al navegador, debería de ver las 3 columnas con su imagen e información correspondiente:

Puedes ver en la imagen anterior, que debajo aparece una parte del formulario de Newsletter, este formularo lo creamos en la Parte 2 de este tutorial y alli mencionamos que lo iba a colocar en todas las páginas, de esta manera se logra recolectar usuarios para futuras promociones.

Bien hasta aquí llegamos con esta parte 3 en donde colocamos una imagen y texto de introducción y debajo el objetivo, misión y visión de la organización.

Ten Paciencia, lo que quiero es que conozcas bien como se crea este proyecto y no llenarte el capitulo de mucho contenido porque te puedes marear y no tendrás un óptimo aprendizaje. 

Nota (s)

Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenidos.

Salir de la versión móvil