Want to read Slashdot from your mobile device? Point it at m.slashdot.org and keep reading!


Forgot your password?
GUI Software Programming The Internet IT Technology

Standards-Based CSS/XHTML Slide Show 175

sootman writes "Eric Meyer, the man behind the famous Complex Spiral (CSS) Demo page, is at it again. He has created S5, "a slide show format based entirely on XHTML, CSS, and JavaScript." As he says, "With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible." So it can be used for PowerPoint-like work and the show responds to a variety of input--you can go to the next slide by pressing Return, Right, Space, etc. It is being released under a Creative Commons license. So fire up our favorite standards-compliant browser and check it out!"
This discussion has been archived. No new comments can be posted.

Standards-Based CSS/XHTML Slide Show

Comments Filter:
  • copy/paste (Score:4, Informative)

    by Anonymous Coward on Tuesday November 02, 2004 @10:57PM (#10706883)
    Here's a paste of the homepage, since it's totally slashdotted.

    S5: A Simple Standards-Based Slide Show System

    S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible. Anyone with even a smidgen of familiarity with HTML or XHTML can look at the markup and figure out how to adapt it to their particular needs. Anyone familiar with CSS can create their own slide show theme. It's totally simple, and it's totally standards-driven.

    As a bonus, its markup is compatible with the Opera Show Format, and S5 is engineered to be displayed using Opera Show when a presenation is run using Opera.

    If you'd like to see S5 in action, go ahead and run through the introductory slide show [meyerweb.com] (also available as an 95KB ZIP archive [meyerweb.com], the size of which is due to the presence of several images in the slide show). Feel free to try any of the features. For example, you can hit the space bar to advance to the next slide. Or use the right arrow, the down arrow, hit Return... any of these will work. The other features will be explained in, or else demonstrated by, the slide show itself.

    If you like the general idea of S5 but don't like the theme used for the intorductory slide show, then fear not: there are already a number of themes [meyerweb.com] available, and you can of course always create your own.

    If you have a hankerin' to know more about how this system works, exactly, we have a few resources that might help.

    • A Basic Primer in Using S5 [meyerweb.com] pretty much what it sounds like.
    • S5 Reference [meyerweb.com] a full reference describing what markup is required, what is recommended, and what is optional in an S5 presentation file.
    • Minimal S5 Structure [meyerweb.com] a guide to the absolute bare minimum markup used in an S5 slide file.
    • S5 File Map [meyerweb.com] explains what files are where, and what each one does.
    • S5 FAQ [meyerweb.com] it may not answer all your questions, but it will answer the common ones. The uncommon ones you'll have to send in.

    Please also visit the thanks and acknowledgments [meyerweb.com] page, which lists the people who helped improve S5 beyond what I ever could have done myself.

  • by xmas2003 ( 739875 ) on Tuesday November 02, 2004 @10:58PM (#10706888) Homepage
    Since it appears to be /.'ed, here a Google Cache of the Demo Page [] and the S5 page []
  • Mirror (Score:5, Informative)

    by dancedance ( 600701 ) on Tuesday November 02, 2004 @11:01PM (#10706895)
    Here is a mirror [geocities.com] of the zip file that you can test locally.
  • Mirror of demo .zip (Score:4, Informative)

    by timothv ( 730957 ) on Tuesday November 02, 2004 @11:01PM (#10706897)
  • by bheer ( 633842 ) <rbheer.gmail@com> on Tuesday November 02, 2004 @11:06PM (#10706916)
    ... in case they want a GUI to create those presentations. CityDesk's free edition [joelonsoftware.com] is enough for most presentations.
  • Dynamic Drive (Score:5, Informative)

    by cloudless.net ( 629916 ) on Tuesday November 02, 2004 @11:14PM (#10706944) Homepage
    I always use Dynamic Drive [dynamicdrive.com] as a repository of useful DHTML scripts, including slide-show scripts that work with multiple browsers.
  • by Wizarth ( 785742 ) on Tuesday November 02, 2004 @11:25PM (#10706982) Homepage
    I beleive Slashdot is standards compliant. HTML 3.2, according to its !DOCTYPE.
    Now if only some-one could come up with a HTML 3.2 standards compliant browser.
    More standards support, I say! (Yes, I use FireFox)
  • OO.o Impress? (Score:2, Informative)

    by xxx_Birdman_xxx ( 676056 ) on Tuesday November 02, 2004 @11:39PM (#10707070)
    I always like standards. Esp anything to do with CSS and the web.
    Im not exactly sure of a reason to develop this standard though. I've been using the latest version of OpenOffice's Impress to do all my presentations for my uni projects. I've found it really easy to use.. maybe a little easier than Powerpoint. I know its more a clone of PP than anything revolutionary, but it stores its presentations in an OPEN format. It works great, and is also has very few problems when converting to a powerpoint slide (im not doing anything complicated, but I've had no trouble).
    And it does the scaling of text and graphics really well which this standard (from a previous comment) doesn't really handle... I think Eric Meyer's work is awesome, but is this something that is actually really needed, or is it just an example of a clever combination of existing technologies together?
  • by jeti ( 105266 ) on Wednesday November 03, 2004 @03:00AM (#10708223) Homepage
    For my presentations at university, I implemented my own HtmlPresenter [radialthinking.de] this spring. If you're curious how a more basic implementation looks like, or want to use a more simple system, be welcome to use it.

    I hereby put it into the public domain.
  • LaTeX (Score:5, Informative)

    by Noksagt ( 69097 ) on Wednesday November 03, 2004 @03:32AM (#10708348) Homepage
    It does almost make me feel like a barbarian for using beamer [sourceforge.net] under LaTeX. Many alternative LaTeX styles/classes exist (prosper, HA-prosper, seminar, slide, etc. They are mature and elegant. The resulting PDFs are attractive because they are single-file-per-presentation solutions that are cross-platform and adhere to an open standard (xpdf is a great viewer!). S5 would need additional files for images, style sheets, etc.

    Those who use LaTeX should check out beamer--the table of contents is quite intelligent & they are easily theamable & have already solved many things that S5 is only planning to include.
  • by Mant ( 578427 ) on Wednesday November 03, 2004 @05:58AM (#10708795) Homepage

    You believe wrong, it isn't even compliant 3.2. Run it through a validator and watch all the problems it shows.

  • by Anonymous Coward on Wednesday November 03, 2004 @07:59AM (#10709055)

    Okay, I like and respect Eric Meyer. But I'm getting fed up with all of this bullshit about standards. XHTML and CSS are not standards. Javascript's syntax has been standardised by ECMA-262, but the objects this slide show (and practically every bit of Javascript on the web) uses are outside the scope of that standard.

    Sure, it's nice, clean code. And it conforms to the W3C's specifications where they are applicable. But this isn't "standards-based" at all. If it were, it would be based around ISO-HTML, the only form of HTML that has been standardised, and not XHTML.

    The W3C are not a standards body. That's why their specifications are entitled "recommendations". Tim Berners-Lee deliberately avoided setting up the W3C as a standards body.

    When people talk about "web standards", they are either ignorant or are trying to elevate the W3C's specifications as more authoritative than they actually are. Eric Meyer is not ignorant, which makes his proclamations about "web standards" rather deceptive. "Web standards" has become nothing short of a buzzword designed to con PHBs.

  • by Anonymous Coward on Wednesday November 03, 2004 @08:04AM (#10709068)

    I beleive Slashdot is standards compliant. HTML 3.2, according to its !DOCTYPE.

    Even if it adhered to the HTML 3.2 specification (which it doesn't), that wouldn't make Slashdot standards compliant. HTML 3.2 isn't a standard.

  • Re:And (Score:2, Informative)

    by ptlis ( 772434 ) on Wednesday November 03, 2004 @08:28AM (#10709187) Homepage
    Actually, yes it does. It takes some time (when compared to Opera and Firefox) to move onto the next slide but it's fully functional; I have a presentation to do for one of my uni modules and I was not looking forward to doing it in Powerpoint, it now looks like I wont have too. This makes me very happy.
  • Re:And (Score:3, Informative)

    by namekuseijin ( 604504 ) on Wednesday November 03, 2004 @08:38AM (#10709229)
    Sorry to burst your bubble, but it does work in IE, at least the latest XP patched one. Except for some minor alignment issues, it looks almost as good as in Firefox and behaves exactly the same. Which is amazing given that Microsoft knows CSS + XHTML is a serious threat for their proprietary publishing/formatting office softwares and so doesn't do much to support it.
  • by ptlis ( 772434 ) on Wednesday November 03, 2004 @08:48AM (#10709286) Homepage
    Works perfectly in IE6.
  • Coral P2P cache (Score:2, Informative)

    by benad ( 308052 ) * on Wednesday November 03, 2004 @09:36AM (#10709572) Homepage Journal
    http://www.meyerweb.com.nyud.net:8090/eric/tools/s 5/ [nyud.net]
    You guys should stop using the google cache and use Coral caches [nyu.edu] instead.
  • by Penguin ( 4919 ) on Wednesday November 03, 2004 @09:40AM (#10709600) Homepage
    Strictly on a side note (not advocating for or against the use of PDF):

    Acrobat Reader 6 under Windows can easily be changed to launch really quick, if one "disables" all the useless plugins:

    1. Enter the Reader-folder.
    2. Create a backup-folder, named e.g. "plug_ins_disabled"
    3. Move all files from the "plug_ins"-folder, except "EWH32.api", "printme.api" og "Search.api" to the new folder.
    3b. Alternatively, just delete all files in the "plug_ins"-folder - again, with the exception of the above three files.

    Open a PDF and get amazed :)

    (some of the "useless" plugins are stuff like reading encrypted pdfs - that and other features might not exist if the related plugin is removed... I haven't had any problems, though, through ordinary use for the last six months after removing all these plugin-files)
  • by 0xDEADC0DE ( 130071 ) on Wednesday November 03, 2004 @12:50PM (#10711454)
    Slashdot readers who like S5 may also like sstree, the super-simple xhtml+css+js tree widget. http://sstree.tigris.org/

1 Mole = 007 Secret Agents