QUÉ ES HTML
El HTML (Hyper Text Markup Language) es el lenguaje con el que se escriben las páginas web. Es un lenguaje
de hipertexto, es decir, un lenguaje que permite escribir texto de forma estructurada, y que está compuesto
por etiquetas, que marcan el inicio y el fin de cada elemento del documento.
Un documento hipertexto no sólo se compone de texto, puede contener imágenes, sonido, vídeos, etc., por
lo que el resultado puede considerarse como un documento multimedia.
Los documentos HTML deben tener la extensión html o htm, para que puedan ser visualizados en los
navegadores (programas que permiten visualizar las páginas web).
Los navegadores se encargan de interpretar el código HTML de los documentos, y de mostrar a los usuarios
las páginas web resultantes del código interpretado.
Para crear páginas web escribiendo directamente el código HTML puedes utilizar la herramienta Wordpad o
el Bloc de notas que proporciona Windows.
ETIQUETAS
Las etiquetas o marcas delimitan cada uno de los elementos que componen un documento HTML. Existen
dos tipos de etiquetas, la de comienzo de elemento y la de fin o cierre de elemento.
La etiqueta de comienzo está delimitada por los caracteres < y >.
La etiqueta de final está delimitada por los caracteres </ y >. Está compuesta por el identificador o nombre
de la etiqueta, y no contiene atributos. Su sintaxis es: </identificador>
ESTRUCTURA BÁSICA
Toda página Web debe contener la siguiente estructura:
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY> Esta es mi primera página Web</BODY>
</HTML>
COMANDOS BASICOS
 < HTML > ... < /HTML > : Indica el comienzo y fin de un archivo HTML
 < HEAD > ... < /HEAD > : Indica el comienzo y fin de un encabezado (aquí se coloca generalmente el
título).
 < TITLE > ... < /TITLE > : Indica el título.
 < BODY > ... < /BODY > : Indica el comienzo y fin del cuerpo de la página.
 < P > ... < /P > : Indica comienzo y fin de un párrafo.
 Texto en <B>Negritas</B>
 Texto en <I>Itálica</I>
 Texto <U>subrayado</U>
 <P align="left">...</P>
Párrafo alineado a la izquierda
 <P align="center">...</P> Párrafo centrado
 <P align="right">...</P>
Párrafo alienado a la derecha






<P align="justify">...</P> Párrafo justificado
<Hx> </Hx>. Se utiliza para resaltar encabezados. Donde x es un número entre 1 y 6, siendo 1 el tamaño
más grande y 6 el más pequeño
<PRE> </PRE> Permite que el texto que se encuentre dentro de ella se visualice tal como se creó en la
página origen, respetando espaciado, salto de línea, salto de párrafo, tabulación, etc.
<BR> Realiza un salto de línea. Esta etiqueta no necesita cerrarse.
<P> Realiza un salto de párrafo. Tampoco necesita cerrarse.
<CENTER> </CENTER> Posiciona el texto seleccionado en el centro de la página. También puede
aplicarse a gráficos.
EJEMPLOS DE COLORES:
ROJO FF0000
VERDE 00FF00
AZUL 0000FF
MAGENTA FF00FF
VIOLETA 9900DD
ROSA CLARO FFDDFF
Ejemplo:
<BODY BGCOLOR="FFFFFF" TEXT="FF0000" LINK="00AEFF">
BGCOLOR es el color del fondo.
TEXT es el color del texto.
LINK es el color del enlace.
También se puede cambiar el color sólo para un segmento deseado como:
<FONT COLOR="#FF0000">Texto</FONT>
EJEMPLOS PARA INSERTAR IMAGEN
Para agregar una imagen en un documento se utiliza la etiqueta <IMG>.
Ejemplo:
<IMG SRC="home2.jpg" ALT="Casa azul">
<center><IMG SRC="home2.jpg" ALT="Casa azul"></center>
Donde:
IMG indica el deseo de cargar una imagen.
SRC indica la ruta en la que se encuentra nuestro gráfico. Este puede estar en el mismo directorio de
nuestra página, en otro directorio, o incluso en un servidor en algún lugar del mundo.
ALT asigna un nombre a la imagen para que cuando alguien cargue nuestra página desde un navegador que
no despliegue gráficos, pueda saber que en ese lugar existe una imagen.
TALLER GUIADO
MI PRIMERA PÁGINA
1. Debes abrir el blog de notas
2. Seguidamente introduce, en el documento en blanco, el
texto siguiente:
<html>
<head>
<title>MI PRIMERA PAGINA</title>
</head>
<body bgcolor="#FFCC99">
<font color="#CC3300" size="5">Hola, estoy haciendo pruebas.</font>
</body>
</html>
3. Guarda el documento con la extensión html, con el nombre mipagina.html. Puedes guardarlo a
través del menú Archivo, opción Guardar.
Pulsando dos veces sobre el icono del archivo mipagina.html, éste debería abrirse automáticamente en el
navegador que tengas instalado.
Vamos a continuar practicando
Abrir el documento y añadir en el cuerpo las siguientes líneas y guardar nuevamente.
<P align="left">Este párrafo está alineado a la izquierda. En la práctica, equivale sencillamente a la misma
etiqueta sin indicación de alineación.</P>
<P align="center">Este párrafo está centrado. Hay una línea en blanco entre este párrafo y el anterior.</P>
OBSERVA EL RESULTADO, AHORA VAMOS A COPIAR LA SIGIENTE LINEA:
<P>Ahora vamos a alinear tres líneas seguidas de tres maneras diferentes, pero sin dejar líneas vacías entre
ellas, por medio de otras etiquetas:</P>
OBSERVA EL RESULTADO, AHORA VAMOS A COPIAR LA SIGIENTE LINEA:
<DIV align="left">alineado izquierdo alineado izquierdo alineado izquierdo alineado izquierdo</DIV>
<DIV align="center">alineado centrado alineado centrado alineado centrado alineado centrado</DIV>
<DIV align="right">alineado derecho alineado derecho alineado derecho alineado derecho </DIV>