PAGINA WEB

Antes de comenzar a aprender HTML, debemos saber con qué herramientas vamos a trabajar. Primero hay que entender que HTML es un lenguaje interpretado por los navegadores; eso significa que si escribimos correctamente los comandos en el código fuente de un archivo de formato .html o .htm, el contenido de este archivo será visualizado en cualquier navegador Web (por ejemplo Internet Explorer, Mozilla Firefox, Chrome,Safari o Opera).

Si queremos ver cómo está hecha una página Web, podemos hacerlo tocando sobre cualquier punto de ésta con el botón derecho de nuestro mouse, lo que abrirá un menú desplegable con varias opciones, en nuestro caso seleccionaremos Ver Código Fuente; y así se abrirá otra ventana con el código fuente de la página Web que estamos viendo. Quizá en un principio, si no sabemos HTML no entenderemos nada de lo que nos muestra la ventana del código fuente, pero con el tiempo a medida que aprendamos y practiquemos este lenguaje comenzaremos a comprender.

Ya sabemos cómo ver el código fuente de una página Web, ahora debemos saber con qué herramienta podremos hacer nuestras propias páginas. Hay muchos editores, como Dreamweaver por ejemplo, pero en mi opinión la mejor manera de aprender es utilizando una aplicación que todos tenemos en nuestras computadoras, el Bloc de notas. En realidad con esta simple herramienta podemos realizar sitios Web desde los más pequeños y simples, hasta portales de redes sociales de los más complejos, ya que con el Bloc de notas podemos programar en distintos lenguajes.

Bien, ahora es momento de comenzar con HTML. Primero hay que aclarar que su nombre proviene de las siglas de Hypertext Markup Language, que en inglés significa Lenguaje de Marcado de Hipertexto. 

El hipertexto no es más que el texto remarcado que si es seleccionado nos redirige a otra página o documento Web; en otras palabras son los hipervínculos o links. Ya que al desarrollarse este lenguaje la característica principal que presentaba era la posibilidad de pasar de un documento a otro de manea sencilla mediante el uso de estos textos remarcados en azul, siendo muy práctico lo que finalmente lo convirtió en el sistema de exploración Web estándar que hasta el día de hoy utilizamos en Internet.

Por lo tanto ya tenemos las herramientas para crear y visualizar nuestras páginas Web.

Los archivos de las páginas Web tienen que ser de tipo .htm o .html, los dos tipos son lo mismo, por lo tanto no habrán diferencias en los documento que vayamos a crear, está en nosotros elegir cualquiera de los dos tipos.

Para guardar un archivo de página Web, vamos al menú Archivo de nuestro Bloc de notas, seleccionamosGuardar como, elegimos un nombre, luego en tipo de archivo cambiamos de Documentos de texto a Todos los archivos; esto último es muy importante, ya que si no seleccionamos el tipo de Todos los archivos, todo lo que hayamos escrito en el código fuente se guardará como archivo de tipo .txt; y nosotros queremos guardarlo como archivo .htm o .html.

Ahora pasaremos a los más importante, los comandos HTML que nos permiten hacer páginas Web.

ELEMENTOS Y ETIQUETAS DE HTML

Cada cosa que queremos mostrar en una página Web es un elemento, o sea que un elemento puede ser un párrafo, un título, una imagen, una lista, un hipervínculo, etc.

Cada elemento está definido por etiquetas y contenido. Las etiquetas son los comandos HTML que especifican lo que queremos mostrar y el contenido puede ser un texto, la dirección de una imagen, la dirección de un hipervínculo, etc.

En HTML las etiquetas deben ser abiertas y cerradas, o sea que se necesita una etiqueta de apertura que indica dónde comienza el elemento y una etiqueta de cierre que indica dónde termina el elemento.

La estructura de definición de elementos HTML es la siguiente:

<nombre-de-etiqueta-de-elemento>Contenido</nombre-de-etiqueta-de-elemento>

Por ejemplo para escribir un párrafo debemos escribir el siguiente código fuente:

<p>Este es un párrafo de ejemplo</p>

Las etiquetas HTML se forman con signos de menor y mayor los cuales rodean el nombre del comando HTML. Por ejemplo <p> es la etiqueta de párrafo. Las etiquetas de cierre utilizan una barra antes del nombre del comando; de esta manera en el caso del párrafo, la etiqueta de cierre es </p>.

Las etiquetas de apertura y cierre deben rodear al contenido del elemento, o sea que en el caso anterior el contenido viene a ser el texto, el cual debe estar rodeado por las etiquetas de apertura y cierre, <p> </p>.

Hay casos de elementos con contenido vacío, esto significa que no requieren etiqueta de apertura y cierre, éstos simplemente se cierran en la primera y única etiqueta; un ejemplo de este tipo de elementos son los saltos de línea:

<br />

El elemento anterior realiza un salto de línea al renglón inmediatamente inferior. El cierre del mismo se realiza con una barra al final de la etiqueta como se muestra en el ejemplo anterior.

Todas las páginas HTML requieren siempre de la presencia de ciertos elementos obligatorios, estos son:

<html>, <head>, <title> y <body>.

El elemento <html> define dónde comienza el documento o página HTML y dónde finaliza.

Entre las dos etiquetas de apertura y cierre <html> y</html> debemos poner el elemento <body> (que significa cuerpo); este elemento es donde se pondrá todo el contenido visual, o sea todo lo que se va a poder ver en la página; el contenido visual debe estar encerrado por una etiqueta de apertura <body> y una de cierre </body>; quedando así: