LENGUAJE DE PROGRAMACIÓN HTML
INTRODUCCIÓN
Internet es una red mundial de sistemas informáticos interconectados que ofrece varias formas distintas a los usuarios para que se comuniquen entre sí. Así, existe el correo electrónico (E-mail), Chat y lo que es más importante, el World Wide Web (www). La web es en realidad la más reciente plataforma de Internet que le permite desplazarse rápidamente de una computadora a otra, saltando de una página web a otra utilizando un navegador.
Los sitios web están formados por documentos vinculados creados en el lenguaje de programación HTML. El explorador del web es capaz de traducir el lenguaje HTML a un formato visualizable (y utilizable) en la computadora.
HTML
El HTML (Hipertext Markup Language) es un lenguaje de los llamados “lenguaje de cliente”, es decir, que es el navegador quien interpreta el código HTML y lo muestra en pantalla según esa interpretación. El HTML es un lenguaje para programar páginas web y, aunque es cierto que desde su principio se han realizado varias versiones (la 1.0, la 2.0, ...), sí disponemos de una versión actualizada de cualquier navegador, no tendremos problemas para visualizar cualquier tipo de página.
El lenguaje de marcado de hipertexto es el sistema de codificación utilizado para crear páginas web para el WWW.
El HTML se basa en el uso de etiquetas. Estas etiquetas tienen la estructura siguiente:
<ETIQUETA> Inicio de la etiqueta.
</ETIQUETA> Fin de la etiqueta.
El nombre de la etiqueta encerrado entre los símbolos < > puede ir en mayúsculas o en minúsculas pero, como consejo, utilizaremos solo las minúsculas para mayor claridad y organización. Además, las etiquetas pueden no estar situadas una debajo de otra, pero, por el mismo motivo, intentaremos separarlas y ordenarlas haciendo uso de los saltos de línea.
Las etiquetas tienen atributos, propiedades que nos servirán para programar y definir las características de los elementos de nuestra web. Dichos atributos se escriben atendiendo a la siguiente estructura:
<etiqueta atributo=”Valor”></etiqueta>
Ej.: <font face=”Arial”></font>
Como antes, los atributos y valores pueden estar en mayúscula o minúscula.
Para programar en este lenguaje no necesitaremos compiladores, simplemente podremos hacerlo con un editor de texto (Block de Notas) y un navegador (Internet Explorer) para ver los resultados.
CONCEPTOS BÁSICOS
Un documento programado en lenguaje HTML debe ir entre las etiquetas <HTML> y </HTML>, es decir:
<HTML>
(Cuerpo de la página)
</HTML>
Dentro de toda página se distinguen dos zonas principales, el encabezamiento y el cuerpo.
Encabezamiento: en el encabezamiento definiremos aspectos importantes de la página, tales como el título de la misma. Las etiquetas que engloban el encabezamiento son <HEAD> y </HEAD> y las etiquetas en las que debe estar el título, <title> y </title>. El título deberá ser breve y descriptivo, pues es lo que verán los usuarios cuando agreguen a Favoritos.
Cuerpo: en el cuerpo irán todas las demás etiquetas y elementos, texto, imágenes, etc. Ente <BODY> y </BODY>.
Por lo tanto, la estructura básica de una página web, sería:
<html>
<head>
<title> Titulo de la página </title>
</head>
<body>
(Etiquetas y cuerpo de la página)
</body>
</html>
Los documentos HTML tienen extensión .html ó .htm. Por lo tanto en el momento de convertir un archivo del Block de Notas para que sea visualizado a través de Internet Explorer recordar:
Nombre de archivo: index.htm
Guardar como
Archivo tipo: Todos los archivos (*.*)
EJEMPLO
<html>
<head>
<title>La Web que esperabas</title>
</head>
<body>
<body bgcolor="blue">
<hr color="red">
<hr color="red">
<p align="center"><font face="verdana" size="7" color="green"><b>SITIO OFICIAL</b></font> </p>
<hr color="red">
<hr color="red">
<p align="center"><font face="verdana" size="5" color="green"><b> - COLEGIO JESÚS MARÍA -</b></font></p>
<p><marquee style=font face="Arial" font size="50 pto" behavior="alternate" bgcolor="white"> "HACER CONOCER Y AMAR A JESÚS Y A MARÍA"</marquee></p>
<hr color="red">
<p align="center"><font face="verdana" size="4" color="green"><b>VUELVAN </b></font></p>
</body>
</html>
GLOSARIO
<p>: párrafo
<b>: negrita
<i>: cursiva
<u>: subrayado
<font face>: tipo de fuente
<font color>: color fuente
<font size>: tamaño fuente: del 1 al 7.
<body bgcolor>: color del cuerpo
<hr>: línea horizontal
<p align>: alineación del párrafo (left, center, right)
<marquee style>: estilo de marquesina
<behavior>: comportamiento de la marquesina (alternate, slide).
