如何编写一个良好的 index.html 文件

主要观点：每个 Web 开发者在开始新项目时都面临创建index.html文件的困境，常需回忆头部标签的用法。作者近期也处于此情况，深入研究了 HTML 头部标签，包括必含和可选的标签，还提供了自己的 HTML 起始模板及相关解释，并给出了一些资源供参考。
关键信息：

必含标签：<!DOCTYPE html>和lang="en"设置文档类型和语言；<title>为页面标题；<meta name="viewport">配置响应式设计的视口；<meta name="description">、<meta name="keywords">、<meta name="author">提供重要信息；<link rel="canonical">避免重复索引；CSS 加载策略（临界内联 CSS 与外部样式表）；<script>脚本加载最佳实践（type="module"、async属性及服务工作者注册）。
可选标签：<meta charset="utf-8">指定字符编码（默认已在 HTML5 中）；<base href="/">定义基础 URL；<meta name="application-name">定义应用程序名称；<meta name="theme-color">设置浏览器 UI 主题颜色；<meta name="color-scheme">支持明暗模式；<meta property="og:">进行社交媒体集成；<link rel="manifest">和<link rel="icon">支持 PWA 和设置 favicon；<link rel="alternate">用于替代内容类型；<link rel="preload">、<link rel="preconnect">、<link rel="prefetch">进行资源优化。
模板及资源：提供包含index.html和index-commented.html的 GitHub 仓库链接，以及其他关于 HTML 头部标签的学习资源，如 Mozilla、web.dev、The Open Graph Protocol、Web App Manifest specification 等。
重要细节：详细说明了各标签的作用、用法及参数含义，如viewport参数的具体功能等；提及模板的主观性，欢迎反馈和建议；介绍不同加载策略的优势和适用场景等。