Sencillas prácticas cuando usemos HTML5

Son bastante básicas, pero no está de más recordar alguna de ellas, ya que sobre todo nos ayudarán a crear un mejor código HTML5.

Usar un generador de plantillas básicas

Lo primero es definir los elementos básicos, buena parte de ellos son los mismos en casi todas las páginas, algunos tags iniciales como: header, footer, metas… Para crear este esqueleto básico podemos usar alguno de los generadores de plantillas disponibles en forma online.

Algunos de los más conocidos son SwitchToHTML5, Shikiryu generatorr. Sin olvidarnos de el excelente HTML5 Boilerplate.

Tener siempre a mano un chuleta de HTML5

No conocemos todos los tags HTML5 y algunas veces muchos de ellos se nos olvidan con frecuencia. Así que lo mejor es tener siempre a mano una chuleta (cheat sheet) de HTML5. Podéis encontrar unas cuantas sobre tags, event handler o soporte en navegadores en la web siempre actualizadas.

Prestar atención a la compatibilidad de los elementos que usemos

HTML5 sigue siendo una tecnología nueva. Aunque poco a poco muchos navegadores ya la van incorporando no en todos funciona ni de la misma forma. Por eso es recomendable tener siempre a mano la web de Can I Use.com para consultar que especificaciones podemos usar.

Saber cómo hacer compatibles HTML5 y versiones antiguas de Internet Explorer

Internet Explorer siempre ha sido un quebradero de cabeza para los desarrolladores web. Con HTML5 promete dar aún algunos dolores de cabeza, al menos para las versiones antiguas de IE 8 y anteriores. La buena noticia es que existe un script que te soluciona la vida de una forma muy simple. Se trata de este de html5shim que con tan sólo incluir en la cabecera de tu código permite ser compatible.

Usar los elementos correctamente

Puede parecer una tonteria y te va a funcionar igual, pero si HTML5 nos da tags específicos como header, footer, article, section, aside, nav…. debemos usarlos y olvidar los viejos div para esos casos. Nuestro código se verá favorecido en legibilidad y podremos aprovechar mucho mejor las características de HTML5 para el marcado de nuestras webs.

Valida tu código

Nunca hay que olvidar hacer un código valido. Nos quejamos de la compatibilidad de los navegadores, pero en muchas ocasiones no hemos escrito el código correctamente para que valide, lo que da problemas en algunos navegadores. El W3C Validator es una herramienta online que nos da todos los fallos de validación que haya en la dirección que le especifiquemos.

Asi que siguiendo estos pequeños consejos tendremos una página en HTML5 mucho mejor estructurada y clara.

Referencias:

[1] https://www.genbetadev.com

Suscríbete a nuestro Boletín