(Pregunta rápida - ¿Qué significan esas iniciales? ¡Si lee la lección anterior lo sabrá!).
<nombre_etiqueta>cadena de texto</nombre_etiqueta>Como ejemplo, el título de esta sección usa una etiqueta de encabezado del tipo:
<h3>¿Qué son las etiquetas HTML?</h3>Esta etiqueta le dice a su Web Browser que muestre en pantalla el texto "¿Qué son las etiquetas HTML?" en un estilo de encabezado de nivel 3 (ya aprenderemos más acerca de estas etiquetas más adelante).
Las etiquetas HTML pueden decirle al Web Browser que ponga un texto en negrita, en cursiva, incluirlo en un encabezado, o convertirlo en un hiperenlace a otra página Web. Es importante hacer hincapié en que la "etiqueta de finalización",
</nombre_etiqueta>contiene el caracter "/", barra inclinada o "slash". Esta barra inclinada, "/", le dice al Web Browser que termine de dar ese tipo de formato al texto.
Muchas etiquetas HTML están pensadas para funcionar por pares, "inicio" y "final". Si olvida colocar la barra inclinada, el Web Browser continuará con dicha etiqueta con el restante texto del documento, produciendo resultados desagradables (como experimento, puede intentar esto más adelante).
NOTA: Los Web Browsers no distinguen si las etiquetas van escritas en mayúsculas o minúsculas. Por ejemplo, <h3>...</h3> no es diferente de <H3>...</H3>
¡Su Web Browser posee un limitado pero potente vocabulario!
Un aspecto interesante del HTML es que si el Browser no sabe qué hacer con una etiqueta dada, simplemente la ignorará. Por ejemplo, en este documento que esta viendo, la etiqueta del encabezado de esta sección es realmente así:
<wiggle><h3>¿Qué son las etiquetas HTML?</h3></wiggle>pero, ya que su Web Browser probablemente no soporte la etiqueta <wiggle> (Yo añadí esta etiqueta; quizás en el futuro cause que el texto se mueva en la pantalla), hará lo que sabe hacer e ignorará dicha etiqueta. Si yo fuera el programador de un Web Browser podría decidir añadir funcionalidad a la etiqueta <wiggle> en el software.
NOTA: Este es un buen momento para recordarle que añadiremos direcciones que son comunes en cierto modo , tales como nombres de menú y nombres de archivo, pero que pueden diferir dependiendo del Web Browser que utilice.
Creemos que así estará más a gusto para poder trabajar, saltando entre dos diferentes
aplicaciones y ventanas en su ordenador.
Otra opción sería imprimir las instrucciones de la lección ( ¡aunque realmente no queremos
promover un desastre ecológico destrozando árboles! ).
Aquí tiene los pasos para preparar su espacio de trabajo:
NOTA: La única razón para tener dos ventanas es que necesitará leer las instrucciones de las lecciones y también comprobar el resultado de sus documentos de prácticas. Puede incluso añadir esta página Web a sus bookmarks (Favoritos) y volver a ella usando su menú de Ir a (Go), o su botón de Atrás (Back).
NOTA: Tenga presente que necesitará alternar entre las diferentes ventanas para completar las lecciones. Esto puede depender del tamaño y apariencia de su monitor. Puede elegir entre redimensionar las tres ventanas de modo que quepan totalmente en la pantalla, o superponerlas y que, haciendo click sobre ellas, traer la que necesite al frente.Si utiliza un procesador de textos para crear sus archivos HTML, asegúrese de salvar sus documentos en formato ASCII o texto puro y duro.
También puede servirle crear un directorio en su ordenador para guardar sus documentos. Puede llamarlo ¡rea de Trabajo o Mi Escritorio o cualquier cosa que se le ocurra; lo único que le recomendamos es que cree un directorio para estar seguro de que sus documentos estarán ahí. Puede hacer su vida más simple... bueno, ¡al menos mientras trabaje con este tutorial!
La estructura básica de cualquier página HTML es como sigue:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<html>
<head>
<!-- información de cabecera utilizada para contener información adicional acerca de
este documento, y que no se muestra en pantalla -->
</head>
<body>
<!-- todo el HTML a visualizar -->
: :
: :
: :
</body>
</html>
La primera línea de todas:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">técnicamente, no se requiere, pero es código que le dice al browser con qué versión de HTML se ha escrito dicha página. Para más información vea las Especificaciones de referencia de W3C.
Todo su código HTML deberá ir entre dos etiquetas: <html>...</html>. Y dentro de ellas, primero, <head>...</head> y luego <body>...</body>. Sus páginas Web podrían ser correctamente visibles en la mayoría de los ordenadores sin estas etiquetas. Sin embargo, usándolas, sus páginas serán totalmente compatibles con los estándares HTML y con los browsers actuales y futuros.
Es un buen hábito, como limpiarse los dientes.
Note también la existencia de las etiquetas comentario, denotadas por
<!-- blah blah blah -->.
El texto entre estas etiquetas NO será mostrado en la página Web, pero se usan para incluir
información que pueda ser de utilidad para usted o cualquier otro que mire el código HTML de
su página.
Cuando sus páginas Web se compliquen poco a poco (como verá cuando demos las tablas, frames y
otro material diverso en las próximas 20 lecciones), los comentarios serán útiles si necesita
actualizar una página que puede que haya creado tiempo atrás.
Aquí tiene los pasos para crear su primer archivo HTML... ¿Listo?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<html>
<head>
<title>Web de Volcanes</title>
<!-- escrito para el Tutorial de HTML por Alberto Estrada, 31 Diciembre, 1999 -->
</head>
<body>
En esta lección usará la Internet para buscar
información sobre volcanes y luego escribir un informe
sobre los resultados.
</body>
</html>
NOTA: Mire dónde está la etiqueta de <title>...</title>.
Está en la sección de <head>...</head> y por lo tanto no será visible en pantalla.
¿Entonces para qué sirve? La etiqueta <title> se usa para identificar únicamente a cada documento y se muestra en la barra de títulos de la ventana del Browser.En la lección 3 aprenderá cómo añadir un título que aparezca directamente en su página Web.
Note también que hemos insertado un comentario que contiene el nombre del autor y la fecha de creación del documento. Podría escribir cualquier cosa entre las etiquetas del comentario pero sólo será visible si mira directamente el código HTML de la página Web.
NOTA: Para usuarios de Windows, recuerde también que DEBE salvar sus documentos HTML con un nombre y una extensión que tiene que ser .HTM, así, en este caso de ejemplo su archivo debería denominarse VOLC.HTM.Usando esta extensión de nombre de archivo, el Web Browser reconocerá estos ficheros de texto como HTML y los mostrará correctamente en pantalla.
¡No se preocupe! Su Web Browser es lo suficientemente listo como para saber que si el nombre de un archivo termina en .HTM es que es un archivo HTML.
Si su documento es diferente del de el ejemplo, revise el texto que introdujo en el editor de textos.
La equivocación más común es: "¡No puedo ver el título!". ¡No debiera! El texto entre las etiquetas <title>...</title> NO se muestra en la página Web. Debería verlo en la barra de títulos de la ventana del Web Browser.
Tenga este fichero a mano ya que irá añadiendo cosas en próximas lecciones.
Pero, para ser sinceros, es más bien pequeña y no muy excitante...
En la siguiente lección modificará y actualizará su documento HTML.
El enlace con el MCLI es Alan Levine --}
Comentarios a levine@maricopa.edu
Traducido al español por agma@usa.net, y corregido por
Andrés Valencia
URL: