✅ Como crear una pagina web completa en HTML - Parte 2

Summary

En este tutorial, aprenderemos a crear la estructura básica de un sitio web utilizando HTML. Comenzamos con un encabezado de navegación, seguido de un área principal con secciones para artículos y una imagen. Luego, agregamos una barra lateral con dos widgets: uno para artículos destacados y otro para información adicional. Finalmente, creamos un pie de página con un mensaje de derechos de autor. Este ejercicio es ideal para practicar las bases de la estructura web, dejando espacio para mejoras futuras como el diseño con CSS y funcionalidades interactivas.

Takeaways

• 😀 Se finaliza la estructura básica de un sitio web en HTML, añadiendo un pie de página y un sidebar.
• 😀 El pie de página es muy sencillo, solo incluye un texto con derechos de autor, pero se puede mejorar en el futuro.
• 😀 El sidebar se añade fuera del `<main>` y contiene dos widgets: 'Artículos Destacados' e 'Información'.
• 😀 Los artículos destacados en el sidebar tienen una lista con enlaces a artículos, lo que simula una recomendación de contenido.
• 😀 En el widget de 'Información' se agrega un párrafo con texto adicional, dando un contenido más informativo al sitio.
• 😀 El sitio web básico incluye un menú de navegación, una imagen, artículos en el cuerpo principal y un footer.
• 😀 El código de la página web incluye una estructura organizada con secciones claras como el header, main, y footer.
• 😀 El speaker menciona que este sitio es básico, ideal para practicar, y que se añadirán estilos en próximos capítulos.
• 😀 Se enfatiza que la creación del sidebar y footer es flexible y puede adaptarse según las necesidades del diseño del sitio.
• 😀 Se insta a los usuarios a seguir aprendiendo y a no suscribirse aún, ya que el siguiente capítulo cubrirá cómo agregar estilos a este diseño básico.

Q & A

¿Cuál es el objetivo principal de este capítulo?

El objetivo principal es completar la estructura básica HTML del sitio web, añadiendo un sidebar (site) y el pie de página (footer).

¿Qué componentes ya estaban creados antes de este capítulo?

Antes de este capítulo, ya se había creado el header con un menú de navegación, el main con artículos y secciones, y un contenedor con una imagen y contenido de artículo.

¿Por qué el sidebar se crea fuera del main y no dentro de él?

El sidebar se crea fuera del main para facilitar su gestión, aunque también es posible crear el sidebar dentro del main dependiendo del diseño que se prefiera.

¿Qué elementos se incluyen dentro del primer widget en el sidebar?

Dentro del primer widget se incluye un encabezado con el título 'Artículos Destacados' y una lista desordenada con varios enlaces a artículos.

¿Cuántas veces se duplica la lista de artículos dentro del sidebar?

La lista de artículos se duplica al menos cuatro veces para añadir más contenido al sidebar.

¿Qué contiene el segundo widget en el sidebar?

El segundo widget contiene un encabezado con el título 'Información' y un párrafo con texto de ejemplo.

¿Qué se incluye en el pie de página (footer) del sitio web?

En el pie de página se incluye un párrafo con el texto de derechos de autor, como '© 2022 Todos los derechos reservados'.

¿Es este pie de página final completo o puede mejorarse?

El pie de página es muy básico, pero se puede mejorar y personalizar con más elementos, como enlaces de navegación o información adicional, en futuros capítulos.

¿Qué se menciona sobre los enlaces en el sidebar?

Los enlaces dentro del primer widget llevan a distintos artículos y pueden ser personalizados para mostrar contenido relacionado, como historias o recomendaciones.

¿Qué es lo que se planea hacer en el siguiente capítulo?

En el siguiente capítulo se enseñará cómo agregar estilos a la página web, mejorando su apariencia y diseño, además de posicionar el sidebar correctamente.