Unidad Educativa Don Bosco C Nombre:………………………………………………..
TEMA # 2
BIENVENIDO A HTML
HTML corresponde a las siglas en ingles de “Hiper Text Markup Languaje” y se puede traducir al
español como “Lenguaje de Marcas de Hipertexto”.
A diferencia de un lenguaje de scripting o programación que usa secuencias de comandos para realizar
procesos, un lenguaje de marcado utiliza diferentes etiquitas para identificar el contenido.
Este es un ejemplo de una etiqueta HTML:
<p> Soy un párrafo </p>
LA ESTRUCTURA WEB
La capacidad de programar usando HTML es esencial para cualquier estudiante interesado en internet.
Adquirir esta habilidad debería ser el punto de partida para cualquiera que este aprendiendo como
crear contenido para la web.
DISEÑO WEB MODERNO
HTML: estructura
CSS: presentación
PHP: estructura de conexión
LA ETIQUETA <html>
Aunque se hayan lanzado varias versiones a lo largo de los años, los fundamentos de HTML siguen
siendo los mismos.
La estructura de un documento HTML se puede comparar con la de un sándwich. De la misma manera
de un sándwich tiene dos rebanadas de pan, el documento HTML tiene etiquetas HTLM de apertura y cierre.
Estas etiquetas, como el pan de un sándwich, envuelven todo lo demás:
<html>
...
</html>
LA ETIQUETA <head>
Justo después de la etiqueta HTML de apertura encontraras la cabecera del documento, la cual se
identifica con las etiquetas head de apertura y cierre.
La cabecera ( o head) de un archivo HTML contiene todos los elementos no visuales que ayudan a que
la pagina funcione correctamente.
<html>
<head>…</head>
</html>
Prof:Byron Josel Buitrago Martínez Página 1
Unidad Educativa Don Bosco C Nombre:………………………………………………..
LA ETIQUETA <body>
La etiqueta body sigue después de la etiqueta head.
Todos los elementos visuales – estructurales están contenidos dentro de la etiqueta body.
Encabezados, párrafos, listas, citas, imágenes e hipervínculos son tan solo algunos de los elementos
que puede contener la etiqueta body.
<html>
<head>
</head>
<body>
</body>
</html>
EL ARCHIVO HTML
Los archivos HTML son archivos de texto, por lo que puedes usar cualquier editor de texto para crear
tu primera pagina web.
Existen algunos editores de HTML muy buenos; puedes escoger el que crees conveniente. Por ahora,
vamos a escribir nuestros ejemplos en el bloc de notas:
Prof:Byron Josel Buitrago Martínez Página 2
Unidad Educativa Don Bosco C Nombre:………………………………………………..
Añade la estructura básica HTML en el editor de texto con la frase “esto es una línea de texto” en la
sección de body.
<html>
<head>
</head>
<body>
esto es una línea de texto.
</body>
</html>
En nuestro ejemplo, hemos guardado el archivo como [Link]
Al abrir el archivo, se mostrara el siguiente resultado en el navegador:
Prof:Byron Josel Buitrago Martínez Página 3
Unidad Educativa Don Bosco C Nombre:………………………………………………..
Para colocar en la pestaña un titulo que describa la pagina web, añade un elemento <title> en tu
sección head:
<html>
<head>
<tittle>Primera página</tittle>
</head>
<body>
Esto es una línea de texto.
</body>
</html>
Esto genera el siguiente resultado:
Prof:Byron Josel Buitrago Martínez Página 4
Unidad Educativa Don Bosco C Nombre:………………………………………………..
CREANDO UN BLOG
a lo largo de este curso practicaremos la creación de tu propio blog, para que retenga y ponerlo en
práctica todo lo aprendido.
<html>
<head>
<tittle>My Blog</tittle>
</head>
<body>
Este es mi Blog.
</body>
</html>
SELLO DE PRESENTACIÓN
Prof:Byron Josel Buitrago Martínez Página 5
