html5 en el mundo móvil

Por: @jimmylagp

Comentarios o preguntas en Twitter usando #ninjacodetv


@html5facil

@ninjacodetv

HTML5 Semántico

Algo importante de HTML5, es la posibilidad de escribir código con significado.

  • Estructura
  • Etiquetas semánticas
  • Microdatos
  • Microformatos

meta Viewport

Configura el area visible de un sitio web en un dispositivo móvil.

  • device-width
  • device-height
  • initial-scale
  • minimum-scale
  • maximum-scale
  • user-scale


Responsive Design

Es una tecnica de diseño y desarrollo web donde los elementos que componen un sitio web son adaptados al entorno del usuario mediante uso de estructuras fluidas y uso de media queries en CSS.

  • @media screen
  • @media print
  • @media all
  • @media all and (atributo: valor) 
  • Uso de javascript: responsive.js

Atributos data

Permite agregar atributos personalizados a etiquetas sin tener problemas de validación del sitio o problemas con el renderizado del navegador.

Uso: data-*

Referencias

HTML5 semantico

Meta viewport

Atributos DATA

Responsive Design

Made with Slides.com