HTML 课程 | 构建主要内容 - 第 3 节

什么是主要内容？

在 HTML 页面中，主要内容通常指的是文本、图片、视频、音频等重要的元素，用于传达网页的主要信息和功能。合理的构建主要内容能够提高网页的用户体验和搜索引擎优化（SEO）。

如何构建主要内容？

定义主要内容

在 HTML 页面中，可以使用<main>标签来定义主要内容区域。<main>标签应该包含页面的核心内容，应该只在每个页面中使用一次。

<main>
  <h1>网页标题</h1>
  <p>这里是主要内容</p>
  <img src="image.jpg">
</main>

结构良好

良好的结构可以帮助搜索引擎更好地理解页面的主要内容。使用标题标签（<h1> - <h6>）来标记内容的层次结构，以及段落标签（<p>）来组织文本内容。

# 网页标题

## 第一部分

### 小标题1

段落1

### 小标题2

段落2

## 第二部分

### 小标题3

段落3

### 小标题4

段落4

图像空间

图像占用大量的空间，如果不加以控制，会导致页面加载缓慢。将图像压缩并使用适当的尺寸可以提高加载速度。

<img src="image.jpg" alt="这是一张图片" width="500" height="300">

视频和音频

在页面上嵌入视频和音频可以增强页面的多媒体性。使用<video>和<audio>标签可以实现嵌入功能。

<video width="320" height="240" controls>
  <source src="video.mp4" type="video/mp4">
  <source src="video.ogg" type="video/ogg">
  您的浏览器不支持HTML5视频。
</video>

<audio controls>
  <source src="music.mp3" type="audio/mpeg">
  <source src="music.ogg" type="audio/ogg">
  您的浏览器不支持HTML5音频。
</audio>

总结

构建好的主要内容区域可以提高用户体验和SEO，可通过定义主要内容、良好的结构、优化图像和嵌入多媒体实现。