Sunteți pe pagina 1din 23

Trabajo de Integracin de Sistemas. Fernando Pealoza B. lfpenaloza@cuenca.gob.ec Hermel Pasaca P. hpasacapasaca@yahoo.es Marco Moscoso. mar65vmo@yahoo.es Oscar Perguachi. oscaraul01@yahoo.

com Luis Gmez. lgomez@etapa.net.ec Paola Len. paleons@hotmail.com Resumen. El presente trabajo a permitido conocer sobre el lenguaje HTML, con el que se definen las pginas web, que bsicamente se trata de un conjunto de etiquetas que sirven para definir el texto y otros elementos que compondrn una pgina web, empleando y aprendiendo cada uno de los siguientes conceptos permitiendo obtener alternativas para un mejor manejo e estudio de esta herramienta de trabajo.

Qu es Html.?

HTML o Hypertext Markup Language, en ingls o Lenguaje de Etiquetado de Documentos hipertexto es un lenguaje de marcacin de elementos para la creacin de documentos hipertexto, muy fcil de aprender que permite que cualquier persona, aunque no haya programado en la vida, pueda enfrentarse a la tarea de crear una pgina web, consiguiendo resultados e incorporando otros lenguajes para definir el formato con el que se tienen que presentar las webs, como CSS tambin conocido como hojas de estilo en cascada. As que HTML no es ms que una serie de etiquetas que se utilizan para definir el contenido del documento y algn estilo bsico. De modo que cuando programemos en HTML lo haremos con un editor de texto, lo ms sencillo posible y guardaremos nuestros trabajos con extensin .HTML, por ejemplo mipagina.html El lenguaje HTML estructura la informacin, que luego es visualizada utilizando un navegador, como en Internet Explorer que viene con el sistema operativo Windows. Aspectos Relevantes. Entre los aspectos a resaltar tenemos los siguientes: Pros.

Atractivos: Siempre los contenidos HTML son ms atractivos que los contenidos de un correo en texto plano. Usted puede decidir qu color tendrn los enlaces, el texto o el fondo. Tambin puede incluir imgenes que generarn mayor impacto visual en sus lectores. Mejor Respuesta: Se ha probado que el formato HTML supera en ndices de apertura, en muchos casos, al formato de texto plano. La

gente est simplemente ms interesada en ver un HTML que en leer un simple correo en texto. Cuando reciben toneladas de correos al da en su bandeja de entrada, adems de un titular cautivante, la nica cosa que fcilmente atraer la atencin del lector es una buena imagen.

Diferentes Formatos: Con correos de texto plano, slo se puede escribir de arriba hacia abajo. Mediante el HTML usted puede disear sus tareas en 4 o 5 columnas, e incluir grficos o imgenes en cualquier parte. Formularios: Los diseadores no debern dirigirse a una pgina Web para completar un formulario o una encuesta. Podrn hacerlo directamente en el email que usted les ha enviado en cdigo HTML. Seguimiento: Los correos HTML permiten conocer el comportamiento de sus lectores mientras que los correos de texto plano no tienen esa capacidad. Contras.

Dificultad en la Entrega: Varios usuarios poseen filtros anti-spam y sus envos pueden caer directamente en la bandeja de SPAM, si no cumplen con las condiciones configuradas en los filtros. Visualizacin: Los contenidos HTML, tienen ms posibilidades de poseer virus o troyanos. Por este motivo, muchos usuarios tienen deshabilitada la opcin de mostrar imgenes. Esto impedir ver correctamente sus mensajes con el diseo correspondiente. Tiempo de Descarga: los usuarios pueden contar todava con una conexin dial-up. Los correos HTML son ms pesados que los correos en texto plano y por lo tanto el tiempo de descarga ser mayor. 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 documentos HTML son archivos de texto plano (tambin conocidos como ASCII) que pueden ser creados mediante cualquier editor de texto, aunque tambin existen programas especficos para editar HTML (los editores ms conocidos son Microsoft FrontPage, Netscape Composer, Macromedia Dreamweaver y Adobe PageMill), concebidos especficamente para editar pginas web en HTML. La presentacin de la pgina es muy dependiente del navegador o browser utilizado ya que el mismo documento no produce el mismo resultado en la pantalla si se visualiza con uno u otro, o sea, HTML se limita a describir la estructura y el contenido de un documento, y no el formato de la pgina y su apariencia.

Creacin de documentos HTML:


Un procesador de textos o un editor de documentos HTML Un navegador del WWW o lo que se denomina "programa cliente" que permite el acceso a pginas WWW de Internet. ESTRUCTURA DE HTML

Todos los documentos Html tienen la estructura que se muesta a continuacin: <HTML> <HEAD> <TITLE>Ttulo de la pgina</TITLE> </HEAD> <BODY> Contenido de la pgina </BODY> </HTML> Entre las etiquetas <html> y <head> se suelen colocar otras opcionales, como por ejemplo: <meta name="description" content="Informacin sobre el Centro,las enseanzas que se pueden cursar, los departamentos didcticos"> En este caso las etiquetas le indican a los buscadores el contenido de nuestras pginas (description) y algunas palabras clave (keywords) para su localizacin. La cabecera es la seccin comprendida entre <head> y </head>. El ttulo de la pgina debe describir su contenido por ejemplo: <TITLE> UNITA </TITLE> Al mismo tiempo puede incluirse cdigo en JavaScript, que se reconoce porque va comprendido entre las etiquetas <script language="JavaScript"> <! CODIGO // --> </SCRIPT> El cuerpo (body) es aqu donde debemos colocar el contenido de nuestra pgina: texto, fotos, etc. El cuerpo est delimitado por las etiquetas <body> y </body> BGCOLOR parmetro usado para especificar el color de fondo de la pgina.. Sintaxis: <BODY BGCOLOR=#0000FF> o <BODY BGCOLOR=blue>

BACKGROUND, parmetro usado para especifica la ruta y nombre de archivo (URL) de la imagen que ser usado como fondo del documento. Sintaxis: <BODY BACKGROUND="ruta/archivo.gif">

LA SINTAXIS DE LOS ELEMENTOS HTML Para fomentar una slida compresin del HTML, miraremos la estructura del lenguaje propiamente dicho. El funcionamiento de la sintaxis del HTML es anlogo a la sintaxis de la gramtica espaola, pero mucho ms sencillo. El HTML es en realidad un lenguaje lgico. Ciertamente, hay excepciones a las reglas, y hay modificaciones o interpretaciones de algunas de stas. Una vez que se asimila la estructura bsica, se puede notar que el HTML es simplemente un conjunto de piezas lgicas que hacen de l un lenguaje fcil de usar. HTML es un lenguaje que evoluciona. Mientras que la evolucin es un estado natural del HTML, estos cambios normalmente no afectan a las reglas bsicas. Mientras que varios elementos de este lenguaje se hacen obsoletos y otros nuevos son aadidos, la sintaxis, o la estructura correcta, raramente sufren cambios. El HTML es un lenguaje de marcas que basa su sintaxis en un elemento de base al que llamamos etiqueta. A travs de las etiquetas vamos definiendo los elementos del documento, como enlaces, prrafos, imgenes, etc. As pues, un documento HTML estar constituido por texto y un conjunto de etiquetas para definir la forma con la que se tendr que presentar el texto y otros elementos en la pgina. La etiqueta presenta frecuentemente dos partes: Una apertura de forma general <etiqueta> Un cierre de tipo </etiqueta> Todo lo incluido en el interior de esa etiqueta sufrir las modificaciones que caracterizan a esta etiqueta. As por ejemplo: Las etiquetas <b> y </b> definen un texto en negrita. Si en nuestro documento HTML escribimos una frase con el siguiente cdigo: <b>Esto esta en negrita</b> El resultado Ser: Esto esta en negrita Las etiquetas <p> y </p> definen un prrafo. Si en nuestro documento HTML escribiramos: <p>Hola, estamos en el prrafo 1</p>

