ndice

Introduccin..............................................................................3
Historia de HTML......................................................................4
Versiones de HTML..................................................................6
Qu son las pginas web y los sitios web?...........................7
Qu es CSS y para qu sirve?..............................................8
Ejemplos de CSS...................................................................10
Conclusin..............................................................................13
Bibliografa..............................................................................14

Introduccin
HTML, siglas de HyperText Markup Language (lenguaje de marcas de
hipertexto), es un lenguaje de programacin para la elaboracin de pginas web,
basado en el uso de etiquetas encerradas por corchetes angulares (<>) el cual se
utiliza para traducir la estructura y la informacin en forma de texto, con la
posibilidad de agregar objetos como imgenes, videos etc. Se ha convertido en el
lenguaje de marca ms importante a da de hoy, gracias al crecimiento de Internet,
la necesidad de ofrecer servicios remotamente y en definitiva, la necesidad de
poder ofrecer fcilmente informacin de una forma elegante y sin morir en el
intento. En la actualidad el HTML es complementado por otras tecnologas como
las Hojas de Estilo en Cascada (CSS), el JavaScript entre otras.
Es un estndar a cargo de la W3C, organizacin dedicada a la estandarizacin de
casi todas las tecnologas ligadas a la web, sobre todo en lo referente a su
escritura e interpretacin. El lenguaje HTML basa su filosofa de desarrollo en la
referenciacin. Para aadir un elemento externo a la pgina (imagen, vdeo, script,
entre otros.), este no se incrusta directamente en el cdigo de la pgina, sino que
se hace una referencia a la ubicacin de dicho elemento mediante texto. De este
modo, la pgina web contiene slo texto mientras que recae en el navegador web
(interpretador del cdigo) la tarea de unir todos los elementos y visualizar la
pgina final. Al ser un estndar, HTML busca ser un lenguaje que permita que
cualquier pgina web escrita en una determinada versin, pueda ser interpretada
de la misma forma (estndar) por cualquier navegador web actualizado.

Historia de HTML
El origen de HTML se remonta a 1980, cuando el fsico Tim Berners-Lee,
trabajador del CERN (Organizacin Europea para la Investigacin Nuclear)
propuso un nuevo sistema de "hipertexto" para compartir documentos.
Los sistemas de "hipertexto" haban sido desarrollados aos antes. En el mbito
de la informtica, el "hipertexto" permita que los usuarios accedieran a la
informacin relacionada con los documentos electrnicos que estaban
visualizando. De cierta manera, los primitivos sistemas de "hipertexto" podran
asimilarse a los enlaces de las pginas web actuales.
Tras finalizar el desarrollo de su sistema de "hipertexto", Tim Berners-Lee lo
present a una convocatoria organizada para desarrollar un sistema de
"hipertexto" para Internet. Despus de unir sus fuerzas con el ingeniero de
sistemas Robert Cailliau, presentaron la propuesta ganadora llamada
WorldWideWeb (W3).
El primer documento formal con la descripcin de HTML se public en 1991 bajo el
nombre HTML Tags (Etiquetas HTML) y todava hoy puede ser consultado online a
modo de reliquia informtica.
La primera propuesta oficial para convertir HTML en un estndar se realiz en
1993 por parte del organismo IETF (Internet Engineering Task Force). Aunque se
consiguieron avances significativos (en esta poca se definieron las etiquetas para
imgenes, tablas y formularios) ninguna de las dos propuestas de estndar,
llamadas HTML y HTML+ consiguieron convertirse en estndar oficial.
En 1995, el organismo IETF organiza un grupo de trabajo de HTML y consigue
publicar, el 22 de septiembre de ese mismo ao, el estndar HTML 2.0. A pesar de
su nombre, HTML 2.0 es el primer estndar oficial de HTML.
A partir de 1996, los estndares de HTML los publica otro organismo de
estandarizacin llamado W3C (World Wide Web Consortium). La versin HTML
3.2 se public el 14 de Enero de 1997 y es la primera recomendacin de HTML
publicada por el W3C. Esta revisin incorpora los ltimos avances de las pginas
web desarrolladas hasta 1996, como applets de Java y texto que fluye alrededor
de las imgenes.
HTML 4.0 se public el 24 de Abril de 1998 (siendo una versin corregida de la
publicacin original del 18 de Diciembre de 1997) y supone un gran salto desde
las versiones anteriores. Entre sus novedades ms destacadas se encuentran las
hojas de estilos CSS, la posibilidad de incluir pequeos programas o scripts en las
3

pginas web, mejora de la accesibilidad de las pginas diseadas, tablas

