HTML5 tutorial for WWW 2013

De $1

Version de 12:11, 23 Avr 2024

cette version.

Revenir à liste des archives.

Voir la version actuelle

 

Introduction

Slides from the presentation

Practice!

We split this tutorial in two paths that eventually will share a common part.

  1. One path for people mostly interested in discovering HTML5 features, playing with small bits of HTML/JavaScript code, tweak them, see interactively the results... No real expertise is required.
  2. Another path that present step by step some exercices like: writing an about page using the new HTML5 structuring elements and Microdata, write a HTML5 powered form with drag'n'drop of picture, webcam use, auto save feature using WebStorage, or write a small game using the HTML5 canvas.

The second path will need you to download some files, have a minimum expertise in JavaScript (with maybe a bit of jQuery), 

Discovery path

We prepared simple examples, organized by category and pasted in the online HTML/Javascript IDE jsbin.com so that you can interact with the sample codes and see immediately the result of your modifications. Some of them are variations of well known samples from popular sites.

Path for geeks: enhanced about page, enhanced form, HTML5 game

  • Tutorial 1: study a paint program step by step
  • Tutorial 2: study chat applications that use NodeJS + socket.io / Web Sockets
  • Tutorial 3: study a small game engine prototype