<p>Ahora hemos cambiado de prrafo</p> El resultado sera: Hola, estamos en el prrafo 1 Ahora hemos cambiado de prrafo ELEMENTOS DE BLOQUE Y EN LNEA Adems de etiquetas y atributos, HTML define el trmino elemento para referirse a las partes que componen los documentos HTML. Aunque en ocasiones se habla de forma indistinta de "elementos" y "etiquetas", en realidad un elemento HTML es mucho ms que una etiqueta, ya que est formado por: Una etiqueta de apertura. Cero o ms atributos. Texto encerrado por la etiqueta. Una etiqueta de cierre. El texto encerrado por la etiqueta es opcional, ya que algunas etiquetas de HTML no pueden encerrar ningn texto. El siguiente esquema muestra un elemento HTML, formado por una etiqueta <p>, atributos y contenidos de texto:

Figura 2.7. Esquema de las partes que componen un elemento HTML La estructura mostrada en el esquema anterior es un elemento HTML ya que comienza con una etiqueta de apertura (<p>), contiene cero o ms atributos (class="normal"), dispone de un contenido de texto (Esto es un prrafo) y finaliza con una etiqueta de cierre (</p>). Por tanto, si una pgina web tiene dos prrafos de texto, la pgina contiene dos elementos y cuatro etiquetas (dos etiquetas <p> de apertura y dos etiquetas </p> de cierre). De todas formas, aunque estrictamente no son lo mismo, es habitual intercambiar las palabras "elemento" y "etiqueta". El estndar HTML clasifica a todos sus elementos en dos grandes grupos: elementos en lnea y elementos de bloque. Los elementos de bloque ("block elements" en ingls) siempre empiezan en una nueva lnea y ocupan todo el espacio disponible hasta el final de la lnea.

Por su parte, los elementos en lnea ("inline elements" en ingls) no empiezan necesariamente en nueva lnea y slo ocupan el espacio necesario para mostrar sus contenidos. En HTML los elementos pueden ser clasificados de varias maneras, por ejemplo: segn el doctype, segn su estructura, segn su funcin, entre otras. Por ahora slo vamos a mencionar que segn su estructura pueden sub-dividirse en otros 3 grupos: bsicos, de cabecera y de cuerpo. Los bsicos son aquellos que conforman primariamente el HTML. Sin stos no existe el HTML como tal, por ejemplo para un documento normal son: html, head, body. Los de cabecera son aquellos que estn dentro de la etiqueta <head> y contienen informacin relevante para el funcionamiento del documento, por ejemplo: title, base, meta, link, style, script, object, entre otros. Los de cuerpo son aquellos que estn dentro de la etiqueta <body> y estructuran el contenido de un documento. Estos pueden dividirse principalmente enelementos en bloque (block elements) y en elementos en lnea (inline elements). (Existen elementos que tienen dobles clasificaciones, as tambin existen elementos que son subordinados). La diferencia entre ambos est dada por el Modelo de contenido, por elFormato y la Direccionalidad, en esta resea nos vamos a centrar en las dos primeras: Modelo de contenido: Los elementos en bloque pueden contener elementos en lnea y a otros elementos en bloque. A su vez los elementos en lnea pueden contener otros datos y elementos en lnea, pero no elementos en bloque. En esta distincin est relacionada la idea de que los elementos en bloque crean estructuras ms grandes que los elementos en lnea. Formato: Los elementos en bloque tienen por defecto un formato diferente que el de los elementos en lnea. Generalmente, los elementos en bloque comienzan en una nueva lnea, y los elementos en lnea no. Es decir, cada vez que existe un elemento en bloque, existe un salto de lnea asociado a l. Direccionalidad: Por razones tcnicas relacionadas con el algoritmo de texto bidireccional de UNICODE los elementos en bloque y en lnea difieren en el modo de heredar la informacin de direccionalidad. Para especificar la direccin
base de un elemento en bloque, se establece el atributo dir del elemento. El valor por defecto del atributo dir es "ltr" (left-to-right, texto de izquierda a derecha). Los elementos en lnea, por su parte, no heredan el atributo dir. Eso significa que un elemento en lnea sin un atributo dir no abre un nivel adicional de inclusin con respecto al algoritmo bidireccional.

Los elementos en bloque Un elemento en bloque se puede definir a travs de sus principales caractersticas:

Forma un bloque y se posiciona a s mismo verticalmente con un nuevo salto de lnea sobre y bajo l. Toma toda la anchura disponible basndose en la anchura de su elemento padre (contenedor). Su altura cambia en relacin a su contenido. Puede contener otros elementos inline y/o block. Se le puede asignar una anchura (width) y una altura (height) fija (utilizando css)

