XHTML
(eXtensible HiperText Markup Language)
HTML es el lenguaje de marcas más ampliamente reconocido y utilizado del mundo y se utiliza para crear páginas web; sin embargo, la falta de estandarización nos ha llevado a esta última versión que nace del XML. El XHTML, contiene el 95% de las etiquetas HTML, pero su uso está restringido a las reglas del lenguaje de marcas XML.
Los documentos XHTML generalmente utilizan las extensiones ".xhtml", ".html" ó ".htm", aunque últimamente está tomando auge el primer tipo de extensión, para diferenciar el tipo de documento a simple vista.
Las reglas para la creación de un documento XHTM son cinco y se enumeran a continuación:
La estructura de las etiquetas en XHTML consta de dos partes:
Como el lenguaje XHTML se deriva del lenguaje XML, es buena idea identificar el documento como tal, para esto, agregamos la siguiente etiqueta: <?xml version="1.0" encoding="UTF-8">
Por supuesto, agregaremos la codificación que más nos convenga.
El tipo de documento, se agrega con la finalidad de que nuestro documento sea validado de acuerdo a las reglas establecidas en su dtd. Existen tres opciones para XHTML:
Esta primera opción validará nuestro documento estrictamente. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml/DTD/xhtml1-strict.dtd">
Esta otra opción, permitirá compatibilidad con versiones anteriores. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml/DTD/xhtml1-transitional.dtd">
La última, nos permite hacer validaciones correctas para páginas que utilicen frames. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml/DTD/xhtml1-frameset.dtd">
Lo más correcto a la hora de escribir nuestro documento, es agregar los espacios de nobre para las etiquetas xml, para que nuestro documento esté bien formado y sea correctamente validado. <html xmlns="http://www.w3.org/1999/xhtml"> </html>
Este es el encabezado y es el primer elemento dentro de nuestro documento XHTML, en él se agragarán el título, metadatos y enlaces a recursos como javascript u otros. <head> </head>
El inicio y fin de nuestro documento estará marcado por la etiqueta de cuerpo de documento, como se presenta a continuación. Esta etiqueta representa el contenido de nuestra página y su formato. <body> </body>
A continuación presento un listado de las etiquetas utilizadas en XHTML, conviene saber que existen y para lo que sirven si se quieren realizar páginas web robustas e informativas.
Las etiquetas que fueron eliminadas son: applet, basefont, center, dir, font, isindex, menu, s, strike, u. Estas se siguen utilizando en versiones anteriores de html.
Los documentos XHTML generalmente utilizan las extensiones ".xhtml", ".html" ó ".htm", aunque últimamente está tomando auge el primer tipo de extensión, para diferenciar el tipo de documento a simple vista.
Las reglas para la creación de un documento XHTM son cinco y se enumeran a continuación:
- Las etiquetas se tienen que cerrar de acuerdo a como se abren.
- Los nombres de las etiquetas y los atributos siempre se escriben en minúsculas.
- El valor de los atributos siempre se encierra con comillas.
- Los atributos no se pueden comprimir.
- Todas las etiquetas deben cerrarse siempre.
La estructura de las etiquetas en XHTML consta de dos partes:
- La apertura contiene un signo de menor que, seguido del nombre de la etiqueta, seguido del signo de mayor que. Ejemplo: <nombre>.
- El cierre contiene un signo de menor que, seguido de una barra inclinada, seguido del nombre de la etiqueta, y a continuación el signo de mayor que. Ejemplo: </nombre>.
Como el lenguaje XHTML se deriva del lenguaje XML, es buena idea identificar el documento como tal, para esto, agregamos la siguiente etiqueta: <?xml version="1.0" encoding="UTF-8">
Por supuesto, agregaremos la codificación que más nos convenga.
El tipo de documento, se agrega con la finalidad de que nuestro documento sea validado de acuerdo a las reglas establecidas en su dtd. Existen tres opciones para XHTML:
Esta primera opción validará nuestro documento estrictamente. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml/DTD/xhtml1-strict.dtd">
Esta otra opción, permitirá compatibilidad con versiones anteriores. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml/DTD/xhtml1-transitional.dtd">
La última, nos permite hacer validaciones correctas para páginas que utilicen frames. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml/DTD/xhtml1-frameset.dtd">
Lo más correcto a la hora de escribir nuestro documento, es agregar los espacios de nobre para las etiquetas xml, para que nuestro documento esté bien formado y sea correctamente validado. <html xmlns="http://www.w3.org/1999/xhtml"> </html>
Este es el encabezado y es el primer elemento dentro de nuestro documento XHTML, en él se agragarán el título, metadatos y enlaces a recursos como javascript u otros. <head> </head>
El inicio y fin de nuestro documento estará marcado por la etiqueta de cuerpo de documento, como se presenta a continuación. Esta etiqueta representa el contenido de nuestra página y su formato. <body> </body>
A continuación presento un listado de las etiquetas utilizadas en XHTML, conviene saber que existen y para lo que sirven si se quieren realizar páginas web robustas e informativas.
a, abbr, acronym, address, applet, area, b, base, basefont, bdo, big, blockquote, body, br, button, caption, center, cite, code, col, colgroup, dd, del, dfn, dir, div, dl, dt, em, fieldset, font, form, frame, frameset, h1, h2, h3, h4, h5, h6, head, hr, html, i, iframe, img, input, ins, isindex, kbd, label, legend, li, link, map, menu, meta, noframes, noscript, object, ol, optgroup, option, p, param, pre, q, s, samp, script, select, small, span, strike, strong, style, sub, sup, table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, u, ul, var.
Para mayor información sobre las etiquetas, por favor refiérase a la página de la W3C.Las etiquetas que fueron eliminadas son: applet, basefont, center, dir, font, isindex, menu, s, strike, u. Estas se siguen utilizando en versiones anteriores de html.
Por otra parte, tenemos los eventos, que son atributos a los que pueden asignarseles funciones de JavaScript u otras tecnologías. Estos son: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. Existen otros atributos, que se utilizan para que la página tenga una mejor interacción con el usuario, le dará una característica de accesibilidad, estos atributos manipulan el foco de los elementos. Estos son:
- accesskey="letra": Este atributo establece un acceso rápido al elemento especificado.
- tabindex="número": Este otro atributo, se agrega con el fin de mantener un orden en el acceso de los elementos al presionar la tecla tab. Se empieza por el número 0.
- onfocus=JavaScript: Establece una acción asociada a un código JavaScript, que se ejecutará cuando el elemento gane el foco.
- onblur=JavaScript: Establece una acción asociada a un código JavaScript, que se ejecutará cuando el elemento pierda el foco.
Los elementos en bloque son los siguientes: address, blockquote, center, dir, div, dl, fieldset, form, h1, h2, h3, h4, h5, h6, hr, isindex, menu, noframes, noscript, ol, p, pre, table, ul. Existen otros elementos que pueden ser considerados de bloque, ya que el comportamiento de estos permite caracterizarlos de esta forma: dd, dt, frameset, li, body, td, tfoot, th, thead, tr
Los elementos en línea son: a, abbr, acronym, b, basefont, bdo, big, br, cite, code, dfn, em, font, i, img, input, kbd, label, q, s, samp, select, small, span, strike, strong, sub, sup, textarea, tt, u, var.
Por último, existen elementos que pueden ser de ambos tipos, según se requiera: button, del, iframe, ins, map, object, script.
Por supuesto, el XHTML al estar estandarizado y poseer las características y reglas de las etiquetas XML, pues posee sus propias reglas de uso. Estas reglas deben ser seguidas fielmente para que nuestros documentos sean válidos y bien formados. Estas reglas son:
- Las etiquetas se tienen que cerrar de acuerdo como se abren.
- Los nombres de las etiquetas y los atributos siempre se escriben en minúscula.
- El valor de los atributos siempre se encierran entre comillas.
- Los atributos no se pueden comprimir.
- Todas las etiquetas deben cerrarse siempre.
Ahora bien, empezaremos a ver el uso de las etiquetas, empezando por el manejo de texto. Existen muchas formas de ordenar un documento para que este sea interpretado de forma tal que represente las ideas que deseamos que otras personas entiendan. A continuación veremos las etiquetas que nos permiten dar formato al texto.
- Para representar un párrafo, utilizaremos la siguiente etiqueta: <p>.
- Para representar titulos de diferentes niveles, utilizaremos las siguiente etiquetas: <h1>, para el titulo principal; <h2>, para subtitulo de primer nivel; <h3>; <h4>; <h5>; <h6>.
- Marcado de texto importante: <em> y <strong>.
- Representación de texto borrado y texto agregado (o nuevo): <del cite="direccion con informacion" time="fecha de borrado">; <ins cite="direccion con informacion" time="fecha de insercion">.
- Para hacer una cita de un texto que se encuentra en otro lugar: <blockquote cite="URL">.
- Significado de abreviaturas: <abbr title="significado completo">.
- Significado de acrónimos: <acronym title="significado completo">.
- Definiciones: <dfn title="definicion del termino">.
- Identificar el autor de una cita: <cite>.
- Informacion general. Para informacion como telefonos que no poseen una etiqueta específica: <span>.