complejas y mejoras en los formularios.
La ltima especificacin oficial de HTML se public el 24 de diciembre de 1999 y
se denomina HTML 4.01. Se trata de una revisin y actualizacin de la versin
HTML 4.0, por lo que no incluye novedades significativas.
Desde la publicacin de HTML 4.01, la actividad de estandarizacin de HTML se
detuvo y el W3C se centr en el desarrollo del estndar XHTML. Por este motivo,
en el ao 2004, las empresas Apple, Mozilla y Opera mostraron su preocupacin
por la falta de inters del W3C en HTML y decidieron organizarse en una nueva
asociacin llamada WHATWG (Web Hypertext Application Technology Working
Group).
La actividad actual del WHATWG se centra en el futuro estndar HTML 5, cuyo
primer borrador oficial se public el 22 de enero de 2008. Debido a la fuerza de las
empresas que forman el grupo WHATWG y a la publicacin de los borradores de
HTML 5.0, en marzo de 2007 el W3C decidi retomar la actividad estandarizadora
de HTML.
De forma paralela a su actividad con HTML, W3C ha continuado con la
estandarizacin de XHTML, una versin avanzada de HTML y basada en XML. La
primera versin de XHTML se denomina XHTML 1.0 y se public el 26 de Enero
de 2000 (y posteriormente se revis el 1 de Agosto de 2002).
XHTML 1.0 es una adaptacin de HTML 4.01 al lenguaje XML, por lo que
mantiene casi todas sus etiquetas y caractersticas, pero aade algunas
restricciones y elementos propios de XML. La versin XHTML 1.1 ya ha sido
publicada en forma de borrador y pretende modularizar XHTML. Tambin ha sido
publicado el borrador de XHTML 2.0, que supondr un cambio muy importante
respecto de las anteriores versiones de XHTML.

Versiones de HTML
El primero en salir fue el HTML 1, sin embargo no fue considerado un estndar,
por lo que muchas veces se considera al HTML 2 como la primera versin del
HTML.
HTML 2: Presentado en el ao de 1995, el HTML 2 es considerado la primera
versin del HTML, el cual no soportaba tablas y donde la declaracin explcita de
los elementos body, html y head es opcional.
HTML 3.2: Esta versin se lanz en el ao de 1997 gracias al organismo de
estandarizacin llamado W3C (World Wide Web Consortium). El cual incorpor los
ltimos avances de las pginas web como applets de Java y texto que fluye
alrededor de las imgenes.
HTML 4.0: Lanzada en 1998. Entre sus novedades ms destacadas se encuentran
las hojas de estilos CSS, la posibilidad de incluir pequeos programas o scripts en
las pginas web, mejora de la accesibilidad de las pginas diseadas, tablas
complejas y mejoras en los formularios.
HTML 4.01: sali a la luz en 1999 como una revisin y actualizacin de la versin
HTML 4.0, por lo que no incluye novedades significativas.
HTML 5: quinta revisin importante del lenguaje bsico de la World Wide Web, el
cual especifica dos variantes de sintaxis para HTML: el clsico HTML (text/html), y
la variante conocida como HTML5 y una variante XHTML conocida como sintaxis
XHTML5. Este nuevo estndar aun no es tan utilizado pero su potencial es mucho
mayor a las versiones anteriores, el cual incluye interesantes mejoras como
nuevos elementos y etiquetas.

Qu son las pginas web y los sitios web?

Los sitios web, tambin llamados sites en ingls, son lugares dentro de la Web con
una direccin nica e irrepetible, a los que podemos acceder en busca de
informacin.
Estn formados por una o varias pginas Web entre s por hipervnculos, y
cuentan con una pgina Web principal llamada home page o Portal, que, dicho en
otras palabras, es la puerta de entrada al sitio, en donde se exponen los
contenidos principales del mismo.
Los sitios de internet son de las ms diversas clases, as podemos encontrar sitios
de comercio, deportes, finanzas, literatura, espectculos, educacin, o bien para
realizar compras, entre otros servicios.
Como medio, los sitios web son similares a las pelculas, a la televisin o a las
revistas, en que tambin crean y manipulan imgenes digitales y texto, pero un
sitio web es tambin un medio de comunicacin. La diferencia principal entre un
sitio web y los medios tradicionales es que un sitio web est en una red de
ordenadores (Internet) y est codificado de manera que permite que los usuarios
interacten con l. Una vez en un sitio web, puedes realizar compras, bsquedas,
enviar mensajes, y otras actividades interactivas.
Diferencia entre sitio web y pgina web
A veces se utiliza errneamente el trmino pgina web para referirse a sitio web.
Una pgina web es parte de un sitio web y es un nico archivo con un nombre de
archivo asignado, mientras que un sitio web es un conjunto de archivos llamados
pginas web.
Si lo comparramos con un libro, un sitio web sera el libro entero y una pgina
web de ese sitio web sera un captulo de ese libro. El ttulo del libro sera el
nombre del dominio del sitio web. Un captulo, al igual que una pgina web, tiene
un nombre que lo define. Decimos que sera un captulo y no una pgina del libro
porque a menudo es necesario desplazarse hacia bajo en la pantalla para ver todo
el contenido de una pgina web, al igual que en un libro te desplazas a travs de
varias pginas para ver todo el contenido de un captulo. El ndice de los captulos
del libro sera el equivalente al mapa del sitio web (sitemap en ingls).

