Download Introducción al HTML

Escuela de Enseñanza Secundaria Técnica N° 3
Prof.: Carlos Acuña
INTRODUCCIÓN A HTML
H
TML es el lenguaje con el que se escriben las páginas web. Las páginas web
pueden ser vistas por el usuario mediante un tipo de aplicación llamada
navegador.
Podemos decir por lo tanto que el HTML es el lenguaje usado por los navegadores
para mostrar las páginas webs al usuario, siendo hoy en día la interfaz más
extendida en la red.
Este lenguaje nos permite aglutinar textos, sonidos e imágenes y combinarlos a
nuestro gusto. Además, y es aquí donde reside su ventaja con respecto a libros o
revistas, el HTML nos permite la introducción de referencias a otras páginas por
medio de los enlaces hipertexto.
Versiones del HTML
Las siglas HTML significan HyperText Markup Language, lo que para nosotros quiere
decir que es un lenguaje de hipertexto. Existen múltiples formatos de hipertexto (por
ejemplo, el programa de ayuda en Windows “Help Center”), una seria de páginas con
instrucciones del sistema y lo que tienen en común es que todos poseen enlaces a otros
temas más específicos.
Versión
Características
2
Cuando se produjo la explosión de Internet, el estándar de HTML que
circulaba era el 2.0 (establecido en noviembre del 95), de modo que
cualquier navegador que encontremos será capaz de interpretarlo hoy
día. Prácticamente todo lo que veamos en los próximos capítulos está
contemplado por este estándar.
3 y 3.2
Aunque la versión 2.0 cumplía bien el objetivo para el que se creó,
carecía de herramientas para tener un control en las páginas. No se
consideró necesario que lo tuviera, ya que por aquel entonces Internet
era un fenómeno más bien a la actividad académica y el contenido se
basaba sobre el diseño. Debido a ello, Netscape (líder del mercado de
navegadores por aquel entonces) empezó a incluir etiquetas nuevas no
incluidas en ningún estándar.
Por estos problemas, el IETF, (el comité que suele decidir todos los
estándares dentro de Internet) comenzó a elaborar el borrador del HTML
3.0, que resultó ser demasiado grande para la época, lo que atrasó su
aceptación en el mercado. Esto llevó a una serie de compañías (entre
Laboratorio de Aplicaciones, Introducción a la maquetación en HTML
1
Escuela de Enseñanza Secundaria Técnica N° 3
Prof.: Carlos Acuña
ellas Netscape, Microsoft, IBM, Sun, etc.) a crear un nuevo comité
llamado W3C y 508, que es el que actualmente elabora las nuevas
versiones del HTML. Su primer trabajo consistió en crear el borrador del
HTML 3.2, que incluía muchas de las mejoras que los principales
navegadores (Netscape y Explorer) habían introducido en Internet, como
son las tablas, los applets, etc. Este borrador fue aprobado en enero de
1997 e inmediatamente el W3C se puso a trabajar en la elaboración del
siguiente estándar: el 4.0.
4
En julio de 1997 se presenta el borrador de este estándar. Por fin se
estandarizan los marcos (frames), las hojas de estilo y los scripts (entre otras
cosas). El 17 de diciembre de 1997 dicho borrador fue finalmente aprobado.
HTML 5 incluye novedades significativas en diversos ámbitos.




5