Elementos que son por defecto tipo bloque: Elementos Block p dl h1-h6 menu div dir ul pre ol hr

blockquote address center noframes isindex fieldset table form

Los elementos en lnea (inline) Un elemento lnea tiene las siguientes caractersticas:

Se posiciona a s mismo horizontalmente en lnea con el resto del contenido de su elemento padre (contenedor). Toma la anchura y altura mnima en relacin a su contenido. SOLO puede contener otros elementos en lnea. NO se puede imponer una anchura y una altura fija

Elemento que son por defecto tipo en lnea: Elementos Inline a br span bdo map iframe big font small object tt u

applet img i s b strike

basefont em sub cite

strong dfn sup samp

code q kbd var

abbr

acronym input select

textarea

label button Nota: La tabla con detalle ver en el ANEXO 1 Referencia de caracteres Es una pequea pieza de cdigo usada para representar ciertos caracteres en documentos HTML. Principalmente usada para insertar smbolos que no pertenecen al juego de caracteres (o en muchos casos, smbolos difciles de ingresar), las referencias de caracteres puede insertarse de tres formas diferentes:

Por su nombre de entidad: El formato apra insertar un smbolo por su nombre de entidad est compuesto por un smbolo "&" seguido de su nombre de entidad y un punto y coma (";"). Por ejemplo, el smbolo de la libra esterlina ("") puede ser insertado como "&pound;". Por su valor decimal: El formato es compuesto por un smbolo "&" seguido de un signo numeral ("#"), el nmero asociado y un punto y coma (";"). Por ejemplo, el smbolo de la libra esterlina ("") puede ser insertado como "&#163;". Por su valor hexadecimal: Este mtodo funciona exactamente como el del valor decimal con la diferencia que el nmero se escribe en formato hexadecimal y una "x" (en minscula) se agrega a continuacin del signo numeral ("#"). Las letras en el nmero hexadecimal deben ir en maysculas. Por ejemplo, el smbolo de la libra esterlina ("") puede ser insertado como "&#xA3;".

Queda claro que la mejor forma de representar referencias de caracteres es a travs de la notacin decimal. Tablas de referencia de caracteres Como anexo hay una tabla de referencias de caracteres que muestran las tres notaciones y su representacin, para cada smbolo disponible para documentos. VERSIONES DE HTML El HTML fue desarrollado originalmente por Tim Bernes-Lee pero debido al rpido crecimiento de la web, surgi la necesidad de crear un estndar para los programadores como los navegadores pudieran basarse en unas mismas normas para escribir HTML. Cada versin de HTML establece unas normas respecto a cules son las etiquetas vlidas y cmo se deben escribir. Algunas personas creen que el HTML ya no tiene futuro porque ya existe el XHTML es una forma ms avanzada del HTML, pero el navegador ms popular

(Internet Explorer) por el momento no lo soporta y es por esto que otros piensan que el futuro est en el HTML 5. En 1995 es el primer estndar oficial de HTML, es decir, el HTML 1.0 no existi como estndar. HTML 2.0 no soportaba tablas. Simplifica al mximo la estructura del documento agiliza su edicin, la declaracin explcita del body, html y head es opcional.

HTML 2.0

HTML 3.2

La versin HTML 3.2 se public en 1997 primera recomendacin de HTML publicada por el W3C (Consorcio internacional). Avances, como applets de Java y texto alrededor imgenes.

HTML 4.01

Desde HTML 4.01, la actividad de estandarizacin de HTML se detuvo y el W3C se centr en el desarrollo del estndar XHTML. En el ao 2004, Apple, Mozilla y Opera decidieron continuar con HTML. Actualmente W3C est trabajando para el lanzamiento del estndar HTML 5.0.

Actualmente ya est disponible la nueva versin de HTML, denominada HTML 5, y se espera que se imponga como estndar en los prximos aos. Cuando escribimos un documento HTML debemos indicar en una lnea inicial qu versin y variante es la que estamos usando.

HTML 4.01 Strict

No se aceptan etiquetas obsoletas, es decir, etiquetas de versiones antiguas.

HTML 4.01 Transitional