Qu es CSS y para qu sirve?

CSS son las siglas en ingls de Cascading Style Sheets, que en castellano
significa hojas de estilo en cascada.
CSS es un lenguaje que funciona junto con HTML, el cual nos permite controlar el
diseo y la esttica de nuestro sitio web editando unas pocas lneas de cdigo. De
esta manera podremos por ejemplo cambiar el tamao y color del texto, establecer
mrgenes e interlineados, trabajar con imgenes, colocar con precisin elementos
dentro de una pgina web y mucho ms.
Si ests interesado en aprender CSS es importante que tengas por lo menos unos
conocimientos bsicos de HTML.
Necesito algn programa?
Al igual que con otros lenguajes de programacin web, lo nico que necesitas para
trabajar con CSS es un programa editor de texto simple, como por ejemplo el Bloc
de notas de Windows o su equivalente en otro sistema operativo (Gedit - Linux o
TextEdit - Mac).
La informacin de estilo CSS (llamada tambin hoja de estilos o cdigo css) puede
guardarse en el mismo documento al que se quiere aplicar o en un archivo aparte
con la extensin .css (ejemplo.css).
Cmo funciona CSS?
La sintaxis de CSS es bastante sencilla, ya que utiliza algunas palabras del ingls
para nombrar a sus electores, atributos y valores.
Selectores: Con selectores nos referimos a los elemento a los que se le aplica
CSS, por ejemplo un prrafo (etiqueta HTML <p>).
Atributos: Los atributos son las propiedades de dicho elemento. Por ejemplo el
color, el tamao, el grosor, etc. Si quisiramos cambiar el color de un prrafo,
seleccionaramos el atributo color y elegiramos el color que quisiramos (rojo,
azul, verde, etc.).
Valores: Con valores nos refierimos a las caractersticas del atributo. Siguiendo
con el ejemplo del prrafo, red (rojo) sera el valor del atributo color.
p {color: red;} = Selector {atributo: valor;}
o tambin <p style="color: red;">prrafo</p>
Selector = p (Selecciona las etiquetas HTML <p> = prrafo)
7

Atributo = color
Valor = red
Fjate que el atributo y el valor estn separados con dos puntos (:) y llevan un
punto y coma al final (;). A su vez ambos estn rodeados por llaves ({}).
Formas de usar CSS
El CSS puede aplicarse de tres formas diferentes: en lnea, en un hoja de estilos
interna o en una hoja de estilos externa.
1. CSS en lnea (inline):
Se trata de insertar el CSS directamente dentro de una etiqueta HTML, o sea en la
misma lnea.
Esta forma no es la ms adecuada, porque si tuviramos que aplicar CSS en lnea
a cada elemento de la pgina el cdigo sera demasiado largo. Esta forma de
aplicar estilos es recomendable usarla solamente para dar formato a un elemento
especfico, por ejemplo si quieres cambiar el estilo de un nico prrafo en todo el
sitio web.
2. Hoja de estilos interna:
En el caso de una hoja de estilos internas, agregamos el CSS en el mismo archivo
al que queremos aplicarlo, pero entre las etiquetas <style type="text/css"> </style>
y a su vez dentro de las etiquetas <head></head>.
La letra "a" representa a los enlaces (etiqueta HTML <a>) y quiere decir que el
CSS se aplicar a esa etiqueta HTML. Este ejemplo agregara a los enlaces un
color azul, una fuente tipo arial y un subrayado. Si este cdigo CSS lo
escribiramos en la pgina de contactos (contactos.html), afectara solamente a la
pgina de contactos.
3. Hojas de estilo externas:
Cuando utilizamos una hoja de estilos externa, debemos guardar el cdigo CSS
en un archivo aparte con la extensin .css (estilos.css). Esta hoja de estilos
podemos aplicarla a todas las pginas de nuestro sitio web y as controlar el
diseo desde un nico archivo CSS. Para que esto funcione, debemos enlazar las
pginas a las que queremos aplicar el CSS (index.html, contacto.html, etc.) al
archivo CSS que contiene los estilos (estilos.css). El enlace deberamos agregarlo
entre las etiquetas <head></head>.

