Manual HTML
Albertocsobrino20 de Noviembre de 2014
2.440 Palabras (10 Páginas)202 Visitas
FACILITADOR:
ALBERTO CORDOVA SOBRINO
2014.
Introducción al HTML
Elementos en un documento HTML
En esta guía, a las instrucciones que forman el lenguaje HTML les llamaremos elementos. Otros autores también las denominan "TAGS", o "ETIQUETAS". La notación de los elementos consiste en los símbolos < y > que encierran dentro una instrucción.
Los elementos pueden ser llenos o vacíos.
Elementos llenos
Se forman escribiendo la instrucción correspondiente seguida del texto al que se quiere aplicar la instrucción y se termina repitiendo la instrucción pero con una barra inclinada inmediatamente antes de la misma.
Por ejemplo, el elemento H1 que sirve para dar el máximo tamaño al texto, se escribirá:
<H1> Texto de prueba </H1>.
y este sería el resultado:
Texto de prueba
Si olvidas poner </H1> todo el resto de la página tendrá el mismo tamaño grande.
Elementos vacíos
Los elementos vacíos se escriben como los llenos, pero no es necesario poner la instrucción repetida al final con una barra. Esto se debe a que estos elementos no producen un efecto sobre el texto. Generalmente se utilizan para separar bloques de texto, y por tanto no es necesario indicar su fin. Empiezan y terminan en el mismo punto.
Por ejemplo, el elemento <HR> que sirve para dibujar una línea horizontal en la pantalla, se escribirá:
<HR>
Y este sería el resultado:
________________________________________
Elementos con argumento
Algunos elementos se escriben con argumento. Es como pasarle parámetros a la instrucción, y se llaman atributos del elemento.
Por ejemplo, el elemento <A> que sirve para hacer un link (enlace) con otro documento o con otra página del actual, se escribirá:
<A HREF="http://www.miservidor.es/mifichero.htm"> Link de prueba </A>.
Este es un elemento lleno donde al atributo HREF se le asigna el valor que aparece entre comillas: "http://www.miservidor.es/mifichero.htm". El texto al que afecta este elemento es Link de prueba y realiza un link con el fichero mifichero.htm que está en el servidor www.miservidor.es.
Los elementos pueden escribirse tanto en mayúsculas como en minúsculas. Puede ser preferible la primera opción ya que aporta claridad al documento fuente, y eso se agradece a la hora de hacer correcciones, pero CUIDADO, el valor de algunos atributos hay que escribirlos EXACTAMENTE como deban ser. En el ejemplo anterior no funcionaría el link si escribiéramos www.miservidor.es en mayúsculas, eso es un nombre de máquina y sería interpretado como OTRA máquina.
Los elementos pueden anidarse unos con otros, teniendo cuidado de poner los cierres en el lugar adecuado. Por ejemplo, el elemento <H1> combinado con <I> que sirve para generar texto en itálica, se escribirá:
<H1><I>Texto de prueba </I></H1>.
y este sería el resultado:
Texto de prueba
Los elementos, en HTML, los puedes escribir tanto en mayúsculas como en minúsculas. Funciona igual <P> que <p>. A la hora de revisar el código escrito, resulta más claro si se escribieron en mayúsculas, pero si en el futuro hay que convertir la página a otro estándar, como el XHTML, no se admitirán las mayúsculas. Si no piensas migrar a otras tecnologías, hazlo como más cómodo te resulte.
ESTRUCTURA DE UNA PÁGINA HTML
Las páginas HTML están estructuradas en dos partes diferenciadas: la HEAD (cabecera) y el BODY (cuerpo).
Ejemplo de página
Si escribes:
<! Tipo de documento>
<HTML>
<HEAD>
<TITLE> Documento de prueba </TITLE>
</HEAD>
<!-- Esto es un comentario-->
<BODY>
<H1> Esto es una "demo" de documento HTML </H1>
Esto es el más sencillo de los documentos HTML.
</BODY>
</HTML>
El tipo de documento no es obligatorio a efectos prácticos, es decir que la página se verá igual tanto si lo escribes como si no. Sólo sirve como identificación del tipo de contenido del fichero a los efectos de cumplir las especificaciones de estándar recomendadas por el consorcio W3C, que es el organismo que regula el lenguaje. Por ejemplo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://w3.org/TR/REC-html40/loose.dtd">
Indica que cumple el estándar HTML 4.0
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
"http://w3.org/TR/REC-html40/strict.dtd">
Significa que cumple el estándar HTML 4.0 y, además, no contiene elementos desaconsejables.
Y esta es una definición de marcos que cumple el estándar HTML 4.0:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN"
"http://w3.org/TR/REC-html40/frameset.dtd">
En el HTML 4.0 se consideran desaconsejables aquellos elementos que, aun siendo soportados, han sido sustituidos por otros y, por ello, es posible que sean eliminados en el futuro. En cualquier caso, el que un elemento escrito en tus páginas se vea o no, dependerá siempre del navegador utilizado y/o de su versión, no de lo que diga el estándar.
Puedes ver el aspecto real del ejemplo de página pulsando aquí.
Para escribir comentarios en la página (que sólo se ven en el texto fuente, pero no en el visualizador) se utilizará el elemento
<!-- --> cuidado: el que no se vea de forma normal en el navegador, no significa que no pueda verse el código fuente. Nunca escribas comentarios con claves de acceso o datos confidenciales.
________________________________________
Esquema de tipos de un documento HTML
Cuando un visualizador recibe un fichero, antes de mostrarlo necesita saber el tipo de contenido que éste tiene, a fin de procesarlo adecuadamente. No es lo mismo recibir un documento de texto que una fotografía en formato GIF, o un vídeo en formato MPG, o si lo que estamos intentando es transferir un fichero.
En cada caso, el visualizador pondrá en juego distintas habilidades, de las muchas que posee.
Si el fichero procede de un servidor http remoto, (es decir un servidor web; http es el nombre del protocolo que utilizará el servicio invocado), éste se encargará de decirle al visualizador cuanto necesite saber, pero si lo que hay que procesar es un fichero local, la única forma de saberlo es por la extensión del fichero.
La extensión de un fichero son las tres o cuatro letras (depende del sistema operativo con el que se trabaje) que hay después del nombre del fichero y que están separadas del mismo por un punto.
Por ejemplo, esta página se llama estruc.htm. Las tres letras que hay después del punto (htm) son la extensión del fichero. Las otras, las que están delante del punto, son el nombre del fichero.
Las extensiones de 4 o más letras son típicas de sistemas operativos como UNIX o LINUX y las de 3 o menos de Windows, que ha mantenido esta costumbre por herencia de los tiempos del DOS, ya que puede trabajar perfectamente con extensiones de más de 3 letras. Por ejemplo, la extensión .html funciona en Windows igual que la .htm
Estas son algunas de las extensiones estándar más comunes y sus contenidos. La primera de ellas suele utilizarse en sistemas UNIX-LINUX y la segunda en Windows:
.html o .htm
Documento HTML. Contine texto e instrucciones HTML que serán interpretadas.
.text o .txt
Contiene texto plano. El visualizador presentará todo el fichero como si fuera un único bloque de texto y no interpretará ninguna instrucción HTML que pudiera llevar. Esto lo hará con cualquier fichero que lleve una extensión desconocida o simplemente no lleve ninguna.
.gif
Contiene un fichero de imagen en formato GIF.
.npg
Contiene un fichero de imagen en formato NPG.
.xbm
Contiene un fichero de imagen en formato X-Bitmap (blanco y negro).
.xpm
Contiene un fichero de imagen en formato X-Pixmap (color).
.jpeg o .jpg
Contiene un fichero de imagen en formato codificado jpeg.
.mpeg o .mpg
Contiene un fichero de imagen de video o cine (en movimiento).
.au
Contiene un fichero de audio (sonido) codificado en aiff-encoded.
.mid
Contiene un fichero de audio (sonido) generado con secuenciadores midi típicos de Windows.
.avi
Contiene un fichero con video y sonido típico de Windows.
.mp3
Contiene un fichero con sonido típico de Windows y otros sistemas.
.exe
Contiene un fichero binario ejecutable en DOS o Windows.
.hqx
Contiene un fichero binario ejecutable en Macintosh.
.Z o .zip
Contiene un (o varios) fichero/s comprimido/s de cualquier clase.
...