El HTML, Hyper Text Markup Language (Lenguaje de
marcación de Hipertexto) es el lenguaje de marcas de texto utilizado normalmente en
la www (World Wide Web). Fue creado en
1986 por el físico nuclear Tim Berners-Lee; el cual tomo dos herramientas preexistentes: El concepto de
Hipertexto (Conocido también como link o ancla) el cual permite conectar dos
elementos entre si y el SGML (Lenguaje Estándar de Marcación General) el cual
sirve para colocar etiquetas o marcas en un texto que indique como debe verse.
HTML no es propiamente un lenguaje de programación como C++, Visual Basic, etc., sino un sistema de etiquetas. HTML no presenta
ningún compilador, por lo tanto algún error de sintaxis que se presente éste no
lo detectará y se visualizara en la forma como éste lo entienda. El entorno
para trabajar HTML es simplemente un procesador de texto, como el que ofrecen los sistemas operativos Windows (Bloc de notas), UNIX (el editor vi o ed) o el que ofrece MS Office (Word). El
conjunto de etiquetas que se creen, se deben guardar con la extensión .htm o.
html Estos documentos pueden ser mostrados por los visores o
"browsers" de páginas Web en Internet, como Netscape Navigator,
Mosaic, Opera y Microsoft Internet
explorer.
Creación de páginas web con lenguaje HTML
Para crear una página web se pueden utilizar varios programas especializados en esto, como
por ejemplo, el Microsoft Front Page o el Macromedia Dreamweaver 3. Otra forma de diseñar
un archivo .html, es copiar todo en el
Bloc de Notas del Windows, ya que este sencillo programa cumple con un requisito
mínimo que es la posibilidad de trabajar con las etiquetas con las que trabaja
este lenguaje.
A continuación les mostraremos las etiquetas mas comunes que deben aprenderse para hacer una pagina Web.
A continuación les mostraremos las etiquetas mas comunes que deben aprenderse para hacer una pagina Web.
Estructura de los documentos de HTML
Si se tiene en cuenta el contenido del documento, todos los documentos de HTML bien escritos comparten una estructura en común. Un documento de HTML empieza con la etiqueta <HTML>, que es la que encerrará el documento actual. Contiene dos secciones primordiales: la cabecera y el cuerpo encerradas respectivamente por los elementos <HEAD> cabeza y <BODY> cuerpo.
La cabecera puede contener información y siempre contiene el titulo del documento encerrado por el elemento <TITLE>.
En el cuerpo se encuentra todo el contenido del documento, ya sea, texto, imágenes, sonidos, hipervínculos, etc.
Un documento escrito en HTML contiene las siguientes etiquetas en el siguiente orden:
Si se tiene en cuenta el contenido del documento, todos los documentos de HTML bien escritos comparten una estructura en común. Un documento de HTML empieza con la etiqueta <HTML>, que es la que encerrará el documento actual. Contiene dos secciones primordiales: la cabecera y el cuerpo encerradas respectivamente por los elementos <HEAD> cabeza y <BODY> cuerpo.
La cabecera puede contener información y siempre contiene el titulo del documento encerrado por el elemento <TITLE>.
En el cuerpo se encuentra todo el contenido del documento, ya sea, texto, imágenes, sonidos, hipervínculos, etc.
Un documento escrito en HTML contiene las siguientes etiquetas en el siguiente orden:
Ejemplo:
<HTML>
<HEAD>
<TITLE> Título de mi página de Internet </TITLE>
</HEAD>
<BODY>
<H1> <CENTER> Primera pagina </CENTER> </H1>
<HR>
<HTML>
<HEAD>
<TITLE> Título de mi página de Internet </TITLE>
</HEAD>
<BODY>
<H1> <CENTER> Primera pagina </CENTER> </H1>
<HR>
Esta es mi primera pagina, aunque todavía es muy
sencilla. Como el lenguaje HTML no es difícil, pronto estaremos en condiciones
de hacer cosas mas interesantes.
<P> Aquí va un segundo párrafo.
</BODY>
</HTML>
<P> Aquí va un segundo párrafo.
</BODY>
</HTML>
Para escribir títulos se usa la etiqueta
<Hx></Hx> en donde x es un número.
Ejemplo:
<h1>Titulo principal</h1>
<h2>Titulo secundario</h2>
<h3>Titulo terciario</h3>
<h4>Titulo cuarto nivel</h4>
<h5>Titulo quinto</h5>
<h6>Titulo sexto</h6>
Ejemplo:
<h1>Titulo principal</h1>
<h2>Titulo secundario</h2>
<h3>Titulo terciario</h3>
<h4>Titulo cuarto nivel</h4>
<h5>Titulo quinto</h5>
<h6>Titulo sexto</h6>
Quedaría así:
Titulo principal
Titulo secundario
Titulo terciario
Titulo cuarto nivel
Titulo quinto
Titulo sexto
Titulo principal
Titulo secundario
Titulo terciario
Titulo cuarto nivel
Titulo quinto
Titulo sexto
Listas
Las listas se definen de forma muy sencilla: se dice
dónde empieza la lista, dónde empieza cada punto y dónde acaba la lista. Las
etiquetas que se utilicen en cada caso deben aparecer al principio de línea, o
al menos sin texto por delante (sólo espacios o tabulaciones).
Las listas pueden ser: Lista desordenada, <UL>
(Unordered List).
Lista ordenada, <OL> (Ordered List).
Ejemplos de diferentes tipos de listas:
Lista ordenada, <OL> (Ordered List).
Ejemplos de diferentes tipos de listas:
Lista con números romanos:
<ol>
<li type=I>Manzana
<li type=I>Zanahoria
<li type=I>Lechuga
<li type=I>Tomate
</ol>
Manzana
Zanahoria
Lechuga
Tomate
<ol>
<li type=I>Manzana
<li type=I>Zanahoria
<li type=I>Lechuga
<li type=I>Tomate
</ol>
Manzana
Zanahoria
Lechuga
Tomate
Lista numerada:
<ol>
<li>Manzana
<li>Zanahoria
<li>Lechuga
<li>Tomate
</ol>
Manzana
Zanahoria
Lechuga
Tomate
<ol>
<li>Manzana
<li>Zanahoria
<li>Lechuga
<li>Tomate
</ol>
Manzana
Zanahoria
Lechuga
Tomate
Lista con puntos:
<ul>
<li> Manzana
<li> Zanahoria
<li> Lechuga
<li>Tomate
</ul>
Manzana
Zanahoria
Lechuga
Tomate
<li> Manzana
<li> Zanahoria
<li> Lechuga
<li>Tomate
</ul>
Manzana
Zanahoria
Lechuga
Tomate
Lista con círculos:
<ul>
<li type=circle> Manzana
<li type=circle> Zanahoria
<li type=circle> Lechuga
<li type=circle> Tomate
</ul>
Manzana
Zanahoria
Lechuga
Tomate
<ul>
<li type=circle> Manzana
<li type=circle> Zanahoria
<li type=circle> Lechuga
<li type=circle> Tomate
</ul>
Manzana
Zanahoria
Lechuga
Tomate
Lista con cuadrados:
<ul>
<ul>
<li type=square> Manzana
<li type=square> Zanahoria
<li type=square> Lechuga
<li type=square> Tomate
</ul>
Manzana
Zanahoria
Lechuga
Tomate
<li type=square> Zanahoria
<li type=square> Lechuga
<li type=square> Tomate
</ul>
Manzana
Zanahoria
Lechuga
Tomate
No hay comentarios:
Publicar un comentario