Guia para el principiante
Este documento asume que usted sabe como publicar en WWW.
Lenguaje HTML
El lenguaje HTML es el usuado actualmente para escribir textos hypermediales en el
Web.
El siguiente texto, está diseñado como una primera aproximación al lenguaje HTML.
Tres normas fundamentales
1. HTML es simplemente texto
Lo primero es saber que un documento HTML es un archivo de texto simple, luego, se
puede editar con cualquier editor de texto.
2. No importan los tabs, ni los saltos de
línea
Los intérpretes HTML no toman en cuenta las tabulaciones, los saltos de línea ni los
espacios en blanco extra. Esto tiene ventajas y desventajas. La principal ventaja es que
permite obtener resultados uniformes y de buena presentación de manera bastante fácil.
La principal desventaja es que un documento HTML, por lo menos se debe usar los
comandos <P>...</P> o <BR> para evitar que quede todo el texto en una sola
línea.
3. Existen tres caracteres especiales
• < Menor que, se usa para indicar el comienzo de un comando HTML.
• > Mayor que, se usa para indicar el término de un comando HTML.
• & Ampersand, se usa para escribir caracteres especiales (símbolos matemáticos,
comerciales, así como el signo menor que y el mayor que entre otros) en un
documento.
Comandos básicos de HTML
Lo primero es conocer los comandos que debe contener todo documento
HTML de más de una línea de largo.
El comando párrafo
El comando <P> ... </P> se usa como un delimitador de párrafo en HTML. Inserta
automáticamente un quiebre de línea al final del párrafo, y produce un espaciamiento
conveniente entre los diferentes párrafos de un documento.
Adicionalmente permite alinear el texto al centro, a la izquierda o a la derecha.
El comando quiebre de línea
El comando <BR> permite hacer un quiebre (salto) de línea.
Adicionalmente se permite realizar saltos más largos o más cortos, dejar atrás las imágenes,
etcétera.
Los comandos de encabezamiento
Los textos en HTML poseen seis niveles de encabezados. El nivel de encabezado 1 se usa para
las divisiones mayores del texto; es, por lo tanto, el que hace que el texto sea más grande. El
nivel de encabezado 6 se usa para las divisiones más chicas del texto; luego, es el que muestra
el texto más pequeño.
Todos los comandos de encabezado se escriben de a pares, e insertan un quiebre de línea al
final del texto que delimitan.
<H1>Nivel de encabezado 1</H1>
<H2>Nivel de encabezado 2</H2
<H3>Nivel de encabezado 3</H3>
<H4>Nivel de encabezado 4</H4>
<H5>Nivel de encabezado 5</H5>
<H6>Nivel de encabezado 6</H6>
Apariencia del texto
Hay varios comandos para hacer distinta la manera en que aparece el texto. Se trata de
delimitadores, que indican donde comienza y donde termina el texto que se verá diferente.
Estos comandos se pueden mezclar entre sí. Algunos de ellos son:
<B>Negrita (Bold)</B>
<I>Cursiva (Italic)</I>
<BLINK>Parpadeante (Blink)</BLINK>
<TT>Tamano fijo (TypeWriter)</TT>
<EM>énfasis (Emphasis)</EM>
<STRONG>Gran énfasis (Strong)</STRONG>
<U>Subrayado (Underline)</U>
Estructura del hypertexto
Existen dos partes fundamentales de un documento HTML.
Encabezado
Cuerpo
Se inicia mediante el comando <HEAD> y se termina con </HEAD>. Por lo general
se incluye aquí el título del documento, mediante el comando <TITLE> ...
</TITLE>.
Se inicia mediante el comando <BODY> y se termina con el comando . Este comando
acepta numerosos modificadores. Dentro del cuerpo del documento se incluye
cualquier carácter imprimible.
Además, es importante incluir el comando <ADDRESS> ... </ADDRESS> al final del
cuerpo del documento (pero dentro de el). Dentro del ADDRESS se escribe el nombre del
autor del documento, la organización a la que pertence, su dirección de correo electrónico, y
otra información que se considere relevante (por ejemplo, la última fecha de actualización del
documento).
Un primer ejemplo usando estos comandos
básicos
<HEAD>
<TITLE>Tejedores del Web - Ejemplo numero uno</TITLE>
</HEAD>
<BODY>
<H>Ejemplo numero uno</H>
<H>Primera parte</H>
<P>Aprendimos a usar el comando párrafo.</P>
O a cortar una línea usando BR.<BR>
<H>Segunda parte</H>
<P>Aprendimos a marcar palabras <B>importantes</B>, otras <B><I>mas
importantes</I></B>, y otras <STRONG>tremendamente
importantes</STRONG></P>
<H2>Nota</H2>
<P>Tambien aprendimos a hacer <BLINK>parpadear</BLINK> el
texto.</P>
<ADDRESS>
[email protected]<BR>
Santiago de Chile, 1 Enero 2010<BR>
</ADDRESS>
</BODY>
Más comandos en HTML
El comando HTML
El comando <HTML> ... </HTML> se usa para delimitar el documento en
hypertexto completo. Es útil incluirlo para evitar conflictos con futuras
revisiones del lenguaje HTML.
Este comando permite además indicar al cliente la versión de HTML que
estamos usando, entre otras cosas.
Listas
Revisaremos dos tipos de lista que se pueden incluir en un hypertexto. Ambos
tipos permiten varios niveles de enlace, es decir, podemos tener una lista dentro
de otra lista.
Listas no numeradas
También llamadas listas no ordenadas, se declaran usando el comando <UL> ...
</UL>. Cada item de la lista se marca con un <LI>. El resultado final es que el
item se separa del borde izquierdo y aparece marcado con un símbolo (un pu nto,
un cuadrado, etc.. depende del nivel de enlace).
Listas numeradas
También llamadas listas ordenadas, se declaran usando el comando <OL> ...
</OL>. Cada item de la lista se marca con un <LI>. El resultado final es que el
item se separa del borde izquierdo y aparece marcado con un número. Este
comando permite especificar el tipo de numeración que se dará (números
arábigos, números romanos, letras, etc.) .
Una lista no numerada se ve así:
• Primer item
• Segundo item
o Primer subitem
o Segundo subitem
• Tercer item
Lo que en HTML se escribe:
<UL>
<LI>Primer item
<LI>Segundo item
<UL>
<LI>Primer subitem
<LI>Segundo subitem
</UL>
<LI>Tercer item
</UL>
La misma lista numerada se ve así:
1. Primer item
2. Segundo item
o Primer subitem
o Segundo subitem
3. Tercer item
Lo que en HTML se escribe:
<OL>
<LI>Primer item
<LI>Segundo item
<UL>
<LI>Primer subitem
<LI>Segundo subitem
</UL>
<LI>Tercer item
</OL>
Listas descriptivas
Una lista descriptiva es muy útil al momento de hacer glosarios, índices, referencias a otros
documentos, o describir, en general, cualquier cosa.
Una lista descriptiva se declara usando el comando <DL> ... </DL>. Cada ítem de la lista
consta de un título, marcado mediante <DT> ... </DT>, y una descripción para dicho título,
que se indica mediante el comando <DD>.
Una lista descriptiva se ve así:
Primer nombre a describir
Descripción del primer nombre
Segundo nombre a describir
Descripción del segundo nombre
Lo que en HTML se escribe:
<DL>
<DT>Primer nombre a describir</DT>
<DD>Descripción del primer nombre
<DT>Segundo nombre a describir</DT>
<DD>Descripción del segundo nombre
</DL>
Existen otros tipos de lista: listas de directorio y menús
Texto preformateado
El uso de texto preformateado permite crear un espacio para que el cliente pueda interpretar
los tabs, quiebres de línea y espacios en blanco incluidos en el documento. Además, en el texto
preformateado no se interpretan los caracteres especiales HTML : <, > y &.
Para incluir texto preformateado, se usa el comando <PRE> ... </PRE>. El tipo de letra
usado por el texto preformateado es el mismo que el de <TT> ... </TT>.
El texto preformateado se ve así:
Se pueden insertar espacios en blanco, saltos de linea y
tabulaciones.
Centrando texto
Para centrar una parte del documento, se delimita lo que se desea centrar mediante el comando
<CENTER> ... </CENTER>.
El texto centrado se ve así.
Lineas horizontales
Una línea horizontal es un separador muy usado en HTML. En un cliente gráfico, aparece
como una delgada línea horizontal. En un cliente de texto, aparece como una línea hecha con -
Se inserta con el comando <HR>. Este comando acepta varios modificadores .
Un ejemplo de la segunda parte
<HTML>
<HEAD>
<TITLE>Tejedores del Web - Ejemplo numero dos</TITLE>
</HEAD>
<BODY>
<H2>Listas</H2>
<H3>No numeradas</H3>
<OL>
<LI>Aprendimos a usar listas no numeradas
<LI>Para clasificar la información
</OL>
<H3>Numeradas</H3>
<UL>
<LI>También podemos hacer que HTML
<LI>Cuente por nosotros
</UL>
<HR>
<H2>Descripciones</H2>
<DL>
<DT>Descripcion</DT>
<DD>Es nombrar las propiedades de algo
<DT>Lista descriptiva</DT>
<DD>Es nombrar las propiedades de varios objetos
</DL>
<CENTER>También sabemos centrar el texto.</CENTER>
<TT>
<PRE> y escribir preformateado </PRE>
</TT>
<HR>
<ADDRESS>
[email protected]<BR>
Santiago de Chile, 1 Enero 2010<BR>
</ADDRESS>
</BODY>
</HTML>
Cómo crear una tabla ?
Una tabla es una manera muy compacta y clara de mostrar la información. Una tabla en HTML
se entiende como un conjunto de filas (fila=horizontal), apiladas una sobre otra. Cada fila
contiene a su vez un conjunto de celdas, puestas una al lado de la otra.
Una tabla se declara usando el comando <TABLE> ... </TABLE>. Dentro de la tabla, se usa
<TR> ... </TR>para indicar una fila y dentro de una fila, <TD> ... </TD> para delimitar el
contenido de una celda. El elemento de cierre de fila y de celda es optativo.
Todos estos comandos aceptan numerosos modificadores. Se pueden, entre otras cosas, unir
celdas, especificar la alineación del contenido de la celda, y mucho más .
Para entender mejor el comando <TABLE> ... </TABLE>, está disponible una muy amplia
gama de ejemplos.
Ejemplo de tabla
Aquí se muestra una tabla muy simple:
<TABLE>
<TR><TD>Celda A1</TD><TD>Celd
Crear cuenta
Comentarios de: HTML básico (0)
No hay comentarios