HTML幻灯片：用浏览器放映前，检查资源和备注显示

HTML幻灯片可以直接用浏览器打开，适合演示设备没有安装演示软件的场合。单个文件便于携带和分享，但能否离线使用，还取决于图片、字体和脚本是否保存在本地。上台前应在实际设备上断网试放一次。

为什么干脆用 HTML 文件来讲

主要是省去对特定演示软件的依赖。不过，缺少字体、浏览器功能差异和外部资源仍然可能影响显示。在准备使用的 Mac、Windows 电脑或 Chromebook 上试放，比只看自己电脑上的效果更可靠。

分享也方便。把文件丢到任意一个静态托管上，演示就成了一个链接，可以直接贴进群聊或会后的邮件里。别人在手机上点开就能看，不用装任何东西，前提是对方能访问页面和配套资源。

一份好用的HTML幻灯片需要什么

能在浏览器里打开只是第一步，拿它上台讲之前，还要检查翻页、备注和打印效果。

先试方向键和翻页笔，不要默认所有导出文件都支持同一组按键。再看备注显示在哪里：独立的演讲者视图可以区分讲者和观众画面，而 ToSlides 的 HTML 备注是在当前屏幕叠加显示，共享给观众时应关闭。最后检查打印预览，确认每页幻灯片没有被截断。

最后一项最常被跳过。把文件复制到另一个文件夹，断网，再打开。页面还是原样，说明它确实是单文件；要是字体退回了宋体或 Times，图片变成了裂开的小图标，那它其实一直在偷偷依赖别的东西。

Reveal.js、Marp、Slidev，以及导出文件的隐患

Reveal.js、Marp 和 Slidev 都能用于制作网页演示。Reveal.js 用 section 组织页面，Marp 从 Markdown 生成幻灯片，Slidev 基于 Vue。它们的导出结构和资源依赖不同，不能只看到扩展名是 HTML 就判断能单文件使用。

具体要看导出的 HTML 文件里包含哪些内容。Reveal.js 的演示通常要从单独的文件或 CDN 加载框架、主题和插件。Slidev 构建出来的是单页应用，HTML 本身往往只是个空壳，幻灯片要等 JavaScript 跑起来才出现。Marp 导出的 HTML 自包含得多，但用相对路径引用的图片还得跟着一起拷走。换到一台管得很严的电脑上，应提前确认需要的文件和网络访问都可用。

还要考虑后续维护。如果同事要继续改内容，应交接他们能使用的编辑格式，并保留源文件，不要只留下最终放映文件。

把现有的HTML幻灯片变成能编辑的版本

ToSlides 的 HTML 幻灯片编辑器就是为这种情况准备的。导入文件或者直接粘贴 HTML，解析都在你的浏览器里完成，不会上传。文件上限 5 MB、100 页。它能识别 ToSlides 或 EndTo 导出的 HTML、Reveal.js 的静态 section（纵向页会按阅读顺序展开，内嵌的 Markdown 和讲稿也会读进来）、Marp 导出的文件、含有实际页面的 Slidev 静态快照，以及其他有明确幻灯片容器的静态页面。

它不会执行原文件里的脚本。这是出于安全考虑，代价也很明确：复杂样式、脚本、动画、音视频和交互组件都不保证能保留。只有 JavaScript 外壳的 Slidev 单页应用没法还原，因为 HTML 里压根没有可读的幻灯片。远程 https 图片要你勾选允许后才会加载；用相对路径引用、但配套文件没一起给的图片，会单独提示出来，方便你补上。

导进来以后，内容就变成了 Markdown。可以改文字、修表格、改讲稿，换一套主题，再导出成单个 HTML 文件、可编辑的 PPTX，或者打印成 PDF。导出的 HTML 自带主题、键盘翻页、讲稿和打印样式。不过外链图片照样需要联网，要是打算离线演示，先把那几页检查一遍。

假设你接手了去年工作坊留下的一份 40 页 Reveal.js 演示，要改十几处日期。导入、在 Markdown 里改完、导出一个新文件，通常比把旧项目重新跑起来、找齐插件、回忆当初怎么构建要快。导入后仍要逐页核对，并判断丢失的样式和交互是否影响这次工作坊。

从零开始写一份

手上没有旧演示的话，导入这一步可以跳过。Markdown 幻灯片编辑器用 --- 分页，以 Note: 开头的行算作讲稿，导出的也是同样的单文件 HTML。正式上台前，用导出的那个文件完整排练一遍，而不是在编辑器里排练，因为站在台上时你面对的就是那个文件。

诚实说明：目前做不到什么

导入读取的是结构和文字，不是行为：不执行原文件的脚本，复杂样式、动画、音视频和交互可能丢失，只有 JavaScript 外壳的 Slidev 单页应用无法还原；导入上限 5 MB、100 页。导出这一侧，没有动画转场、动态图形，也没有拖拽排版画布，目前有四套主题；导出的 HTML 里，外链图片仍然需要联网才能显示。 备注使用当前屏幕的叠加层，没有独立的私密演讲者窗口。