📄
HTML5 模板生成
勾选 viewport、favicon、OG、CSS reset 等,一键生成规范的 HTML5 起始模板。
本地处理 · 不上传
加载工具中…
相关:html · boilerplate · 模板 · 起始 · head · meta
HTML5 模板生成按需勾选视口设置、字符集、SEO 标签、favicon 与常见 meta,生成一份可直接使用的页面骨架。
使用步骤
- 勾选需要的部分
- 填写标题与描述
- 查看生成的完整 HTML
- 复制作为新页面起点
使用场景
- 快速起一个新页面
- 确认 head 中该有哪些必要标签
- 为原型或演示页准备骨架
- 检查现有页面是否遗漏关键标签
小贴士
- charset 必须放在 head 的最前面(前 1024 字节内),否则浏览器可能已按错误编码解析了部分内容。
- 移动端必须有 viewport 标签,否则页面会按桌面宽度渲染再缩小,文字小到看不清。
- lang 属性影响屏幕阅读器的发音选择与浏览器的翻译提示,中文页面应写 zh-CN 而非留空。
常见问题
charset 为什么要放最前面?
浏览器在读到 charset 声明前会先按默认编码猜测解析。声明放得太靠后,前面的内容已经被错误解码,页面开头就会出现乱码。
viewport 该怎么写?
`width=device-width, initial-scale=1` 是标准写法。不要加 user-scalable=no 禁止缩放,那会妨碍视力不佳的用户,属于无障碍问题。
还需要 XHTML 那套声明吗?
不需要。HTML5 的文档类型声明就是简单的 `<!DOCTYPE html>`,早期那些冗长的 DTD 声明已经完全过时。
HTML5 模板生成是免费的吗?
是。本站所有工具完全免费,无需注册登录、无广告干扰,打开即用。
使用HTML5 模板生成,我的数据安全吗?
安全。该工具在你的浏览器本地完成处理,输入内容不会上传到服务器,隐私更有保障。