Usa etiquetas que podran dejar de funcionar en las proximas versiones de los navegadores. Ms usado, combina el uso de etiquetas antiguas y etiquetas modernas, mejor visualizacin de los navegadores.

HTML 4.01 Frameset

Este tipo de documentos tiene soporte para frames. Los frames son unos marcos a modo de pequeas pero que hoy en da se usan cada vez menos.

NOTA: Detalle de la tabla en el ANEXO 2 HTML5 HTML5 es una coleccin de estndares para el diseo y desarrollo de pginas web. Esta coleccin representa la manera en que se presenta la informacin en el explorador de internet y la manera de interactuar con ella. HTML5 est siendo desarrollado por Ian Hickson de Google Inc. y David Hyatt de Apple Inc. junto con todas las personas que participan en Web Hypertext Application Technology Working Group. Describir estructura y contenido. Complementar el texto con Objetos. Se escribe en forma de "etiquetas". Rodeada por corchetes angulares < >.

HTML5 nos permite una mayor interaccin entre nuestras pginas web y contenido media (video, audio, entre otros) as como una mayor facilidad a la hora de codificar nuestro diseo bsico. Esta nueva versin se bas en el diseo ms comn de las pginas web alrededor del mundo para llegar a un estndar de etiquetas que realicen las mismas tareas de manera ms rpida y eficiente, he aqu algunos ejemplos: Un nuevo diseo para pginas web, reflejado en las etiquetas<header>, <footer>, <nav>, <section>,<article> las cuales estn destinadas a remplazar la necesidad de tener una <div> para cada parte de la pgina, y en cambio, tener etiquetas especficas para ello. La nueva etiqueta <video> para insertar un reproductor de video, mejorando el reproductor antiguo utilizado por la etiqueta <embed> y evitndonos la pena de insertar el cdigo de <object>, as como eliminar la necesidad del Flash Player para reproducir videos (lo que nos lleva a un ahorro en la cantidad de memoria utilizada). Una nueva tag <audio> para insertar audio en nuestro sitio web, remplazando la vieja etiqueta <embed> con las mismas cualidades de la etiqueta anterior.

Una etiqueta <canvas> para manejo de grficos en internet, sea para dibujar vectores o hacer animaciones.

DIFERENCIAS ENTRE HTML Y HTML5

HTML HTML, siglas de HyperText Markup Language (lenguaje de marcado de hipertexto), es el lenguaje de marcado predominante para la elaboracin de pginas web. HTML se escribe en forma de etiquetas, rodeadas por corchetes angulares (<,>). HTML tambin puede describir, hasta un cierto punto, la apariencia de un documento. Cada atributo y contenido tiene ciertas restricciones para que se considere vlido al documento HTML. Todas las variantes de HTML abren las instrucciones con <> y los cierran con </>. por ejemplo, <p>text</p>

HTML5 HTML5 (HyperText Markup Language, versin 5) es la quinta revisin importante del lenguaje bsico de la World Wide Web, HTML. Al no ser reconocido en viejas versiones de navegadores por sus nuevas etiquetas, se le recomienda al usuario comn actualizar a la versin ms nueva, para poder disfrutar de todo el potencial que trae HTML5. HTML5 establece una serie de nuevos elementos y atributos que reflejan el uso tpico de los sitios web modernos. El HTML5 introduce nuevas formas de escribir cdigo, as que la sintaxis entre ellos puede variar ligeramente.

DIFERENCIA DE ESTRUCTURA

1 HTML5 contina en progreso Si bien est claro el hecho de tener una web maquetada en HTML4 nos permite contar con un estndar de soluciones ya que HTML4 tiene a diferencia de HTML5 que est an en proceso experimental y de desarrollo, es muy probable que muchas cosas sigan cambiando con el tiempo, y generando algunas dificultades, situacin a la que ya no est sujeto ningn producto web hecho en HTML4 2. Sintaxis simplificada La declaracin de tipo de documento de forma ms sencilla es slo una de las muchas novedades de HTML5. Ahora solo se tiene que escribir solamente: <DOCTYPE HTML!>. La sintaxis de HTML5 es compatible conHTML4 y XHTML1, pero no con SGML. 3. Elemento <canvas> poniendo en su lugar a Flash Flash ha sido un dolor de cabeza para unos y una maravilla para otros muchos usuarios de la Web, por lo que hay una importante cantidad de desarrolladores nada contentos con la forma en la que HTML5 trata a Flash; pero es cierto que para todos los dems usuarios que estamos cansados de los vdeos en flash que tardan aos en cargarse y funcionar, el nuevo

