Creating HTML-based presentations
Shower
Shower [8] is hands down the slickest HTML presentation engine out there (Figure 5). But the look is not its only attractive feature. For starters, Shower is available as a template package containing everything you need to create high-quality presentations with a minimum of tweaking. The engine packs comprehensive functionality, too. Shower features a thumbnail view that shows all slides in the presentation, and you can quickly jump to any slide by clicking on it.
Shower supports text formatting (including in-line code highlighting), lists (numbered, unnumbered, and mixed), syntax highlighting, block quotes, and even tables. It can also handle images and incremental slides. The feature extravaganza doesn't stop here: Shower also allows you to create special slides with large headings using the "slide out"
class, and the engine provides support for keyboard shortcuts.
Creating a presentation with Shower is not particularly difficult, especially if you opt for the template package from the project's website. Grab the latest template.zip
archive, unpack it, and open the index.html
file in a text editor. The overall structure of the template is easy to figure out, and you can use the default slides as a starting point for your presentation.
Other Tools
In this article, I covered only a few tools for creating simple HTML presentations. However, other advanced frameworks that can be used to build sophisticated presentations, including reveal.js [9], deck.js [10], and impress.js [11]. Each of these frameworks deserves a separate article, as they offer comprehensive functionality for creating impressive slideshows.
On the opposite end are some brilliantly simple tools like GistSlide [12] and GistDeck [13]. Strictly speaking, these are not tools for creating HTML presentations: Both GistSlide and GistDeck are web apps that can transform any Gist hosted with the GitHub Gist service into a simple presentation. All you have to do is add a special bookmarklet to your browser, open the Gist containing the text of the presentation, and click on the bookmark. Neither app can replace dedicated tools for creating HTML presentations, but they could come in handy for whipping up a simple slideshow in a pinch.
Infos
- Big: http://www.macwright.org/big
- Big themes: http://github.com/tmcw/big-themes
- Takahashi method: http://en.wikipedia.org/wiki/Takahashi_method
- weenote: http://github.com/jed/weenote
- HTML Slideshow: http://github.com/robflaherty/html-slideshow
- Google Fonts: http://www.google.com/fonts
- DZSlides: http://github.com/paulrouget/dzslides
- Shower: http://github.com/shower/shower
- reveal.js: http://lab.hakim.se/reveal-js
- deck.js: http://imakewebthings.com/deck.js
- impress.js: http://bartaz.github.io/impress.js
- GistSlide: http://gistslide.herokuapp.com
- GistDeck: http://gistdeck.herokuapp.com
« Previous 1 2
Buy this article as PDF
(incl. VAT)