Scribd
Cargar
60 vistas3 páginas

Clase HTML Daniel

La clase de introducción a HTML tiene como objetivo que los estudiantes comprendan qué es HTML y su importancia en la creación de páginas web. Se aborda la estructura básica de un documento HTML, las etiquetas fundamentales y se propone un ejercicio práctico para crear una página personalizada. Al finalizar, se enfatiza que HTML es esencial para el desarrollo web y es fácil de aprender.

Cargado por

DanielMirandaDeValencia
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como DOCX, PDF, TXT o lee en línea desde Scribd
60 vistas3 páginas

Clase HTML Daniel

La clase de introducción a HTML tiene como objetivo que los estudiantes comprendan qué es HTML y su importancia en la creación de páginas web. Se aborda la estructura básica de un documento HTML, las etiquetas fundamentales y se propone un ejercicio práctico para crear una página personalizada. Al finalizar, se enfatiza que HTML es esencial para el desarrollo web y es fácil de aprender.

Cargado por

DanielMirandaDeValencia
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como DOCX, PDF, TXT o lee en línea desde Scribd

Clase Muestra: Introducción a HTML

Duración: 40 minutos
Nivel: Segundo grado de secundaria
Objetivo: Los estudiantes comprenderán qué es HTML, su importancia y cómo se usa para
crear páginas web.

1. Rompehielos - "Sitios web por todos lados"

Pregunta a los alumnos:


- "¿Cuántos sitios web creen que visitan al día?"
- "Mencionen páginas que usen diariamente."

Explica: Todas estas páginas tienen algo en común: están construidas con **HTML**.

2. ¿Qué es HTML y por qué es importante?

HTML (**HyperText Markup Language**) es un lenguaje de marcado que estructura el


contenido en la web.

📌 Ejemplo simple:
Compararlo con los cimientos de una casa. HTML es la estructura; luego CSS (colores y
estilos) y JavaScript (interacción) la mejoran.

📝 ¿Para qué sirve?


- Crear páginas web.
- Organizar contenido en internet.
- Es la base de todo lo que ves en la web.

3. Estructura Básica de un Documento HTML


Todo documento HTML sigue una estructura base que le da orden y significado a la página
web.

<!DOCTYPE html>
<html>
<head>
<title>Mi Página Web</title>
</head>
<body>
<h1>¡Hola, Mundo!</h1>
<p>Esta es mi primera página web.</p>
</body>
</html>

4. Etiquetas HTML Básicas

📌 Estructura y texto:
- `<h1>` a `<h6>` → Títulos.
- `<p>` → Párrafo de texto.
- `<br>` → Salto de línea.
- `<hr>` → Línea horizontal.

📌 Enlaces e imágenes:
- `<a href="URL">Texto</a>` → Crea un enlace.
- `<img src="imagen.jpg" alt="Descripción">` → Inserta una imagen.

📌 Listas:
- `<ul>` y `<ol>` para listas desordenadas y ordenadas.

📌 Tablas básicas:

<table border="1">
<tr>
<th>Nombre</th>
<th>Edad</th>
</tr>
<tr>
<td>Daniel</td>
<td>25</td>
</tr>
</table>

5. Ejercicio Extra: Creando una Página Personalizada

📌 Instrucciones:
Pide a los alumnos que creen un archivo llamado `mi_pagina.html` y agreguen el siguiente
código con sus propios datos:

<!DOCTYPE html>
<html>
<head>
<title>Mi Página Personal</title>
</head>
<body>
<h1>¡Bienvenidos a mi página!</h1>
<p>Hola, mi nombre es [Tu Nombre] y esta es mi primera página web.</p>
<h2>Mis intereses</h2>
<ul>
<li>Leer libros</li>
<li>Escuchar música</li>
<li>Jugar videojuegos</li>
</ul>
<h2>Contacto</h2>
<p>Puedes enviarme un correo a: <a
href="mailto:[email protected]">[email protected]</a></p>
</body>
</html>

6. Conclusión de la Clase

🔹 HTML es la base de la web: Sin él, no existirían páginas como Google, YouTube o Wikipedia.

🔹 Es fácil de aprender: Con solo unas pocas líneas de código, ya puedes estructurar contenido
en internet.

🔹 Es el primer paso para el desarrollo web: Después de HTML, puedes aprender CSS para dar
estilo y JavaScript para agregar interactividad.

📢 Pregunta final para reflexionar:


*"Si pudieras diseñar tu propia página web, ¿qué contenido le pondrías?"*

También podría gustarte