Slashdot Mirror
Standards-Based CSS/XHTML Slide Show
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!"
No posts and already slashdotted.
Steal This Sig
First Slide
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 (also available as an 95KB ZIP archive, 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 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.
Please also visit the thanks and acknowledgments page, which lists the people who helped improve S5 beyond what I ever could have done myself.
Since it appears to be /.'ed, here a Google Cache of the Demo Page and the S5 page
Hulk SMASH Celiac Disease
Eric Meyer's site is always pretty interesting to watch, at least for web geeks like me (you know, the type who actually read the DTDs for the html and xhtml specs and play with css daily). S5 has been under development for awhile, and I hadnt gotten a chance to see it yet....
Of course, thanks to slashdot, looks like I'll have to wait till tomarrow
Here is a mirror of the zip file that you can test locally.
The .zip file containing the demo (95KB)
... in case they want a GUI to create those presentations. CityDesk's free edition is enough for most presentations.
Go somewhere random
Wow... the irony. Slashdot is talking about standards. Isn't it about time that /. itself should be standards compliant?
BTW, to make this comment on topic, the slideshow looks pretty decent, but I wouldn't consider this ground breaking stuff. Eric Krock (netscape technology evangelist) was doing these sort of presentations in the 1998/1999 timeframe.
Corporate Gadfly
Jonathan Archer: the most beaten up Enterprise captain in Star Trek history
This is an excellent example of the Web applications that Microsoft feared. Even though it is crude, and it has one killer limitation:
.. the html version looks far prettier on the web than powerpoint does.
* Fonts are not scaled based on display resolution and available pixels; manual CSS editing is required
And a massively annoying one:
* Only one author can be listed in the metadata
I'm not quite sure why the second limitation exists. But already this program does all of the important functions I need Powerpoint for, and it has one big advantage over powerpoint
I was highly intrigued to learn about Opera's powerpoint alternative and previous attempts in this direction. This may be the first web app that I use all the time.
I always use Dynamic Drive as a repository of useful DHTML scripts, including slide-show scripts that work with multiple browsers.
Also makes me wish Microsoft supported more of the CSS standard on IE. I've been using CSS since '99 and almost every interesting effect breaks in IE Win. Thankfully more Windows users are using alternative browsers for security reasons.
Now if only Slashdot would validate!
Not since Marie-Antoinette played milkmaid has looking simple and honest been so fake and complicated.
So I open it up and it's a normal looking web page that is well done and works great. When your browser lacks javascript (or it's turned off) it looks like any other well made page. This is probably why it prints well too. Then you turn on javascript (or in my case let the little security warning from IE that came with SP2 run the script) and it's just like looking at a powerpoint presentation of the exact same data. Add a few other sets of CSS stuff and you could make it also look great for a handheld (like a Palm or some such) that might not be able to display the webpage well (assuming they can't handle the powerpoint style part here).
And it's all just XHTML, CSS, and JavaScript. Amazing the things that can acomplish wihtout needing Java, ActiveX, Flash, a seperate viewer (like PowerPoint), etc.
When you get someone really skilled with some pieces of technology, it's amazing the stuff they can crank out.
I know the site is down (it was for me) but get a mirror of the zip file (there are ones in other comments) and check it out if you have even the tiniest interest in this.
Comment forecast: Bits of genius surrounded by a sea of mediocrity.
If OpenOffice built this into its presentation software. It would be nice if when you save your presentation you have the option to save as an XHTML document. This would dramatically reduce file size and allow OpenOffice to be used more widely (in my opinion) for some web applications. How hard could it be to port this format (since it is open) to OpenOffice? Any Volunteers?
I like Impress also. However, I don't like the way Impress saves to the web (files way too big). It would be nice to create more simple presentations for the web with smaller file sizes. I think this new format would fit that niche.
Well, technically perhaps but not really in spirit. You could certainly say I'm biased toward a certain view of how markup language *should* be used... But take a look at the slashdot html: Let's see, the Slashdot logo at the top, maybe call it a toplevel heading? Nope, it's table data. The headline above each article, perhaps we should call it a second level heading using? Nope, table data. The paragraph summary of each article? Table data.
It may be technically correct, but lying to my browser about what is contained within those tags annoys me somewhat. In my opinion, and in the opinion of many proponents of [X]HTML+CSS, Slashdot (like most other websites) abuses the markup language, defeating the entire purpose. For some websites, they might as well serve up pdfs.
There are also significant bandwith savings to be had as show by A List Apart which has been posted numerous times before.
Perhaps you should ask your software vendor to make a more standards compliant browser?
Well, duh, it's standards compliant.
Returned Peace Corps IT Volunteer
Can't Survive Slashdotting, apparently.
--- Asking inconvenient questions for over 30 years...
Slashdot is standards compliant. HTML 3.2 Other than the over 110 deviations on the main page, they are totally compliant.
Looks someone tried to create a standards compliant theme, in 2002. I haven't really investigated much to see where they finally got to, but looking at one of the comments make me wonder what the oldest browser /. should work in?
Jumpstart the tartan drive.
For my presentations at university, I implemented my own HtmlPresenter 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.
It does almost make me feel like a barbarian for using beamer 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.
I needed to create some slides last week for a presentation to my company's Best Practice group. After working out the actual content I wanted, it took me all of 20 minutes to create the content using s5.
Here's the final result: Introduction to CruiseControl
Mozilla users can switch to alternative stylesheets using the switcher on the status bar.
My business: Farstrider Studios.
You believe wrong, it isn't even compliant 3.2. Run it through a validator and watch all the problems it shows.
Slashdot has a "light" template which was probably originally intended for lynx and ilk. It uses headings reasonably sensibly, and I read slashdot with it using my user stylesheet.
An issue at this point, not just with slashdot but with all similar sites, is that there is no decent HTML construct for marking up threaded discussions, so you either get table/css hacks or (in the rare case that the author is a fanatic) you get nested ordered lists with the markers hidden in CSS, which just makes a mess in non-CSS browsers.
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.
I don't feel like it...
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)
- Peter Brodersen; professional nerd