elemento <canvas> y su utilidad para la representacin de grficos es un sueo hecho realidad. Aunque es cierto que hasta hoy el elemento <canvas> no ofrece todas las ventajas de Flash hay mucho que hace suponer que se acerca el da en que esta herramienta quede obsoleta ante el potencial de HTML5 y su magnfica integracin. 4. Nuevos elementos <header> y <footer> HTML5 est desarrollado con la intencin de reflejar mejor la nueva anatoma de los sitios web. Es por eso que hay algunos elementos nuevos, como <header> y <footer>, que estn diseados especficamente para marcar estas partes de la web. Con este desarrollo en el lenguaje ya no es necesario identificar a estos dos elementos con la etiqueta <div>. 5. Nuevos elementos <section> y <article> Al igual que los elementos <header> y <footer>, el <section> y <article> en HTML5 permitir a los desarrolladores marcar estas reas de la pgina como tal. Adems de hacer el cdigo ms estructurado, este tambin tendr un efecto positivo en los esfuerzos de SEO ya que para los motores de bsqueda ser ms fcil el ranking de la pgina. 6. Nuevos elementos <menu> y <figure> El elemento nuevo <menu> puede ser utilizado no solo para los mens convencionales, sino tambin para las barras de herramientas y mens contextuales, aunque en realidad estos no son los elementos ms utilizados en una pgina. Del mismo modo, el elemento <figure> es una forma adicional til para organizar el texto y las imgenes en una pgina de una manera profesional. Es cierto que se pueden definir los mens y las cifras en una hoja de estilo pero es bueno que se pueda utilizar en la construccin de elementos de HTML5. 7. Nuevos elementos <audio> y <video> Son probablemente dos de las novedades ms tiles para HTML5. Como su nombre indica, se utilizan para insertar archivos de audio y vdeo. Tambin hay algunos nuevos elementos multimedia y atributos, tales como <track>, que ofrece pistas de texto para el elemento de vdeo. Con estas incorporaciones HTML5 est consiguiendo definitivamente que la Web 2.0 sea ms amigable. El problema es que al tiempo que HTML5 se convierte en una tecnologa ampliamente aceptada, la Web 2.0 podra ser noticia vieja.

8. Un nuevo nivel de las formas <form> y <forminput> vivieron una gran cantidad de revisiones y ahora tienen muchos atributos nuevos (y los modificados, tambin). 9. No ms <b> y <font> Esto es un cambio ms que yo no entiendo todava del todo. No creo que la eliminacin de la <b> y elementos <font> vaya a ayudar mucho. Pero las directrices oficiales dicen que estos elementos se manejan mejor en CSS. 10. Han desaparecido <frame>, <center> y <big> Estas 10 diferencias entre HTML5 y HTML4 son slo una pequea fraccin de lo que es nuevo. Adems de estos grandes cambios, tambin podramos nombrar unos pocos menores, como el nuevo atributo del elemento invertido <ol> que permite a una lista que se ordenan en orden descendente, o modificar el uso del elemento <u>. Los nuevos cambios se suman con bastante frecuencia por lo que si se quiere mantener los conocimientos actualizados, hay que comprobar las diferencias entre HTML 4 y HTML 5 con bastante frecuencia. Para utilizar los nuevos elementos y atributos en el trabajo, es recomendable hacerlo slo con carcter experimental, porque los elementos y sus atributos estn obligados a cambiar un poco en el futuro, a menos que se est constantemente modificando el cdigo este podra quedar obsoleto rpidamente.

NOTA: Ver ANEXO 3

ANEXO

