Contenido del Curso

HTML Definitivo

1. Comprensión del Desarrollo Web

Bienvenido a HTML y al Desarrollo Web ¿Qué es Internet?¿Cómo Funciona Internet?Comprensión de Cómo Funcionan los Sitios Web Explicación del Desarrollo Frontend y Backend

2. Etiquetas y Atributos HTML

Comprensión de las Etiquetas HTML Trabajando con Atributos HTML Comprensión de las Etiquetas Dobles y Simples en HTML Marcado y Formato de Texto en HTML Desafío: Crea el Primer Párrafo de Tu Página Web Desafío: Crea una Página Web de Presentación Personal Desafío: Diseñar una Página Web de Exhibición de Películas Uso de Enlaces y Botones en HTML Desafío: Crear Enlaces a Sitios Web Populares Validación de Tu Código HTML Según las Mejores Prácticas

3. Estructura del Documento HTML

Los Secretos Detrás de Páginas Web Bien Estructuradas Comprensión de la Estructura del Documento HTML El Papel del Encabezado del Documento Gestión del Flujo y la Disposición del Documento Desafío: Estructura Correctamente un Documento HTML Uso de Herramientas de Desarrollador para Inspección y Depuración de HTML

4. Trabajando con Medios y Tablas

Agregar Imágenes en HTML Desafío: Trabajar con Imágenes Trabajar con Imágenes Clicables, Leyendas y Optimización Comprensión de Gráficos Vectoriales y Rasterizados Incrustación de Audio y Video para Contenido Multimedia Enriquecido Desafío: Incrustar Audio y Video en HTML Creación y Estructuración de Tablas en HTML Desafío: Diseñar una Tabla HTML Funcional

5. Formularios HTML y Entrada de Usuario

Introducción a los Formularios HTML Fundamentos de la Creación de Formularios en HTML Uso de Etiquetas para Mejorar la Accesibilidad de Formularios Mejora de Formularios con Atributos de Entrada Exploración de los Diferentes Tipos de Entrada en HTML Desafío: Crear Formulario con Campos de Entrada y Etiquetas Trabajando con el Elemento Textarea para Entrada de Varias Líneas Uso del elemento select para menús desplegables Uso del elemento datalist para sugerencias de entrada predefinidas Agrupación de Elementos de Formulario para una Mejor Estructura

Desafío: Estructura Correctamente un Documento HTML

Objetivo

Construir la página web correcta creando una estructura básica de documento HTML. Esta estructura es la columna vertebral de toda página HTML y consta de elementos esenciales que los navegadores necesitan para mostrar correctamente tu contenido.

Nota

No te dejes engañar por la aparente simplicidad del diseño de la página web. Aunque pueda parecer sencillo, es fundamental mantener la estructura correcta del documento. Esto garantiza que el sitio web conserve su legibilidad y funcionalidad en todos los navegadores.

Tarea

Crear una estructura básica de documento HTML. Si ya tienes confianza en tus habilidades, siéntete libre de continuar sin la guía paso a paso. Sin embargo, si deseas un poco más de orientación, hay un recorrido guiado disponible para ayudarte en el proceso.

Guía paso a paso

Paso 1: Iniciar el documento HTML

Comience escribiendo la declaración de tipo de documento HTML, que indica al navegador que el documento está escrito en HTML. La declaración debe ser la primera línea de su documento HTML:

index.html

Paso 2: Agregar las etiquetas de apertura y cierre html

Después de la declaración doctype, agrega las etiquetas de apertura y cierre HTML. Toda la estructura del documento HTML estará contenida dentro de estas etiquetas. Además, incluye el atributo lang para especificar el idioma del documento:

index.html

Paso 3: Crear la sección head

Agrega las etiquetas de apertura y cierre <head> dentro de las etiquetas HTML. La sección head contiene metainformación sobre el documento HTML, como el título y enlaces a hojas de estilo externas:

index.html

Paso 4: Agregar el título

Dentro de las etiquetas <head>, agrega las etiquetas de apertura y cierre <title>. El texto que ingreses entre estas etiquetas se mostrará como el título de la página web en la barra de título o pestaña del navegador:

index.html

Paso 5: Crear la sección body

Después de la sección <head>, agrega las etiquetas de apertura y cierre <body>. La sección body contiene el contenido visible de la página web:

index.html

Paso 6: Agregar contenido al body

Puedes agregar elementos dentro de las etiquetas <body>, como encabezados, párrafos, imágenes, enlaces, etc. Aquí tienes un ejemplo de cómo agregar un encabezado y un párrafo:

index.html

Pruébalo tú mismo

index.html

¿Todo estuvo claro?

¡Gracias por tus comentarios!

Sección 3. Capítulo 5

Pregunte a AI

Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla

Contenido del Curso

HTML Definitivo

1. Comprensión del Desarrollo Web

Bienvenido a HTML y al Desarrollo Web ¿Qué es Internet?¿Cómo Funciona Internet?Comprensión de Cómo Funcionan los Sitios Web Explicación del Desarrollo Frontend y Backend

2. Etiquetas y Atributos HTML

3. Estructura del Documento HTML

4. Trabajando con Medios y Tablas

5. Formularios HTML y Entrada de Usuario

Desafío: Estructura Correctamente un Documento HTML

Objetivo

Nota

No te dejes engañar por la aparente simplicidad del diseño de la página web. Aunque pueda parecer sencillo, es fundamental mantener la estructura correcta del documento. Esto garantiza que el sitio web conserve su legibilidad y funcionalidad en todos los navegadores.

Tarea

Guía paso a paso

Paso 1: Iniciar el documento HTML

Comience escribiendo la declaración de tipo de documento HTML, que indica al navegador que el documento está escrito en HTML. La declaración debe ser la primera línea de su documento HTML:

index.html

Paso 2: Agregar las etiquetas de apertura y cierre html

index.html

Paso 3: Crear la sección head

index.html

Paso 4: Agregar el título

index.html

Paso 5: Crear la sección body

Después de la sección <head>, agrega las etiquetas de apertura y cierre <body>. La sección body contiene el contenido visible de la página web:

index.html

Paso 6: Agregar contenido al body

Puedes agregar elementos dentro de las etiquetas <body>, como encabezados, párrafos, imágenes, enlaces, etc. Aquí tienes un ejemplo de cómo agregar un encabezado y un párrafo:

index.html

Pruébalo tú mismo

index.html

¿Todo estuvo claro?

¡Gracias por tus comentarios!

Sección 3. Capítulo 5