HTML

HTML文档结构是网页基础框架，本文详解DOCTYPE声明、html/head/body结构及meta标签配置。

HTML标签是构建网页的基础单元，本文详解标签语法、元素构成及核心规则。

HTML列表与表格用于组织结构化数据，本文详解无序列表、有序列表、定义列表及表格标签用法。

HTML图像与链接是网页核心元素，本文详解img标签、a标签的属性用法及最佳实践。

HTML文本格式化标签用于定义文字显示样式，包括加粗、斜体、下划线、删除线等常用格式。

HTML表单是用户交互的核心组件，本文详解表单结构、输入类型、表单属性及验证机制。

HTML5语义化标签清晰描述页面结构，提升可访问性与SEO，本文详解常用语义标签用法。

HTML5引入众多新特性，包括语义化标签、原生多媒体、表单增强、Canvas绘图、本地存储等重大改进。

HTML文档结构是网页的基础框架，本文详解DOCTYPE声明、html/head/body三大核心标签及meta配置。

HTML多媒体标签支持音视频播放，本文详解video/audio标签属性、嵌入方式及最佳实践。

HTML常用标签是网页开发的基础组件，本文详解文本、链接、图片、列表、容器等高频使用标签。

HTML表单是用户数据收集的核心组件，本文详解form标签结构、input类型、表单验证及提交机制。

HTML表格用于展示结构化数据，本文详解表格结构、单元格合并、语义化标签及样式优化方法。

HTML5语义化标签清晰描述内容含义，提升SEO效果和可访问性，本文详解header/nav/main/article等语义标签用法。

HTML属性为元素提供附加信息，本文详解属性基本语法、分类规则及核心概念。

HTML元素特有属性针对特定标签生效，本文详解常用元素的专属属性及其用法。

HTML全局属性可应用于所有元素，本文详解id、class、style、title等核心全局属性用法。

HTML属性值需正确使用引号与转义，本文详解属性值写法规则、引号嵌套及特殊字符转义方法。

HTML布尔属性表示开关状态，有则生效、无则不生效，本文详解常用布尔属性及写法规则。

HTML5自定义属性data-*用于在元素上存储额外数据，通过datasetAPI可便捷访问，是前后端数据传递的常用方式。

HTML提交按钮用于触发表单数据提交，本文详解button与input按钮类型、属性配置及使用场景。

HTML表单属性控制数据提交方式与验证行为，本文详解action/method/enctype等核心属性及配置规则。

HTML表单相关标签包括form、fieldset、legend、label等，用于构建完整表单结构并提升可访问性。

HTML输入元素input是最常用的表单控件，本文详解各type类型、核心属性及输入验证机制。

HTML语义化标签让代码更具含义，本文详解语义化概念、核心标签分类及基本使用方法。

HTML5常用语义化元素包括header/nav/main/article等，本文详解各标签用途、嵌套规则及实际应用。

HTML语义化带来SEO优化、可访问性提升、代码可读性增强等多重优势，是现代前端开发的最佳实践。

:valid和:invalid伪类根据表单元素的验证状态自动应用样式，实现无需JavaScript的实时视觉反馈。

checkValidity检查验证状态返回布尔值，reportValidity检查并显示错误提示，两者用于手动触发表单验证。

minlength和maxlength属性限制文本输入的字符长度范围，配合原生验证自动校验输入长度。

min和max属性用于限制数值、日期等类型输入框的取值范围，配合原生表单验证实现自动校验。

novalidate属性禁止表单的原生验证，允许直接提交未通过验证的表单，适用于需要自定义验证逻辑的场景。

pattern属性使用正则表达式验证文本输入，配合title属性提示规则，实现灵活的自定义格式校验。

required属性标记表单字段为必填项，提交时自动验证是否为空，是最基础的原生验证方式。

setCustomValidity方法用于设置自定义验证错误信息，配合validity.customError属性实现灵活的业务校验逻辑。

HTML5新增的email、url、tel等输入类型，配合type属性实现自动格式验证，无需手写正则表达式。

validity对象是表单元素的验证状态对象，包含多个布尔属性，用于精确判断具体的验证失败原因。

HTML5原生表单验证属性详解，包括required、pattern、min、max、step的使用方法及验证提示定制。

HTML表单提交机制详解，包括method方法、enctype编码类型、target目标窗口及表单提交流程控制。

HTML5输入类型验证属性详解，包括email、url、tel、number、date等类型的内置验证机制与用法。

HTML表单高级控件详解，包括datalist数据列表、output输出、fieldset分组及legend标题的使用方法。

SVG矢量图形核心技术，包括内联语法、路径绑定、渐变滤镜、动画系统及与Canvas对比，实现高质量可交互图形。

HTML iframe嵌入技术详解，包括基本用法、安全属性配置、跨域通信及embed/object等嵌入方式。

响应式多媒体核心技术，包括图片自适应、视频响应式布局、媒体查询适配及性能优化策略。

HTML中图像嵌入的核心方法，包括img标签基本用法、响应式图片、图片格式选择及性能优化技巧。

HTML5原生视频与音频嵌入技术，包括video和audio标签用法、格式兼容性、控件定制及高级功能配置。

JavaScript动态操作CSS样式和类名是常见需求，本文详解style属性、classList API及样式计算方法。