ANEXO 1
Los elementos en bloque son:
es el elemento encargado de contener la informacin de contacto con los autores del documento. (cita en bloque). Crea citas en bloque, marca las citas a otros autores o documentos. el elemento center (centro) crea una caja en bloque con el contenido centrado. En realidad es equivalente a un div con align=center. el elemento DIR fue diseado para crear listas multicolumna de directorios. (de division divisin). Es un elemento en bloque genrico y sirve para crear secciones o agrupar contenidos. (de definition list lista de definicin). Crea una lista de definiciones. el elemento fieldset (grupo de campos) permite organizar en grupos los campos de un formulario. acta como contenedor de controles. crea un encabezado o ttulo de primer nivel para una seccin del documento. crea un encabezado o ttulo de segundo nivel para una seccin del documento. crea un encabezado o ttulo de tercer nivel para una seccin del documento. crea un encabezado o ttulo de cuarto nivel para una seccin del documento. crea un encabezado o ttulo de quinto nivel para una seccin del documento. crea un encabezado o ttulo de sexto nivel para una seccin del documento. crea una linea de separacin horizontal. desaprobado este elemento crea un control de entrada de texto de una lnea.

address

blockquote

center

desaprobado

dir

desaprobado

div

dl

fieldset form

h1

h2

h3

h4

h5

h6 hr isindex

menu

desaprobado

en su origen fue pensado para crear mens. (de sin marcos). Aporta contenidos alternativos a los marcos. Las aplicaciones de usuario que no soporten marcos, o que estn configuradas para no mostrarlos, deben mostrar en su lugar el contenido de este elemento. contenedor de contenido alternativo para la representacin no basada en scripts. (lista ordenada). Crea una lista ordenada. prrafo (preformateado). Permite que el texto conserve el formato y sea mostrado tal cual. tabla (de unordered list, lista no ordenada). Crea una lista no ordenada.

noframes

noscript ol p

pre table

ul

Los elementos en lnea son:


a abbr acronym b basefont define un anchor (anclaje) (o hipervnculo) define una forma abreviada de una palabra o de una frase una abreviatura que incluye las letras iniciales de una frase se desaconseja el uso indica que el texto debe ser representado con bold (o negrita). Desaprobado permite cambiar algunas propiedades del texto bi-directional override anulacin del algoritmo bidireccional (en referencia a la direccin de la escritura). se desaconseja el uso muestra el texto marcado con un tamao de fuente ms grande. line Break Ruptura (o salto) de lnea marca una referencia a una fuente, o el autor de un texto citado. sirve para marcar el cdigo de un programa. sirve para marcar el trmino que se quiere definir.

bdo big br cite code dfn

em font desaprobado

emphasis nfasis indica el tamao, color, o fuente del texto que contiene.

i img

muestra el texto marcado con un estilo en cursiva o itlica (no se desaconseja el uso tiene un uso semntico, slo visual). imagen elemento que se utiliza para capturar la informacin del usuario (dependiendo del contexto vara). marca el texto que debe introducir el usuario. el elemento label (etiqueta) asocia un rtulo o etiqueta a un campo de un formulario. (short quotations) cita corta. (strike-through) tachado (no tiene un uso semntico, slo visual). sirve identificar una muestra de los caracteres que forman la salida o el resultado de algn proceso (por ejemplo de un programa de computacin). crea un contenedor mediante el cual los usuarios pueden seleccionar de una lista de opciones. se desaconseja el uso aplica al texto marcado un tamao de fuente ms pequeo. (abarcar). Es un contenedor genrico en lnea. Sirve para para aplicar estilo al texto o agrupar elementos en lnea desaprobado muestra el texto tachado con una linea horizontal. sirve para marcar con especial nfasis las partes ms importantes de un texto. crea un subndice posicionando el texto marcado por debajo de la linea. crea un superndice posicionando el texto marcado por encima de la linea. similar a input crea un control de entrada de texto multilnea. se desaconseja el uso sirve para representar como texto de teletipo (teletype) o ancho

input kbd

label q

desaprobado

samp

select small

span strike

strong

sub

sup textarea tt

fijo. u var desaprobado muestra el texto subrayado. marca variables de programas y similares.

ANEXO 2

ANEXO 3
DIFERENCIAS EN LAS SINTAXIS DE HTML 4 Y HTML 5 Etiqueta <!-- --> <!DOCTYPE> <a> <abbr> <acronym> <address> <applet> <area> <article> <aside> <audio> Estndar o ninguno Atributos globales Atributos globales autobuffer | autoplay | controls | loop | src Nueva etiqueta Nueva etiqueta Nueva etiqueta Estndar o ninguno Etiqueta eliminada Atributos Estndar o ninguno Estndar o ninguno href | target | rel | hreflang | media | Atributo Aadido: media type Atributo cambiado: Target Estndar o ninguno Etiqueta Eliminada Comentarios

