Fundamentos de HTML y CSS

Incluido en el curso

Lo que aprenderás

• Crear páginas web estáticas con HTML y darles estilo con CSS.
• Aplicar buenas prácticas de maquetación para organizar el contenido.
• Escribir código limpio y ordenado desde el inicio.

Descripción

¿Quieres crear tus propias páginas web desde cero? 🌐 En este curso aprenderás los fundamentos de HTML y CSS: cómo estructurar contenido, aplicar estilos y depurar tu código con DevTools. Harás ejercicios prácticos en cada lección, usarás herramientas como Emmet y publicarás tu primer sitio con GitHub Pages.

🐣 Ideal para quienes están empezando en el mundo del desarrollo web.

Programa del curso

• 1

  Marcado HTML

  En esta lección aprenderás los conceptos básicos de HTML, el lenguaje utilizado para estructurar el contenido de las páginas web.

  teoría

  ejercicio

• 2

  Etiquetas

  Aprenderás a usar etiquetas en HTML, para estructurar texto en una página.

  teoría

  test

  ejercicio

• 3

  Anidación de etiquetas

  En esta lección aprenderás sobre la anidación de etiquetas en HTML, un concepto que permite crear estructuras más complejas, como listas, utilizando etiquetas dentro de otras.

  teoría

  test

  ejercicio

• 4

  Atributos HTML

  Aprenderás qué son los atributos en HTML, cómo se utilizan para enriquecer los elementos con información adicional, y cómo afectan la visualización o el comportamiento de la página.

  teoría

  test

  ejercicio

• 5

  Encabezados

  En esta lección aprenderás a dividir contenido en secciones lógicas, como en informes o libros, facilitando la navegación y comprensión.

  teoría

  test

  ejercicio

• 6

  Listas

  Aprendere a usar listas en HTML para organizar información de manera clara y funcional.

  teoría

  test

  ejercicio

• 7

  Enlaces

  En esta lección aprenderás a usar enlaces, esenciales para navegar entre páginas, documentos y secciones.

  teoría

  test

  ejercicio

• 8

  Imágenes

  Trabajarás con imágenes en HTML, usando los atributos src para la ruta, alt para accesibilidad y width y height para ajustar dimensiones.

  teoría

  test

• 9

  Estructura básica de un documento HTML

  Todo documento HTML tiene una estructura básica con etiquetas esenciales para que el navegador muestre la información. En esta lección, analizaremos cada línea de esta estructura.

  teoría

  test

  ejercicio

• 10

  Elementos Semánticos

  Descubrirás cómo las etiquetas semánticas de HTML5 mejoran la estructura y la accesibilidad de los sitios web.

  teoría

  test

  ejercicio

• 11

  Estructura básica en HTML5

  Aprenderás a usar etiquetas semánticas para definir la estructura de una página web, mejorando la organización y accesibilidad del código.

  teoría

  test

  ejercicio

• 12

  Organización del contenido en HTML5

  Aprenderás a estructurar el contenido dentro de `<main>` usando `<section>`, `<article>` y `<aside>`, mejorando la organización y claridad del código.

  teoría

  test

  ejercicio

• 13

  Elementos de bloque y en línea

  En esta lección descubrirás las diferencias entre elementos de bloque y en línea en HTML, explorando cómo afectan la estructura y disposición de los contenidos en una página.

  teoría

  test

  ejercicio

• 14

  Fundamentos de CSS 🎨

  CSS se creó para el diseño visual de páginas web. Aprenderemos lo básico del lenguaje, cómo usarlo con HTML, a vincular archivos CSS.

  teoría

  test

  ejercicio

• 15

  Selectores

  Aprenderemos sobrelos tipos básicos de selectores.

  teoría

  test

  ejercicio

• 16

  Cascada en CSS

  ¿Qué es la cascada y cómo funciona en CSS? Esta lección se centra en las diferencias de prioridad de los selectores y en cómo utilizarlo en tus proyectos.

  teoría

  test

  ejercicio

• 17

  Editores de código

  Para guardar los resultados de tu trabajo, necesitarás un editor de código. En esta lección, aprenderemos cómo instalar Visual Studio Code. Esta es una herramienta poderosa que se puede utilizar no solo para el diseño web, sino también para programar en cualquier lenguaje.

  teoría

  test

• 18

  Cierre

  Cerramos el curso repasando lo aprendido y contándote los siguientes pasos. Ya estás listo para crear tus primeras páginas web y seguir avanzando como desarrollador.

  teoría

  test

• 19

  Materiales adicionales

  Artículos y videos seleccionados por el equipo de Códica. Te ayudarán a profundizar en el tema del curso.

Desafíos

Son ejercicios de mayor dificultad que pueden requerir conocimientos adicionales. Si no puedes resolverlos en este momento, no te preocupes. Busca información por tu cuenta o sigue avanzando en la carrera y regresa más adelante cuando te sientas listo.