A newer version of this slide template is availalable at https://code.google.com/p/io-2012-slides/

USE IT!

The 2012 version is mobile friendly, touch enabled, and has shiny new features.

By Luke Mahé and Marcin Wichary.

Demo

http://html5slides.googlecode.com/svn/trunk/template/index.html

Instructions for editing slides

Get this template: http://code.google.com/p/html5slides/source/browse/trunk/template/index.html and copy/paste it to a new file on your local computer.

Edit at will. Copy the code for the sample slides and fill it out with the content you want.

If you need styles for different tags or different types of slides, please let us know.

Different themes

Change the class template-default on section class="slides" to use a different template:

• template-default = default Google template
• template-io2011 = I/O 2011 template

Different layouts

Change the outermost section class layout-regular to layout-faux-widescreen or layout-widescreen.

Instructions for presenting

Press Enter, space, right arrow to advance; Backspace, left arrow to go back.

Enter full-screen mode (F11 or Shift-Command-F) before presenting.

You should be able to press Ctrl+R/F5 at any time to refresh without losing your place in the presentation.

If an iframe steals your focus and you can’t advance any more, please click outside the slide on the background to give the focus back to the presentation.

Caveats

• should work on modern Chrome, Firefox, Safari, Opera… and generally touch devices.