<b> <base> <basefont> <bb> <bdo> <big> <blockquote> <body> <br> <button> <canvas> <caption> <center> <cite> <code> <col> <colgroup> <command> <datagrid> <datalist> <dd> <del> <details> <dialog> <dir> <div> <dfn> <dl> <dt> <em> <embed> <fieldset> <figure> <font> <footer> <form> <frame> <frameset> <h1> ... <h6> <head>

Atributos globales Estndar o ninguno

Etiqueta cambiada Etiqueta eliminada

Estndar o ninguno Estndar o ninguno Etiqueta eliminada Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno height | width Estndar o ninguno Etiqueta eliminada Atributos globales Estndar o ninguno Estndar o ninguno Estndar o ninguno checked | default | disabled | hidden | icon | label | radiogroup | type Estndar o ninguno Atributos globales Estndar o ninguno Estndar o ninguno open Atributos globales Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno height | src | type | width Estndar o ninguno Atributos globales Atributos globales Estndar o ninguno Etiqueta eliminada Etiqueta eliminada Estndar o ninguno Estndar o ninguno Nueva etiqueta Etiqueta eliminada Nueva etiqueta Nueva etiqueta Nueva etiqueta Nueva etiqueta Etiqueta eliminada Nueva etiqueta Nueva etiqueta Etiqueta cambiada Nueva etiqueta

<header> <hgroup> <hr> <html> <i> <iframe> <img>

Atributos globales Atributos globales Ninguno Estndar o ninguno Ninguno Estndar o ninguno Estndar o ninguno

Nueva etiqueta Nueva etiqueta Etiqueta cambiada Etiqueta cambiada

<input>

accept | alt | auto-complete | autofocus | cheked | disabled | form | formaction | formenctype | formmethod | formnovalidate | Etiqueta cambiada: formtarget | height | list | max | Aadidos 13 elementos a maxlength | min | multiple | name | type pattern1 placeholder | readonly | required | size | src | step | type | value | width Estndar o ninguno Etiqueta eliminada Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Atributos globales Estndar o ninguno Estndar o ninguno Estndar o ninguno high | low | max | min | optimum | value Atributos globales Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno form Estndar o ninguno Estndar o ninguno Estndar o ninguno max | value Nueva etiqueta Nueva etiqueta Nueva etiqueta Nueva etiqueta Etiqueta eliminada Nueva etiqueta

<ins> <isindex> <kbd> <label> <legend> <li> <link> <mark> <map> <menu> <meta> <meter> <nav> <noframes> <noscript> <object> <ol> <optgroup> <option> <output> <p> <param> <pre> <progress> <q>

<ruby> <rp> <rt> <s> <samp> <script> <section> <select> <small> <source> <span> <strike> <strong> <style> <sub> <sup> <table> <tbody> <td> <textarea> <tfoot> <th> <thead> <time> <title> <tr> <tt> <u> <ul> <var> <video> <xmp>

cite Atributos globales Atributos globales Estndar o ninguno Estndar o ninguno cite Estndar o ninguno Atributos globales media | src | type Estndar o ninguno

Nueva etiqueta Nueva etiqueta Nueva etiqueta Etiqueta eliminada

Nueva etiqueta Etiqueta Cambiada Nueva etiqueta Etiqueta eliminada

Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno Estndar o ninguno datetime | pubdate Estndar o ninguno Estndar o ninguno Etiqueta eliminada Define texto que debe tener un estilo diferente del texto normal 3 Estndar o ninguno Estndar o ninguno src | poster | autobuffer | autoplay | loop | controls | width | height Nueva etiqueta Etiqueta eliminada Nueva etiqueta

Notas: En amarillo aquellas etiquetas introducidas en esta nueva versin, en azul las etiquetas que han sido cambiadas todo o en parte y en gris las etiquetas eliminadas de esta versin. Si bien en la prctica los navegadores no lo estn teniendo en cuenta para evitar perder cuota de mercado.