XHTML 1.0 es una recomendación oficial del W3C con fecha 26 de enero del 2000.
El ser una recomendación del W3C significa que la especificación es estable, que ha sido revisada por los miembros del W3C, y que la especificación es ahora un estándar Web.
XHTML es una combinación de HTML y XML (eXtensible Markup Language).
XHTML está integrado por todos los elementos del HTML 4.01 combinados con la sintaxis de XML.
XHTML es la siguiente generación de HTML, pero tomará algún tiempo antes de que los navegadores y otros programas estén listos para él.
Mientras tanto hay algunas cosas importantes que puede ir haciendo para prepararse. XHTML no es muy diferente a HTML 4.01, así cumplir con el estándar 4.01 es un buen principio
Además debe empezar a escribir su código HTML en minúsculas, y jamás saltarse las etiquetas (tag) de finalización como </p>.
Un documento XHTML está constituido por tres partes:
La declaración DOCTYPE debe ser siempre la primera línea del documento XHTML.
Un documento XHTML se valida contra un DTD (Document Type Definition). Antes de que un archivo XHTML pueda ser adecuadamente validado, un DTD debe ser agregado en la primera línea del archivo.
El DTD especifica la sintaxis de una página web en SGML. Los DTD son usados por aplicaciones SGML como el HTML, para especificar reglas que se aplican al marcado de documentos de un tipo en particular, incluyendo un conjunto de declaraciones de elementos y entidades.
El XHTML está especificado en un DTD escrito en SGML. Un DTD de XHTML describe de forma precisa, en lenguaje legible por computadoras, la sintaxis y la gramática permitida en un documento XHTML.
La versión 1.0 de XHTML está integrada por 3 DTD:
El DTD estricto incluye los elementos y atributos que no han sido desaprobados o que no aparecen en los framesets. Su declaración es:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Se debe usar siempre que se quiera un código limpio, libre de desorden. Debe ser usado junto con hojas de estilo CSS (Cascading Style Sheets) para mejorar la presentación visual.
El DTD de transición incluye todo lo del DTD estricto además de los elementos y atributos desaprobados. Su declaración es:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Se debe usar cuando se necesiten las ventajas de presentación visual del HTML o cuando se tenga que trabajar con navegadores que no entienden hojas de estilo CSS (Cascading Style Sheets).
El DTD para Frameset incluye todo lo del DTD de transición además de los elementos relacionados a los frames. Su declaración es:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Se debe usar cuando se necesiten hacer uso de los frames HTML para dividir la ventana del navegador.
Casi todos los elementos XHTML comparten los siguientes atributos:
No válidos en base, head, html, meta, param, script, style ni en title
| Atributo | Valores | Descripción |
|---|---|---|
| class | class_rule o style_rule | La clase de un elemento (se usa en CSS) |
| id | id_name | Un identificador único para el elemento |
| title | tooltip_text | Un texto para desplegarse como ayuda |
No válidos en base, br, frame, frameset, hr, iframe, param ni en script
| Atributo | Valores | Descripción |
|---|---|---|
| dir | ltr | rtl | Dirección de la escritura del texto |
| lang | language_code | Establece el código del idioma del texto |
| Atributo | Valores | Descripción |
|---|---|---|
| accesskey | caracter | Establece un atajo de teclado para acceder al elemento |
| tabindex | número | Establece el orden de tabulación (tab) del elemento |
Sólo válidos en body y en frameset.
| Atributo | Valores | Descripción |
|---|---|---|
| onload | script | Script que se correrá cuando se cargue el documento |
| onunload | script | Script que se correrá cuando se descargue el documento |
Sólo válidos en elementos form.
| Atributo | Valores | Descripción |
|---|---|---|
| onchange | script | Script que se corre cuando un elemento cambia |
| onsubmit | script | Script que se corre cuando la forma es enviada |
| onreset | script | Script que se corre cuando la forma es reseteada |
| onselect | script | Script que se corre cuando se selecciona un elemento |
| onblur | script | Script que se corre cuando un elemento pierde el foco |
| onfocus | script | Script que se corre cuando un elemento obtiene el foco |
No son válidos en base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style ni en title.
| Atributo | Valores | Descripción |
|---|---|---|
| onkeydown | script | Que hacer cuando se presiona una tecla |
| onkeypress | script | Que hacer cuando se presiona y suelta una tecla |
| onkeyup | script | Que hacer cuando se suelta una tecla |
No son válidos en base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style ni en title.
| Atributo | Valores | Descripción |
|---|---|---|
| onclick | script | Que hacer cuando se da un clic |
| ondblclick | script | Que hacer cuando se da un doble clic |
| onmousedown | script | Que hacer cuando se presiona el botón del ratón |
| onmousemove | script | Que hacer cuando se mueve el puntero |
| onmouseover | script | Que hacer cuando se mueve el puntero dentro del elemento |
| onmouseout | script | Que hacer cuando se mueve el puntero fuera del elemento |
| onmouseup | script | Que hacer cuando se libera el botón del ratón |
| Etiqueta (Tag) | Descripción |
|---|---|
| <!--> | Defines a comment |
| <!DOCTYPE> | Defines the document type |
| <a> | Defines an anchor |
| <abbr> | Defines an abbreviation |
| <acronym> | Defines an acronym |
| <address> | Defines an address |
| <applet> | Defines an applet |
| <area /> | Defines an area inside an image map |
| <b> | Defines bold text |
| <base /> | Defines a base URL for all the links in a page |
| <basefont /> | Defines a base font |
| <bdo> | Defines the direction of text display |
| <big> | Defines big text |
| <blockquote> | Defines a long quotation |
| <body> | Defines the body element |
| <br /> | Inserts a single line break |
| <button> | Defines a push button |
| <caption> | Defines a table caption |
| <center> | Defines centered text |
| <cite> | Defines a citation |
| <code> | Defines computer code text |
| <col> | Defines attributes for table columns |
| <colgroup> | Defines groups of table columns |
| <dd> | Defines a definition description |
| <del> | Defines deleted text |
| <dir> | Defines a directory list |
| <dfn> | Defines a definition term |
| <div> | Defines a section in a document |
| <dl> | Defines a definition list |
| <dt> | Defines a definition term |
| <em> | Defines emphasized text |
| <fieldset> | Defines a fieldset |
| <font> | Defines the font face, size, and color of text |
| <form> | Defines a form |
| <frame> | Defines a sub window (a frame) |
| <frameset> | Defines a set of frames |
| <h1> to <h6> | Defines header 1 to header 6 |
| <head> | Defines information about the document |
| <hr /> | Defines a horizontal rule |
| <html> | Defines an html document |
| <i> | Defines italic text |
| <iframe> | Defines an inline sub window (frame) |
| <img /> | Defines an image |
| <input> | Defines an input field |
| <ins> | Defines inserted text |
| <isindex> | |
| <kbd> | Defines keyboard text |
| <label> | Defines a label |
| <legend> | Defines a title in a fieldset |
| <li> | Defines a list item |
| <link> | Defines a resource reference |
| <map> | Defines an image map |
| <menu> | Defines a menu list |
| <meta> | Defines meta information |
| <noframes> | Defines a noframe section |
| <noscript> | Defines a noscript section |
| <object> | Defines an embedded object |
| <ol> | Defines an ordered list |
| <optgroup> | Defines an option group |
| <option> | Defines an option in a drop-down list |
| <p> | Defines a paragraph |
| <param> | Defines a parameter for an object |
| <pre> | Defines preformatted text |
| <q> | Defines a short quotation |
| <s> | Defines strikethrough text |
| <samp> | Defines sample computer code |
| <script> | Defines a script |
| <select> | Defines a selectable list |
| <small> | Defines small text |
| <span> | Defines a section in a document |
| <strike> | Defines strikethrough text |
| <strong> | Defines strong text |
| <style> | Defines a style definition |
| <sub> | Defines subscripted text |
| <sup> | Defines superscripted text |
| <table> | Defines a table |
| <tbody> | Defines a table body |
| <td> | Defines a table cell |
| <textarea> | Defines a text area |
| <tfoot> | Defines a table footer |
| <th> | Defines a table header |
| <thead> | Defines a table header |
| <title> | Defines the document title |
| <tr> | Defines a table row |
| <tt> | Defines teletype text |
| <u> | Defines underlined text |
| <ul> | Defines an unordered list |
| <var> | Defines a variable |
Para hacer a XHTML compatible con los navegadores actuales se debe de agregar un espacio extra antes del símbolo terminal "/" en etiquetas como: <br /> y como <hr />
Los documentos XML (un documento XHTML es un documento XML) pueden contener caracteres "extranjeros" para la lengua inglesa. Para que el parser (analizador gramatical) de XML los pueda interpretar correctamente se debe de agregar alguno de los siguientes encabezados:
Los siguientes encabezados son sólo válidos en documentos que únicamente contienen caracteres "nativos" de la lengua inglesa:
En caso de que se use un editor de textos compatible con unicode para generar el documento, se puede usar la siguiente declaración:
En resumen, se debería usar un editor de texto que soporte codificación unicode, en caso de que no se cuente con uno verificar el tipo de código que genera el que se usará y poner el encabezado respectivo.
Con este atributo se debe de designar el idioma en el cual se encuentra escrito el documento XHTML:
La etiqueta de comentario cambio:
HTML: <!--Aquí va el comentario--> XHTML: <![CDATA[Aquí va el comentario]]>
Para la codificación de scripts y de estilos CSS:
<script type="text/javascript">//<![CDATA[ código de javascript //]]></script>