1. INTRODUCCIÓN

1.1 Primeros Pasos

Primero hay que definir que es HTML, HTML (Hyper Text Mark-up Language) es un lenguaje que estructura documentos para que puedan ser mostrados por los navegadores de internet, estos documentos se conocen como páginas web.

 Definición
Navegador: Aplicación que se usa para "navegar" o ver páginas web, los más conocidos son IE, Netscape, Firefox y Opera.

Esencialmente hay 2 maneras de hacer una página web, una es con un editor de HTML, que es como un "Word" pero con algunas limitaciones; y la otra es usando algún editor de texto sencillo como bloc de notas (notepad) o worpad, yo personalmente uso bloc de notas al momento de escribir páginas web. Si no saben donde encontrar un editor de HTML generalmente con el navegador vienen (el Front Page con Explorer, y el Composer de Netscape).
Pero en mi manual me voy a dedicar a trabajar más con bloc de notas, no porque no me gusten los otros, sino porque es bastante útil saber algo de html cuando se usa un editor de html.
El navegador no capta nada de lo que pones, así que tienes que decirle donde va un punto aparte, cambio de línea, cuando escribes con otro color, en fin casi todo. Bueno pero para decirle al navegador lo que pusiste, se utilizan los tags.

 Definición
Tags: Todo programa de HTML esta formado de "tags" que son algo asi como los comandos del lenguaje. Los tags van encerrados entre corchetes angulares ó "<" y ">". Da lo mismo si están en minúsculas o mayúsculas.

1.2 Los Tags

Con los tags le das forma a tu página, estas indican todo lo que se ve; como el color de la letra, donde quieres poner una imagen, etc. Hay muchos tags y a medida que avances explicaré los más importantes.
Todos los tags tienen algo en común y es que van escritos entre <>. Así el navegador puede diferenciar cuando se trata de un tag o de texto.
Supongamos que la instrucción que quieres usar es "font", donde ahora "font" no importa lo que hace, como es un tag se debe escribir entre "menor que" (<) y "mayor que" (>).
Cuando empiezas a usar este tag escribe <font>, y cuando quieres que se termine de usar escribe </font>. Si te fijas bien, este tag tiene un "slash" o "/" después del corchete angular. Cuando veas tags con slash, quiere decir que se está cerrando algún tag, en este caso el de <font>
En general el formato es el mismo para todos los tags.

1.3 Partes del Código HTML

Esencialmente las páginas web se dividen en 4 partes: inicio, cabeza, cuerpo, final.

1.3.1 Inicio <html>

Se le indica al navegador que comienza un nuevo código html, para ello se utiliza el tag <html>

1.3.2 Cabeza <head> y <title>

Esta parte se usa entre otras cosas para poner el título de la página web. Primero indica que comienza la cabeza con el tag <head>, luego el título de la página es lo que va entre <title> y </title>, finalmente indica que se acaba la parte de la cabeza con </head>. En html se vería:

<head><title> título de la página </title></head>

Este es un perfecto ejemplo de anidación de tags.

1.3.3 Cuerpo <body>

Esta parte es lo que realmente se ve en los navegadores, es decir el es cuerpo del documento, para indicar que comienza se utiliza el tag <body>, luego se pone el contenido de la página web, por el momento pon sólo un texto, para ello usa los tags <p> y </p>, todo lo que va entre estos tags es lo que el navegador mostrará en pantalla. En html se vería:

<body><p> texto de la página </p></body>

1.3.4 Fin </html>

Luego indica hasta aquí llega la página web, esto hazlo con el tag </html>

1.4 Mi Primera Página Web

Con todo esto ya puedes hacer tu primera página, para ello basta que abras un editor de texto y escribas lo siguiente:

NOTA los comentarios van entre <!-- --> si quieren no lo escriban, a todo esto <!-- --> es la etiqueta para poner comentarios.

<html>
<!-- se indica el comienzo de la página -->
<head>
<title>Mi primera página</title>
<!-- recuerden que este es el título -->
</head>
<body>
<p>*Mundo Paul*</p>
<!-- esto es lo que quieres que diga -->
</body>
</html><!-- fin -->

Entonces todo lo que tienes que hacer ahora es guardarlo como "index.html" y verlo con un navegador, lo que verias en el navegador es lo siguiente index.html