HTML Slidy

最近時々ですが、パワーポイントでなく、htmlでパワーポイントのような動きをするプレゼンテーション資料を見かけます。
なんだこれは、と思ってたらW3C謹製のHTML Slidyというツールだと判明。
javascript + css + xhtmlという代物。早速使ってみることに。以下手順です。


1.W3Cよりスタイルシート2種とjavascriptファイルをダウンロード。
2.W3Cのページよりテンプレートファイルをコピペして雛形として使用。
3.適当にスライドを記述。
4.動作確認

1.cssファイルとjavascriptファイルのダウンロード

http://www.w3.org/Talks/Tools/Slidy/#(1)にアクセスし、
show.cssとprint.cssをダウンロードし、ローカルPCの任意のフォルダに保存。
slidy.jsをダウンロードし、同じフォルダに保存。

2.ファイルの作成

同じくhttp://www.w3.org/Talks/Tools/Slidy/#(1)にアクセスし、xhtmlの記述をそのままコピペし、適当な名前をつけたhtmlファイルを作成。

3.内容の記述

<div class="slide">...</div>

を記述するとこれがスライド1枚になるらしいので、3ページ分作成。

4.動作確認

動かーん。slidy.jsでエラーでとるがな。。
slidy.jsの多言語化対応しているあたりで発生している模様。
ちょっとはまってしまいましたが、原因はhtmlファイルがShift-JISで保存されていたこと。UTF-8で保存し直し、再度実行すると無事動作しました。

あとは、cssをいじって見た目をきれいにしないと。そのままだと真っ白で味気ないので。
しかしまぁ、CSSやHTMLの知識が無い人には使えませんなぁ。