https://microformats.org/wiki/index.php?action=history&feed=atom&title=slides-examples 2026-04-19T02:24:00Z Revision history for this page on the wiki MediaWiki 1.38.4 https://microformats.org/wiki/index.php?title=slides-examples&diff=42843&oldid=prev 2010-07-14T22:45:25Z

<p><span dir="auto"><span class="autocomment">Presentation tools in HTML: </span> Opera Slideshow was incorporated into early versions of S5, whereas the inspiration for S5 came from a 2003 SXSW preso builtin HTML+CSS+JS</span></p> <table style="background-color: #fff; color: #202122;" data-mw="interface"> <col class="diff-marker" /> <col class="diff-content" /> <col class="diff-marker" /> <col class="diff-content" /> <tr class="diff-title" lang="en"> <td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td> <td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 22:45, 14 July 2010</td> </tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l5">Line 5:</td> <td colspan="2" class="diff-lineno">Line 5:</td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>The following tools and sites offer some kind of HTML-based slides</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>The following tools and sites offer some kind of HTML-based slides</div></td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><br/></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><br/></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>* Opera [http://en.wikipedia.org/wiki/Opera_Show_Format. show format] (early <del style="font-weight: bold; text-decoration: none;">inspiration for </del>S5)</div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>* Opera [http://en.wikipedia.org/wiki/Opera_Show_Format. show format] (<ins style="font-weight: bold; text-decoration: none;">incorporated into </ins>early <ins style="font-weight: bold; text-decoration: none;">versions of </ins>S5)</div></td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* Dave Raggett's Slidey - [http://people.w3.org/~dsr/blog/?p=4 blog post], [http://xtech06.usefulinc.com/schedule/paper/1 XTech '06 paper], [http://www.w3.org/Talks/Tools/Slidy/ documentation]</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* Dave Raggett's Slidey - [http://people.w3.org/~dsr/blog/?p=4 blog post], [http://xtech06.usefulinc.com/schedule/paper/1 XTech '06 paper], [http://www.w3.org/Talks/Tools/Slidy/ documentation]</div></td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* Original Perl W3C Slidemaker - [http://www.w3.org/Talks/slidemaker/YYMMsub/ documentation], [http://dev.w3.org/cvsweb/slidemaker/ code]</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* Original Perl W3C Slidemaker - [http://www.w3.org/Talks/slidemaker/YYMMsub/ documentation], [http://dev.w3.org/cvsweb/slidemaker/ code]</div></td></tr> <tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l12">Line 12:</td> <td colspan="2" class="diff-lineno">Line 12:</td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://github.com/jakearchibald/jaffaSlides jaffaSlides]</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://github.com/jakearchibald/jaffaSlides jaffaSlides]</div></td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* From Google: [http://code.google.com/p/html5-slides/ html5-slides]; [http://slides.html5rocks.com/ example]</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* From Google: [http://code.google.com/p/html5-slides/ html5-slides]; [http://slides.html5rocks.com/ example]</div></td></tr> <tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del style="font-weight: bold; text-decoration: none;"></del></div></td><td colspan="2" class="diff-side-added"></td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><br/></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><br/></td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Related ==</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Related ==</div></td></tr> </table>

Tantek https://microformats.org/wiki/index.php?title=slides-examples&diff=42838&oldid=prev 2010-07-13T07:02:44Z

<p>pretty raw list of HTML-producing tools/sites, plus related XML tools and formats</p> <p><b>New page</b></p><div>== Presentation tools in HTML ==<br /> <br /> This page collects real world examples, to support work on HTML conventions for slides. The main focus so far has been [http://meyerweb.com/eric/tools/s5/ S5]. See the [[s5-tools]] entry for more details.<br /> <br /> The following tools and sites offer some kind of HTML-based slides<br /> <br /> * Opera [http://en.wikipedia.org/wiki/Opera_Show_Format. show format] (early inspiration for S5)<br /> * Dave Raggett's Slidey - [http://people.w3.org/~dsr/blog/?p=4 blog post], [http://xtech06.usefulinc.com/schedule/paper/1 XTech '06 paper], [http://www.w3.org/Talks/Tools/Slidy/ documentation]<br /> * Original Perl W3C Slidemaker - [http://www.w3.org/Talks/slidemaker/YYMMsub/ documentation], [http://dev.w3.org/cvsweb/slidemaker/ code]<br /> * Apple's [http://en.wikipedia.org/wiki/Keynote_(presentation_software) Keynote] software has PNG-based HTML &quot;export&quot;; see also [http://www.xmlhack.com/read.php?item=1865 initial 2003 reactions]<br /> * [http://www.scribd.com/doc/30964170/Scribd-in-HTML5 Scribd in HTML5]<br /> * [http://github.com/jakearchibald/jaffaSlides jaffaSlides]<br /> * From Google: [http://code.google.com/p/html5-slides/ html5-slides]; [http://slides.html5rocks.com/ example]<br /> <br /> <br /> == Related ==<br /> <br /> * [http://www.zveno.com/open_source/keynoteslides.html Docbook to Apple Keynote] XSLT<br /> * [http://www.macosxhints.com/article.php?story=20030323092127481 more on Keynote XML format (APXL)]<br /> * ...more: [http://www.mulberrytech.com/walkthewalk.html Mulberrytech's list of XML-based presentation tools]</div>

Danbri