Estructura del cuerpo: Permite agrupar todas estas partes de
una web en nuevas etiquetas que representarán cada uno de las
partes típicas de una página.
Etiquetas para contenido específico: Hasta ahora se utilizaba
una única etiqueta para incorporar diversos tipos de contenido
enriquecido, como animaciones Flash o vídeo. Ahora se
utilizarán etiquetas específicas para cada tipo de contenido en
particular, como audio, vídeo, etc.
Bases de datos locales: el navegador permitirá el uso de una
base de datos local, con la que se podrá trabajar en una página
web por medio del cliente y a través de un API.
Web Workers: son procesos que requieren bastante tiempo de
procesamiento por parte del navegador, pero que se podrán
realizar en un segundo plano, para que el usuario no tenga que
esperar que se terminen para empezar a usar la página.
Aplicaciones web Offline: Existirá otro API para el trabajo con
aplicaciones web, que se podrán desarrollar de modo que
funcionen también en local y sin estar conectados a Internet.
Geolocalización: Las páginas web se podrán localizar
geográficamente por medio de un API que permita la
Geolocalización.
Nuevas APIs para interfaz de usuario: temas tan utilizados
como el "drag & drop" (arrastrar y soltar) en las interfaces de
usuario de los programas convencionales, serán incorporadas al
HTML 5 por medio de un API.
Fin de las etiquetas de presentación: todas las etiquetas que
tienen que ver con la presentación del documento, es decir, que
modifican estilos de la página, serán eliminadas. La
responsabilidad de definir el aspecto de una web correrá a cargo
únicamente de CSS.
Laboratorio de Aplicaciones, Introducción a la maquetación en HTML
2
Escuela de Enseñanza Secundaria Técnica N° 3
Prof.: Carlos Acuña
Mi primera página
El código
Nuestra primera página se guardará con el nombre index.html
<HTML>
<HEAD>
<TITLE>MI primer página</TITLE>
</HEAD>
<BODY>
<CENTER><H1>Mi Primera página</H1></CENTER>
<HR>
<P>Esta es mi primera página. Por el
Momento no sé qué tendrá, pero dentro de poco
Pondré aquí muchas cosas interesantes.
</P>
</BODY>
</HTML>
El cuerpo del documento
En esta área vamos a indicar el contenido de nuestra página de internet. Lo Primero
será indicar que estamos en el cuerpo del documento:
<BODY>... </BODY>
<HR>
La línea horizontal carece de etiqueta de cierre. Esto es normal en etiquetas que no
varían los atributos de un texto, sino que insertan un elemento.
Formato básico
Se pueden establecer varias categorías dentro de las etiquetas usadas para formatear
el texto. Nosotros las dividiremos entre aquellas que sirven para cambiar párrafos
enteros y las que son capaces de formatear ciertos caracteres dentro del párrafo.
Formato del párrafo
Estas son las etiquetas más importantes (excluyendo algunas que se verán más
adelante)
Laboratorio de Aplicaciones, Introducción a la maquetación en HTML
3
Escuela de Enseñanza Secundaria Técnica N° 3
Prof.: Carlos Acuña
Se muestra a continuación el listado completo de las etiquetas HTML, se citan como
obsoletas aquellas no son soportadas por el estándar W3C, es recomendable al
programar una página WEB trabajar con dicho estándar, el cual proporciona el
lenguaje de etiquetas XHTML estricto. Para referenciar lo antes dicho se indica en
la siguiente lista la correcta utilización de cada etiqueta mediante los siguientes
acrónimos:
• DTD: Document Type Definition.
• S: Strict, Para HTML estricto.
• T: Transitional, para HTML transicional.
• F: Frameset, para HTML con marcos.
Laboratorio de Aplicaciones, Introducción a la maquetación en HTML
4
Escuela de Enseñanza Secundaria Técnica N° 3
Prof.: Carlos Acuña
Laboratorio de Aplicaciones, Introducción a la maquetación en HTML
5
Escuela de Enseñanza Secundaria Técnica N° 3
Prof.: Carlos Acuña
Listas
Existen varios tipos de listas en HTML. Todas ellas se pueden mezclar unas dentro de
otras.
Listas desordenadas
La etiqueta <UL> nos permite presentar listas de elementos sin orden alguno. Por
ejemplo:
<UL>
<LI>Primer elemento
<LI>Segundo elemento
</UL> La etiqueta <UL> admite estos parámetros:
Laboratorio de Aplicaciones, Introducción a la maquetación en HTML
6
Escuela de Enseñanza Secundaria Técnica N° 3
Prof.: Carlos Acuña
Listas ordenadas por números
La etiqueta <OL> nos permite presentar listas de elementos ordenados de menor
a mayor. Normalmente cada elemento de la lista irá precedido por su número en el
orden. Por ejemplo:
<OL>
<LI>Primer elemento </LI>
<LI>Segundo elemento </LI>
</OL>
La etiqueta <OL> admite estos parámetros:
Laboratorio de Aplicaciones, Introducción a la maquetación en HTML
7