There are a bunch of tools in this directory and elsewhere for making slides using standards:
The current recommendation (2005/5) is to use Dave Raggett's slideshow tool HTML Slidy, with its accompanying style sheet. If you are a member of the W3C staff, you must add a W3C icon. Some reasons for doing it this way:
Some example talks of various vintages:
It should include the following:
For W3C staff members, talks must include the W3C icon. The head of the document will therefore include altogether:
There are more details on the HTML Slidy page.
If yours slides are on the www.w3.org server, make the paths relative such as ../../../2005/03 and so on, so they can be used in checked out CVS file space.
Each slide has to be wrapped in
<div class="slide"> ...
If you have an existing talk using the earlier slideme tools, then
you use the
,slideme comma tool to convert it automatically.
Just append ",slideme" after "all.htm" for your slideme base file.
Alternatively, you can do a global change of all
</div><div class="slide"><h1> and then fix up
the first and last slides by deleting the extra
the top and putting in the missing one at the bottom.
This can be done. You just have to be careful to preserve the divs. You can move slides around, by pressing ESC until you have a whole slide selected, cutting it, and then pasting it in between two slides (i.e. not in a div). Note that if you accidentally put text in which is not in a slide division, it will appear in all slides!
The traditional W3C slide format doesn't use DIVs around each slide, instead each H1 starts a slide. The styles for slidemaker & slideme rely on that format. The b6+ script is an alternative to Slidy and can be used on slides both with and without DIVs. Its function is to emulate projection mode on browsers that don't support it yet.
To use the b6+ script, include something like the following:
There is also a b6 style sheet, which is the slide style for W3C's MMI and Mobile activities:
<link href="../Tools/b6/b6.css"> rel=stylesheet media=projection>
The b6+ script is an enhanced version of the b6 script, which is in turn an improved version of b5. B5 works on older browsers (before 2012). b6 uses some newer CSS features. B6+ is like b6, but adds compatibility (within limits) with style sheets written for the Shower framework. It also adds the possibility to make slides with a fixed aspect ratio (i.e., independent of the projector).
See “The W3C slide style (b6+)” for documentation on using the generic W3C style together with b6+, see the b6+ documentation for more info on the b6+ script itself, and see b6 for the MMI theme for b6/b6+.
Some examples of b6 in use: CEO Overview [member only] (Jeff, 2018, design by Tanya Mandal), A handful of typographic challenges (Bert, 2014, white on black) Complex layouts (Bert, 2012, different colors).
The traditional W3C style for slides consists of three style sheets:
There must be no DIV around the slides and each H1 starts a new slide. See “How to make slides with the W3C style” for documentation.
For more info, see the documentation on slidemaker and the documentation on slideme. (Slideme is a version of slidemaker that is only available to the W3C Team.)
Shower is an HTML5 presentation engine made by Vadim Makeev (Opera Software). It comes with two built-in themes and was used for Jeff's presentations at the AC Meeting 2014 to a good response and later at TPAC 2018 with a style based on the TPAC 2018 pages.
We have a generic style for W3C presentations. It includes some predefined classes for common types of slides and comes with a user manual and a zip file for offline use.
You can also use the b6+ framework with the same style sheet and the same HTML files.
There is also an older style, based on the built-in ribbon style of Shower:
In fact, a copy of the shower code, including the W3C style, has also been placed into
/2014/shower/, and the
index-w3c.html has also been added to show the HTML code and as a starting point. That means another way of using shower is to use
<script src="/2014/shower/shower/shower.min.js"> (at the very end of the file). Using this approach means that one can save the trouble of copying the whole shower library all the time, although be aware that it may not be the latest version.
Reveal.js is another HTML5 presentation engine made by Hakim El Hattab. It comes with a selection of themes and has fancy slide transitions. It also allows you to move slides vertically rather than just horizontally. There are two W3C themes — light and dark.
"css/theme/w3c.css", depending on which theme you prefer.
There is also a copy of reveal.js at
/2013/06/revealjs/ which can be used to avoid re-uploading the core files, but be aware that it may not be the latest version.
Last change $Id: Overview.html,v 1.43 2019/03/10 15:35:42 bbos Exp $Sign me