DOCTYPE声明必须位于HTML文档最顶部，使用<!DOCTYPE html>确保浏览器标准模式渲染；2. HTML文档由<html>、<head>和<body>组成，<head>中设置字符集、视口、标题等元信息；3. 推荐使用语义化标签并正确闭合，提升可读性与可访问性。
HTML文件的基本结构是构建网页的起点，一个规范的HTML文档不仅有助于浏览器正确解析内容，也有利于搜索引擎优化和代码维护。下面介绍标准HTML文档的基础结构以及DOCTYPE声明的正确使用方法。
DOCTYPE声明的作用与写法
DOCTYPE（Document Type Declaration）不是HTML标签，而是告知浏览器当前文档使用哪种HTML版本的标准。现代网页普遍采用HTML5，其声明方式极为简洁：
<!DOCTYPE html>这行代码必须位于HTML文档的最顶部，前面不能有任何内容（包括注释或空格），否则会触发浏览器的怪异模式（Quirks Mode），导致页面渲染异常。
HTML文档的基本结构组成
一个完整的HTML文档通常包含以下几个核心部分：
立即学习“前端免费学习笔记（深入）”；
- <html>：根元素，所有其他元素都嵌套在其中，通常带有lang属性指定语言，如 lang="zh-CN"
- <head>：包含页面的元数据，如字符集声明、页面标题、外部资源链接等
- <body>：包含所有在页面上可见的内容，如文本、图片、链接等
典型结构示例如下：
<!DOCTYPE html><html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>页面标题</title>
</head>
<body>
<h1>欢迎来到我的网页</h1>
<p>这是一个段落。</p>
</body>
</html>
head区域的关键元信息设置
<head>中的内容不直接显示在页面上，但对页面功能至关重要。常用标签包括：
- <meta charset="UTF-8">：声明文档使用UTF-8字符编码，避免中文乱码
- <meta name="viewport" content="width=device-width, initial-scale=1.0">：用于响应式设计，确保页面在移动设备上正常显示
- <title>：定义浏览器标签页上显示的标题，影响SEO
- <link>：引入外部CSS文件
- <script>：引入或编写JavaScript代码（可放在body底部）
注意事项与最佳实践
编写HTML文档时，注意以下几点能提升代码质量：
- 始终以 <!DOCTYPE html> 开头，确保标准模式渲染
- 使用语义化标签（如 header、nav、main、article、footer）增强可读性和可访问性
- 保持标签闭合和嵌套正确，避免结构混乱
- 为html标签添加lang属性，帮助屏幕阅读器识别语言
