By - - 1 Comment

Cómo que Microsoft esta teniendo bastante movimiento en estos últimos días, he escrito bastantes cosas sobre ellos, algo me ha de estar pasando pero realmente, lo están haciendo bien, esta vez con cursos online para aprender HTML5.

Logo HTML5

Microsoft ofrece una serie de lecciones con las cuales podrás aprender a programar en HTML5, el curso se divide en 6 lecciones, en las cuales te enseñan:

Lección 1: Definición de HTML5

  • Beneficios de HTML5
  • Principales características
  • Nuevos elementos de markup y presentación
  • Los elementos <video> , <audio> y <canvas>
  • Formularios Web
  • Elementos revisados que se basan en HTML 4.0
  • Introducción a las APIs de HTML5 y tecnologías de apoyo
  • Geolocation
  • Web Workers
  • Almacenamiento Web
  • CSS3: Animaciones y transiciones
  • CSS3: Fondos, bordes, colores RGBa, gradientes, sombreados y esquinas redondeadas
  • Tipos de letra @font-face para la web
  • HTML5 todavía es un proyecto en fase de desarrollo
  • Compatibilidad de navegadores
  • Dónde se utiliza HTML5 actualmente

Lección 2: Conceptos básicos de HTML, XHTML y CSS

  • Introducción a la sintaxis de HTML
  • Detalles de la sintaxis XHTML
  • La función de DOCTYPE
  • Validación W3C y de página
  • Creación de una página HTML
  • Definición de elementos HTML
  • Inserción de imágenes en HTML
  • Uso de atributos
  • Creación de vínculos
  • El papel de las hojas de estilos CSS (Cascading Style Sheets)
  • Aplicar estilos a una cabecera
  • Clases de estilos y el elemento <span>
  • Tres formas de utilizar los estilos
  • Cuándo utilizar hojas de estilo Internas o externas
  • Creación de una hoja de estilos externa
  • El concepto de “cascada” de CSS

Lección 3: Introducción a la presentación en pantalla con CSS

  • El papel del archivo de reset CSS
  • Añadir un enlace a una hoja de estilos de reset externa
  • Breve historia de las técnicas de disposición en pantalla de las páginas web
  • Introducción a las opciones de presentación de las páginas
  • Creación de una estructura básica de dos columnas de ancho fijo con CSS
  • El elemento DIV
  • Asociación de IDs y clases CSS con elementos DIV
  • La propiedad float de CSS
  • Creación de columnas con la propiedad float
  • Uso de la propiedad clear
  • Creación de una navegación basada en listas con directivas float
  • Uso de márgenes y rellenos para controlar la disposición de los elementos en pantalla
  • Imágenes de fondo con CSS
  • Decoración de un pie de página con una imagen de fondo

Lección 4: Uso de las etiquetas HTML5

  • Revisión del concepto de semántica de las etiquetas HMTL
  • Fundamentos de HTML5
  • Uso de la declaración DOCTYPE de HTML5
  • Diferentes categorías utilizadas para contenidos HTML5
  • Contenidos de Metadatos
  • Contenidos de Flujo
  • Contenidos de Sección
  • Contenidos de Cabecera
  • Contenidos de Frase
  • Contenidos embebidos
  • Contenidos interactivos
  • El nuevo elemento <header> de HTML5
  • Incorporar soporte para elementos HTML5 en los navegadores
  • Incorporación de elementos <nav> de HTML5
  • Esquema de documentos con HTML5
  • Incorporación de otros elementos de sección de HTML5
  • Elemento <section>Elemento <article>
  • Elemento <aside>
  • Elemento <footer>
  • Otros elementos HTML5
  • Elemento <figure>
  • Elemento <figcaption>
  • Elemento <time>
  • Elementos revisados de HTML 4.0
  • La etiqueta <b> frente a <strong>
  • La etiqueta <i> frente a <emphasis>
  • Uso de formularios HTML5
  • Tipos de datos de entrada email y url
  • Atributos required y placeholder
  • Atributos autofocus y autocomplete
  • Uso de los elementos Video y Audio
  • Uso del elemento <video> y sus atributos relacionados
  • Uso del elemento <audio> y sus atributos relacionados
  • Aspectos a tener en cuenta sobre los códecs de vídeo y audio al trabajar con contenidos multimedia

Lección 5: uso del elemento Canvas

  • El papel de JavaScript en las aplicaciones HTML5
  • Conceptos básicos de JavaScript
  • Eventos de JavaScript
  • Ubicación del código JavaScript en un documento externo
  • El DOM (Document Object Model)
  • El elemento Canvas
  • Ventajas del elemento Canvas
  • Diseño gráfico con Canvas
  • Dibujo de trazos
  • Dibujo de rectángulos
  • Dibujo de líneas y círculos
  • Dibujo de curvas
  • Inserción de textos
  • Colores, estilos y gradientes
  • Inserción de imágenes
  • Creación de gráficos en el Canvas
  • Uso de arrays de datos
  • Creación de animaciones con Canvas y Animation
  • Uso de transformaciones
  • Creación de un bucle de dibujo

Lección 6: funciones Drag y Drop de HTML5

  • Diferentes formatos de Drag y Drop en la web
  • Ventajas de las funciones Drag y Drop
  • Compatibilidad de Drag y Drop entre distintos navegadores
  • Uso de la función preventDefault
  • Los eventos dragenter y dragover
  • Convertir un elemento en “arrastrable” ( draggable) en HTML5
  • El atributo ondragstart
  • Creación de la función dragStarted
  • Medidas para la compatibilidad con diferentes navegadores
  • Transferencia de datos con una operación “Drag-and-Drop”
  • Uso del objeto dataTransfer
  • Uso de la función setData
  • La propiedad innerHTML

Enlace Curso Gratuito Online de HTML5 impartido por Microsoft