Web-based slideshow: Difference between revisions

Revision as of 00:12, 15 July 2011

Revision as of 18:56, 20 July 2011

Line 1:

{{lead missing|date=May 2011}}

A '''Web Based Slideshow''' is a slideshow using client side browser technology like HTML, Javascript and CSS and be viewed (presented) using a browser. Some web based slideshows are generated from [[Presentation software]] and may be difficult to change (they are usually not supposed to). Others offer templates allowing the slideshow to be easily edited and changed.

== Introduction ==

Web Based Slideshow is basically slideshow techniques using client side browser technology like (HTML(5)/Javascript/CSS)

Compared to a fully fledged [[Presentation program]] the web based slideshows are usually limited in features.

== Features ==

A web based slideshow usually offers the following features - here split into the player (the presenter) features and features available while editing the slideshow.

{| class="wikitable"

|-

! Player Feature !! Feature type || Description

|-

| Works offline || Basic || The slideshow can run without being online to the internet

|-

| Keyboard (Prev/Next) || Basic || Supports moving to next or previous slide (page) using the keyboard. Usually Enter, Space, Arrow Right or Page Down for going to next slide (page) and Arrow Left or Page Up for going to previous slide (page).

|-

| Keyboard (Home/End) || Basic || Supports moving to first and last slide (page) using the keyboard. Usually Home and End keys.

|-

| Slide transition || Basic || Moving between slides (pages) is displayed using animation (visual movement).

|-

| Full screen || Basic || Supports showing the slideshow in full screen (in the browser). Usually implies some sort of automatic scaling of text and images on slides (pages).

|-

| Page numbers || Basic || Supports viewing the current slide (page) number and total number of slides (pages), e.g. 1/19.

|-

| Auto play || Advanced || Supports automatic timed play (movement) to next slide.

|-

| Mobile device compatible || Semi-Advanced || Can be displayed on (the browser) in a mobile phone or tablet. Also implies supporting touch to move between slides (pages).

|-

| Cross browser compatible || Advanced || The slideshow be played using a variety of different standard compliant browsers.

|-

| Toggle speaker notes || Advanced || Allow the user to see/view his/her speaker notes, e.g. as overlay or footer on the screen.

|-

| Prints || Advanced || Supports printing the notes.

|-

! Editing Feature !! Feature type || Description

|-

| Header || Basic || Supports a common header throughout slides.

|-

| Footer || Basic || Supports a common footer throughout slides.

|-

| Images || Basic || Supports inserting images in the slides (pages).

|-

| Headings || Basic || Supports inserting basic headings, e.g. h1, h2, ...

|-

| Paragraphs || Basic || Supports inserting paragraphs of text, e.g. p

|-

| Lists || Basic || Supports inserting lists, e.g. ul and li elements.

|-

| Pretty printed source code || Advanced || Supports inserting source code, possibly pretty printed in player.

|-

| Transitioned text || Advanced || Supports marking elements, e.g. list elements, to be transitionally revealed one by one (typically by a key press in player).

|-

| SVG || Advanced || Allows to embed SVG.

|-

| MathML || Advanced || Allows to embed MathML.

|}

== List of Web based slideshows ==

== HTML(5) based slideshow ==

=== S5 ===

[[S5_(file_format)|S5]] (Simple Standards-Based Slide Show System) is an XHTML-based file format for defining [[slideshows|Slideshow]]

Line 77 ⟶ 132:

=== HTML5 Slides ===

http://code.google.com/p/html5slides/

A slide show template by Google using HTML 5 & CSS features. Using a [[Apache License 2.0]].

=== HTML5 Rocks ===

http://slides.html5rocks.com/#slide1