Ejemplos de CSS
Las tres formas ms conocidas de dar estilo a un documento son las siguientes:
-Utilizando una hoja de estilo externa que estar vinculada a un documento a
travs del elemento <link>, el cual debe ir situado en la seccin <head>.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN">
<html>
<head>
<title>Ttulo</title>
<link rel="stylesheet" type="text/css"
href="http://www.w3.org/css/officeFloats.css" />
</head>
<body>
.
.
.
.
</body>
</html>
-Utilizando el elemento <style>, en el interior del documento al que se le quiere dar
estilo, y que generalmente se situara en la seccin <head>. De esta forma los
estilos sern reconocidos antes de que la pgina se cargue por completo.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN">
<html>
<head>
<title>hoja de estilo interna</title>
<style type="text/css">

body {
padding-left: 11em;
font-family: Georgia, "Times New Roman", serif;
color: red;
background-color: #d8da3d;
}

h1 {
font-family: Helvetica, Geneva, Arial, sans-serif;
}

</style>
</head>
<body>
<h1>Aqu se aplicar el estilo de letra para el Ttulo</h1>
</body>
</html>
-Utilizando estilos directamente sobre aquellos elementos que lo permiten a travs
del atributo <style> dentro de <body>. Pero este tipo de estilo pierde las ventajas
que ofrecen las hojas de estilo al mezclarse el contenido con la presentacin.
Algunas normas bsicas a la hora de crear una CSS son las siguientes:

En el siguiente ejemplo, h1{color: red;}, el selector, <h1>, le dice al navegador la

parte del documento que se ver afectada por esa regla. Los selectores pueden
aparecer individualmente o agrupados, separndolos con comas:
h1, h2, h3 {
color: red;
}
o lo que es lo mismo
10

h1 {color: red;}
h2 {color: red;}
h3 {color: red;}
La propiedad, que en este caso sera color, especifica qu aspecto se va a
cambiar. En este ejemplo la propiedad cambiada ser el color. Las propiedades
que se desean modificar en una CSS para un mismo selector pueden agruparse,
pero ser necesario separar cada una de ellas con un punto y coma.
p {text-align:center;color:red}
Normalmente se describe una propiedad por lnea, de la siguiente manera:
h1 {
padding-left: 11em;
font-family: Georgia, "Times New Roman",Times, serif;
color: red;
background-color: #d8da3d;
}
El valor, en este caso red, establece el valor de la propiedad. Es importante
recordar que si el valor est formado por ms de una palabra, hay que ponerlo
entre comillas.
p {font-family: "sans serif";}

11

Conclusin
El cdigo HTML revolucion el internet, permitiendo compartir informacin de
manera eficaz. El auge del Flash ha pasado, y hemos vuelto a las bases: el cdigo
HTML. En la actualidad todos navegan en la WEB por lo que saber cmo
funcionan los sitios web e incluso poder editar o hacer uno utilizando cdigos es o
se convertir una herramienta muy til para nosotros pues nos permitir compartir
informacin con todo el mundo aunque sea de una forma muy bsica porque
aunque los cdigos HTML no comprendan toda la pgina son la esencia de la
misma.

12

Bibliografa
-Romero Gmez, Antonio. Computacin Creativa I. Mxico D.F. Editorial xodo,

2014.
-LIBROSWE: Introduccin a XTHML [en lnea].2015. [Consulta: 1 abril 2015].
Disponible en: http://librosweb.es/libro/xhtml/capitulo_1.html
- Ernesto Castrejn. WebAdictos: Breve Historia del HTML [en lnea]. 2012.
[Consulta: 1 abril 2015]. Disponible en: http://webadictos.com/2012/12/30/brevehistoria-del-html/
-MASADELANTE: Cul es la diferencia entre un sitio y una pgina web? Definicin de Sitio web y Pgina web [en lnea]. [Consulta: 1 abril 2015].
Disponible en: http://www.masadelante.com/faqs/sitio-web
-Maquetar Web: Qu es CSS y para que sirve? [en lnea]. [Consulta: 1 abril
2015]. Disponible en: http://www.maquetarweb.com/2013/01/que-es-css-y-paraque-sirve.html
- W3C: Gua Breve de CSS [en lnea]. [Consulta: 1 abril 2015]. Disponible en:
http://www.w3c.es/Divulgacion/GuiasBreves/ejemplos/CSS/EjemploCSS1

13