Bueno, muchos sabrán hacer códigos en HTML ya sea manualmente o con softwares como kompozer o dreamweaver pero no todos saben que hay varias versiones de HTML que pueden marcar la diferencia al momento de crear sus sitios webs tanto en rendimiento como en utilidad.
No les voy a narrar la historia completa de HTML ya que este post es solamente para mostrar en grandes rasgos la diferencia entre algunas versiones.
Normalmente los softwares que hoy se utilizan para el desarrollo web basado en un código HTML lo hacen en XHTML y es una versión basada en HTML4 pero superior.
¿Como se en que lenguaje está hecha mi web?
ves el código fuente de tu sitio y verás algo como esto:
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-CL" xml:lang="es">
Esto significa que estamos utilizando nuestro código basado en XHTML pero cual es la diferencia entre HTML4 y XHTML?...
HTML4:
<b>Selecciona:</b><br>
<select name="test">
<option value="1">Uno</option>
<option>Dos</option>
</select>
XHTML:
<b>Selecciona:</b><br />
<select name="test">
<option value="1" />Uno
<option />Dos
</select>
Si se fijan en HTML4 debes cerrar todos los tags que abres en cambio en XHTML puedes abrirlos y declararlos cerrados en un mismo tag sin tener que duplicar.
Esto entre muchas diferencias basadas mas en lenguaje XML como base.
HTML5 es la quinta versión de HTML y es un standard para todos y el navegador que quiera actualizarse bienvenido y el que no se queda en el pasado, pero es un standard igual ya que de esto depende el desarrollo de muchis sitios webs y softwres ejecutables.
Este standard lo regulariza W3C (
http://www.w3c.es/)
La diferencia entre HTML y las versiones anteriores son mas que nada entre sus TAGS (<algo>) como por ejemplo <audio> y <video> que permiten insertar contenido media sin la necesidad de depender de sistemas externos como flash, reproductores, etc. Esto es gracias a un sistema nativo que debe incluir el explorador WEB (sea cual sea ya que es un standard), de esta forma evitas que el explorador entre en rpoblemas son los softwares y termine en problemas como el cierre del explorador o fallas entre compatibilidades, codecs, etc.
Además como los videos ahora los manipularía el explorador tienes la posibilidad de manipular colores, efectos, y un mil de opciones directamente desde los mismos tags de video o desde el DOM con Javascript.
Ejemplo:
http://www.dailymotion.com/openvideodemo
También tienes la posibilidad de utilizar fuentes de texto que subas al servidor como archivo e incluirlas directamente como tipografía a utilizar, actualmente en html4 y xhtml es imposible.
Mozilla Firefox 3.5 fué el primer explorador en ajustarse a HTML5, le siguen detrás haciendo pruebas todabía google chrome y para internet explorer no hay ninguna versión que lo soporte (incluso todabia siguen adaptandose a CSS2 y ya van en CSS3).
Algunos ejemplos:
<video controls>
<source src="foo.ogg" type="video/ogg">
<source src="foo.mp4">
Your browser does not support the <code>video</code> element.
</video>
@font-face {
font-family: breipfont;
src: url(images/breipfont.otf) format("opentype");
}
Con esto cargamos la fuente (en mi caso breipfont) haciendo la declaración con la regla ‘font-face‘ y le asignamos un nombre.
.post-content h2 {
font-family: 'breipfont', 'Georgia';
font-size: 26px;
line-height: 30px;
padding-left: 18px;
}
HTML5 es el futuro y tarde o temprano todos tendrán que migrar a esta nueva versión de HTML asi que nunca está demás aprender.
Algunas fuentes de referencia:
http://es.wikipedia.org/wiki/HTML_5
https://developer.mozilla.org/En/Using_audio_and_video_in_Firefox
http://www.youtube.com/html5
http://blog.unique3w.com/jugando-con-font-face-html5