Salta al contingut principal

Seis sencillas "buenas prácticas" cuando usemos HTML5



HTML5 buenas practicas


Quizás muchos de vosotros os estéis iniciando en HTML5, por eso es bueno comenzar con unas cuantas buenas prácticas de HTML5 desde el principio. 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


Al comenzar a desarrollar una web normalmente 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 generator. Sin olvidarnos de el excelente HTML5 Boilerplate.


Tener siempre a mano un chuleta de HTML5


chuleta HTML5


Seamos sinceros. No conocemos todos los tags HTML5 y algunas veces muchos de ellos se nos olvidan con frecuencia. Eso sin contar los nuevos que se van introduciendo. 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.


Ser cuidadoso con 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, aquí encontraréis tablas de compatibilidades de CSS3, SVG y Javascript.


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 un 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 gilipollez 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 en problemas en algunos navegadores “menos listos” o incluso en la forma que Google nos indexa. El W3C Validator es nuestro amigo.


Vía | Cats Who Code

Imagen | Dustin Wilson

En Genbeta Dev | Las preguntas más interesantes sobre HTML5 respondidas en Genbeta Dev Respuestas














via Genbetadev http://www.genbetadev.com/desarrollo-web/seis-sencillas-buenas-practicas-cuando-usemos-html5

Comentaris

Entrades populars d'aquest blog

15 Tutoriales CSS3 para mejorar tus paginas web

15 Tutoriales CSS3 para mejorar tus paginas web : Les dejo una pequeña recopilación de tutoriales CSS3 que espero sean de utilidad para ustedes, intentamos hacer una recopilación bastante completa para crear impresionantes diseños web con CSS3 y aprovechar las bondades de CSS3 incluso para aplicar efectos, son un total de 15 tutoriales CSS3 gratis . Crear menu dropdown con CSS3 Crear breadcrumbs con estilo Transiciones de paginas con CSS3 Crear timeline con CSS3 y jQuery Reproductor de video con HTML5, CSS3 y jQuery Crear efecto acordion CSS3 Aplicar degradado a texto Crear texto en curva con CSS3 y jQuery Aplicar textura a texto con Magic Pill Crear slider de imagenes con CSS3 y jQuery Rotar texto con CSS3 Crear menu vertical con CSS3 Crear formulario con HTML5 y CSS3 Crear efecto de imagenes apiladas con CSS3 Aplicar estilos para imagenes con CSS3  

Averiguar la Salud del Disco Duro, con Crystal Disk Info [Windows]

Averiguar la Salud del Disco Duro, con Crystal Disk Info [Windows] : El actual “cuello de botella” en nuestras PCs; es decir, donde todo el rendimiento de nuestra PC llega a estancarse , es en el Disco Duro. Si bien los procesadores han evolucionado considerablemente en velocidad / rendimiento, el RAM no sólo es más económico, sino más veloz, y las tarjetas de video siguen innovando con cada generación, los discos duros han permanecido idénticos desde hace años, limitados por la física. Y es que un disco duro tradicional sólo tiene un máximo de velocidad con el que puede girar (medido en revoluciones por minuto, o RPM) que, a su vez, limita la velocidad de lectura y escritura. En pocas palabras, a pesar de que nuestras PCs pueden procesar información mucho más rápido que hace 5 años, los discos duros siguen leyendo (y escribiendo) esta información prácticamente a la misma velocidad. Esto ha cambiado con la llegada de los SSD, los Discos de Estado Sólo que no están limitados por la velo...

Cómo programar add-ons en XBMC: Un add-on más completo

Este tutorial forma parte de la serie Cómo programar un add-on de XBMC Estamos a mitad de camino de este tutorial, pero ya tienes el conocimiento necesario para hacer un add-on bastante completo. Espero que a estas alturas ya te hayas convencido de que es algo relativamente sencillo sin necesidad de saber demasiado de programación. Y ya sabes cómo obtener datos de una página HTML usando expresiones regulares, que es lo más difícil. Así que antes de entrar en la recta final vamos construir un add-on paso a paso desde cero, con el objetivo de afianzar lo que has aprendido en las entregas anteriores y de paso divertirte un poco. Te aconsejo que elijas un sitio web que te guste como fuente de vídeos, para mí he elegido hacer un add-on completo que permita ver los vídeos de Disney Junior tanto en la web oficial como en YouTube. No se trata de un add-on demasiado complejo, como podrás comprobar enseguida, pero no va a desmerecer en nada a cualquiera de los que puedes encontrar publicados en...