Introducción a HTML
A lo largo de estas prácticas vamos a conocer los conceptos básicos sobre HTML, y cómo se
utiliza para crear páginas web.
Qué es el HTML
El HTML (Hyper Text Markup Language) es el lenguaje con el que se escriben las páginas
web. Es un lenguaje de hipertexto, es decir, un lenguaje que permite escribir texto de forma
estructurada, y que está compuesto por etiquetas, que marcan el inicio y el fin de cada elemento
del documento.
Un documento hipertexto no sólo se compone de texto, puede contener imágenes, sonido,
vídeos, etc., por lo que el resultado puede considerarse como un documento multimedia.
Los documentos HTML deben tener la extensión html o htm, para que puedan ser visualizados
en los navegadores (programas que permiten visualizar las páginas web).
Los navegadores se encargan de interpretar el código HTML de los documentos, y de mostrar a
los usuarios las páginas web resultantes del código interpretado.
Los navegadores. Compatibilidad
Los navegadores de hoy en día pretenden ser compatibles con la última versión de HTML. Es
necesario realizar extensiones de los navegadores para que puedan ser compatibles con esta
última versión.
Dos de los navegadores que continuamente están realizando extensiones son Internet Explorer
y Netscape Navigator, que realizan extensiones incluso antes de que se establezcan los
estándares, intentando incluir las nuevas funciones incluidas en los borradores.
Editores
Un editor es un programa que nos permiten redactar documentos. Es aconsejable comenzar
utilizando una herramienta lo más sencilla posible, para tener que insertar nosotros mismos el
código HTML. Esto permite familiarizarse con el lenguaje, para poder utilizar algún editor
visual posteriormente, y depurar el código cuando fuera necesario.
Etiquetas
Las etiquetas o marcas delimitan cada uno de los elementos que componen un documento
HTML. Existen dos tipos de etiquetas: la de comienzo de elemento y la de fin o cierre de
elemento.
La etiqueta de comienzo está delimitada por los caracteres < y >. Está compuesta por el
identificador o nombre de la etiqueta, y puede contener una serie de atributos opcionales que
permiten añadir ciertas propiedades. Su sintaxis es: <identificador atributo1 atributo2 ...>
Etiqueta de comienzo.................................... <etiqueta>
Etiqueta de cierre.......................................... </etiqueta>
Cada uno de los elementos de la página se encontrará entre una etiqueta de comienzo y su
correspondiente etiqueta de cierre, a excepción de algunos elementos que no necesitan etiqueta
de cierre. También es posible anidar etiquetas, es decir, insertar etiquetas entre otras etiquetas de
comienzo y de cierre.
Práctica 2 - Introducción al html
Estructura de una página
La estructura básica de una página es:
<html>
<head>
...
</head>
<body>
...
</body>
</html>
Ahora veamos cómo funcionan estas etiquetas:
Identificador del tipo de documento <html>
Todas las páginas web escritas en HTML tienen que tener la extensión html o htm. Al mismo
tiempo, tienen que tener las etiquetas <html> y </html>.
Entre las etiquetas <html> y </html> estará comprendido el resto del código HTML de la
página.
Cabecera de la página <head>
La cabecera de la página se utiliza para agrupar información sobre ella, como puede ser el título.
Está formada por las etiquetas <head> y </head>. La etiqueta <head> va justo debajo de la
etiqueta <html>.
El título de la página es el que aparecerá en la parte superior de la ventana del navegador,
cuando la página esté cargada en él.
Para asignar un título a una página es necesario escribir el texto deseado entre las etiquetas
<title> y </title>.
Estas etiquetas han de estar dentro de la cabecera, es decir, entre las etiquetas <head> y
</head>.
Cuerpo del documento <body>
El cuerpo del documento contiene la información propia del documento, es decir lo que
queremos que se visualice: el texto de la página, las imágenes, los formularios, etc.
Todos estos elementos tienen que encontrarse entre las etiquetas <body> y </body>, que van
justo debajo de la cabecera.
A través de la etiqueta <body> es posible establecer el color o la imagen de fondo de la página.
El color de fondo puede establecerse a través del atributo bgcolor, al que es posible asignarle un
color representado en hexadecimal o por un nombre predefinido.
La imagen de fondo puede establecerse a través del atributo background, indicando la ruta en
la que se encuentra la imagen.
A través de la etiqueta <body> también es posible establecer el color del texto de la página a
través del atributo text.
Práctica 3 - Introducción a HTML
En estas prácticas vamos a aprender a cambiar las propiedades del texto, así como a insertar
caracteres especiales o separadores.
Caracteres especiales y espacios en blanco
Existen una serie de caracteres que no se visualizan correctamente en algunos navegadores, como
es el caso de la ñ y las letras acentuadas, por lo que habría que escribir el nombre que los
representa.
Siempre que se inserta texto en HTML hay que tener en cuenta que si se escriben varios espacios
en blanco seguidos sólamente se mostrará uno en el navegador. Para conseguir que se muestren
varios espacios en blanco seguidos puede sustituirse cada uno de ellos por .
Comentarios
En ocasiones podemos desear añadir comentarios aclaratorios dentro del código, de manera que
no sean visualizados en el navegador, pero sí a la hora de editar el documento.
Para insertar comentarios dentro del código, basta con insertar el texto entre <!-- y //-->
Todo el código que se inserte entre estos símbolos no será visualizado en los navegadores.
No hay comentarios:
Publicar un comentario