<title>: 文档标题元素

基线 广泛可用

此功能已完善，可在许多设备和浏览器版本中使用。它在浏览器中可用，自 2015 年 7 月.

<title> HTML 元素定义文档的标题，该标题显示在 浏览器 的标题栏或页面的选项卡中。它仅包含文本；元素内的标签将被忽略。

html
<title>Grandma's Heavy Metal Festival Journal</title>

属性

此元素仅包含 全局属性.

使用说明

<title> 元素始终用于页面的 <head> 块中。

页面标题和 SEO

页面标题的内容可能会对搜索引擎优化 (SEO) 产生重大影响。一般来说，较长的描述性标题比短标题或通用标题效果更好。标题的内容是搜索引擎算法用来决定网页在搜索结果中排列顺序的组成部分之一。此外，标题是您抓住读者在浏览搜索结果页面时的注意力的第一个“钩子”。

撰写优质标题的几个指南和技巧

  • 避免使用一两个字的标题。使用描述性短语，或术语-定义对，用于词汇表或参考样式页面。
  • 搜索引擎通常会显示页面标题的前 55-60 个字符。超出该范围的文本可能会丢失，因此尽量不要让标题超过该长度。如果必须使用更长的标题，请确保重要部分在前面，并且没有关键内容在可能被删除的标题部分。
  • 不要使用“关键词堆砌”。如果您的标题只是一系列词语，算法通常会降低您页面在搜索结果中的排名。
  • 尽量确保您的标题在您自己的网站内尽可能独特。重复或近似重复的标题会导致搜索结果不准确。

无障碍

提供准确简洁的标题以描述页面的目的非常重要。

辅助技术用户常用的导航技巧是阅读页面标题并推断页面包含的内容。这是因为进入页面以确定其内容可能是一个耗时且可能令人困惑的过程。标题应该在网站的每个页面都独一无二，理想情况下，首先显示页面的主要目的，然后是网站的名称。遵循这种模式将有助于确保页面阅读器首先宣布页面的主要目的。与在访问网站的每个页面时都必须先听网站的名称再听唯一的页面标题相比，这提供了更好的体验。

示例

html
<title>Menu - Blue House Chinese Food - FoodYum: Online takeout today!</title>

如果表单提交包含错误，并且提交重新呈现当前页面，则可以使用标题来帮助用户了解提交的任何错误。例如，更新页面title值以反映页面状态的重大变化（如表单验证问题）。

html
<title>
  2 errors - Your order - Sea Food Store - Food: Online takeout today!
</title>

注意：目前，动态更新页面的标题不会自动由屏幕阅读器宣布。如果您要更新页面标题以反映页面状态的重大变化，则可能还需要使用ARIA 实时区域。

示例

html
<title>Awesome interesting stuff</title>

此示例建立一个页面，其标题（如窗口顶部或窗口标签中显示）为“很棒的有趣内容”。

技术摘要

内容类别 元数据内容.
允许内容 不是元素间空白的文本。
标签省略 需要打开和关闭标签。请注意，省略</title>会导致浏览器忽略页面的其余部分。
允许父元素 包含其他<title>元素的<head>元素。
隐式 ARIA 角色 没有对应的角色
允许的 ARIA 角色 不允许使用role。
DOM 接口 HTMLTitleElement

规范

规范
HTML 标准
# the-title-element

浏览器兼容性

BCD 表仅在浏览器中加载

另请参阅