DOM树是HTML文档的节点结构，本文详解节点类型、创建/插入/删除/替换操作及节点属性管理。

JavaScript DOM遍历与选择器API提供灵活的元素查询方式，本文详解querySelector、遍历属性及节点导航方法。

JavaScript事件机制是浏览器交互的核心，本文详解事件流模型、事件对象、事件委托及绑定方式。

JavaScript定时器与动画帧API用于延时执行和动画控制，本文详解setTimeout/setInterval/requestAnimationFrame用法及最佳实践。

Web本地存储提供客户端数据持久化能力，本文详解localStorage/sessionStorage/Cookie的差异与使用方法。

BOM提供浏览器窗口交互能力，本文详解window对象核心属性、screen/location/history/navigation等API用法。

Fetch API是现代浏览器网络请求标准，本文详解fetch用法、请求配置、响应处理及错误处理机制。

HTML语义化标签figure、figcaption、details、summary的用法，提升文档结构与可访问性。

HTML meta元数据标签详解，包括字符编码、视口设置、SEO优化、社交分享等核心配置。

HTML全局属性与data-*自定义属性详解，包括id/class/style、事件属性、aria属性及dataset使用方法。

HTML实体编码与字符引用详解，包括特殊字符转义、常用实体符号、数字引用及使用场景。

HTML语义化增强标签time、mark、wbr、bdi、bdo的用法，提升内容语义化与可访问性。

HTML link和script标签详解，包括资源加载、CSS引入、JavaScript执行、预加载优化等核心用法。

ARIA（Accessible Rich Internet Applications）为HTML提供无障碍属性扩展，通过角色、状态、属性帮助辅助技术理解复杂交互组件。

JSON-LD（JSON for Linking Data）是W3C推荐的语义数据格式，以JSON结构表达链接数据，是搜索引擎首选的结构化数据方案。

RDFa（RDF in Attributes）是将RDF语义数据嵌入HTML属性的标准方法，提供完整的三元组语义表达能力。

Schema.org是由Google、Bing、Yandex等联合创建的结构化数据词汇表，提供统一的语义词汇定义，覆盖数百种实体类型。

微格式（Microformats）是嵌入HTML中的轻量级语义标记，通过CSS类名表达结构化信息，适合人物、事件、联系方式等数据。

结构化数据标记从语义化视角理解，是将页面内容转化为机器可理解的标准化语义表达，实现内容与数据的语义统一。

语义化导航使用正确的HTML结构和ARIA属性构建导航系统，帮助用户和辅助技术理解导航层级和关系。

语义化表单使用正确的HTML标签和属性构建表单结构，提升可访问性、用户体验和表单验证能力。

语义化表格使用正确的HTML标签构建数据表格结构，通过表头关联、分组、摘要等方式提升可访问性和数据可读性。

代码拆分是提升页面加载性能的核心策略，通过按需加载减少首屏资源体积，加快页面渲染速度。

关键渲染路径决定首屏渲染速度，通过优化 DOM 构建、CSSOM 生成和渲染树，加速页面首次渲染。

HTTP 请求数量直接影响页面加载性能，通过资源合并、内联、精灵图等技术减少请求次数。

异步加载通过延迟非关键资源加载时机，优先保障首屏渲染，显著提升页面加载体验。

预加载和预连接通过提前建立连接和加载资源，减少网络延迟，显著提升页面加载性能。

HTML5 video 标签原生支持视频播放，通过属性控制自动播放、循环、静音、预加载等行为，配合 source 元素实现多格式兼容。

HTML5 audio 标签提供原生音频播放能力，支持多格式、预加载控制、JavaScript API，是嵌入音频内容的标准方式。

SVG 和 Canvas 是 HTML5 图形绘制的两大核心技术，SVG 适合矢量图形，Canvas 适合位图绑定和游戏开发，各有应用场景。

iframe 用于嵌入外部网页内容，通过 sandbox、srcdoc、postMessage 等特性实现安全可控的跨域内容嵌入与通信。

响应式多媒体嵌入技术确保视频、音频在不同设备上自适应显示，提升用户体验并满足移动优先的SEO要求。

object 和 embed 标签用于嵌入外部内容如PDF、Flash、插件等，在现代Web中逐渐被更安全的标准替代，但仍需了解其用法。

无障碍多媒体嵌入确保视频、音频内容对所有用户可访问，包括字幕、描述性音频、键盘控制等WCAG合规实践。

SEO元标签包括title、description、robots、canonical等，是控制搜索引擎抓取、索引、展示的核心配置。

SEO友好的URL结构应简洁、可读、包含关键词，便于搜索引擎理解和用户记忆，是页面优化的基础环节。

内部链接是连接网站页面的纽带，合理的内链结构能提升页面权重传递效率、改善爬虫抓取、增强用户体验。

图片SEO优化包括格式选择、尺寸控制、Alt属性编写，能提升图片搜索排名、加快页面加载、改善无障碍体验。

标题标签（h1-h6）的层级结构对SEO至关重要，合理的层级帮助搜索引擎理解页面内容架构和重点。

结构化数据标记（Schema.org）帮助搜索引擎理解页面内容，提升搜索结果展示效果，是现代SEO的重要技术手段。

语义化HTML通过使用具有明确含义的标签构建页面结构，提升搜索引擎理解能力与页面可访问性，是SEO优化的基础实践。