<title>: The Document Title element

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

¥The <title> HTML element defines the document's title that is shown in a browser's title bar or a page's tab. It only contains text; tags within the element are ignored.

html

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

属性

¥Attributes

该元素仅包含全局属性。

¥This element only includes the global attributes.

使用说明

¥Usage notes

<title> 元素始终在页面的 <head> 块内使用。

¥The <title> element is always used within a page's <head> block.

页面标题和 SEO

¥Page titles and SEO

页面标题的内容可能对搜索引擎优化产生重大影响 (SEO)。一般来说，较长的描述性标题比简短或通用的标题效果更好。标题内容是搜索引擎算法用来决定搜索结果中列出页面的顺序的组件之一。此外，标题是第一个 "hook"，通过它可以吸引浏览搜索结果页面的读者的注意力。

¥The contents of a page title can have significant implications for search engine optimization (SEO). In general, a longer, descriptive title performs better than short or generic titles. The content of the title is one of the components used by search engine algorithms to decide the order in which to list pages in search results. Also, the title is the initial "hook" by which you grab the attention of readers glancing at the search results page.

撰写好标题的一些指南和技巧：

¥A few guidelines and tips for composing good titles:

避免使用一两个词的标题。对术语表或参考样式页面使用描述性短语或术语定义配对。
搜索引擎通常显示页面标题的前 55-60 个字符。超过该长度的文本可能会丢失，因此标题的长度尽量不要超过该长度。如果你必须使用较长的标题，请确保重要部分先出现，并且标题中可能被删除的部分没有任何关键内容。
不要使用 "关键字斑点。" 如果你的标题只是单词列表，算法通常会降低你的页面在搜索结果中的位置。
尝试确保你的标题在你自己的网站中尽可能独特。重复或接近重复的标题可能会导致搜索结果不准确。

示例

¥Examples

html

<title>Awesome interesting stuff</title>

此示例建立一个页面，其标题（显示在窗口顶部或窗口选项卡中）为 "很棒的有趣的东西"。

¥This example establishes a page whose title (as displayed at the top of the window or in the window's tab) as "Awesome interesting stuff".

无障碍问题

¥Accessibility concerns

提供准确简洁的标题来描述页面的用途非常重要。

¥It is important to provide an accurate and concise title to describe the page's purpose.

辅助技术用户的常见导航技术是阅读页面标题并推断页面包含的内容。这是因为导航到页面以确定其内容可能是一个耗时且可能令人困惑的过程。网站的每个页面的标题应该是唯一的，最好首先显示页面的主要目的，然后是网站的名称。遵循此模式将有助于确保屏幕阅读器首先宣布页面的主要用途。对于用户在同一网站中导航到的每个页面，这比必须在唯一页面标题之前听网站名称提供了更好的体验。

¥A common navigation technique for users of assistive technology is to read the page title and infer the content the page contains. This is because navigating into a page to determine its content can be a time-consuming and potentially confusing process. Titles should be unique to every page of a website, ideally surfacing the primary purpose of the page first, followed by the name of the website. Following this pattern will help ensure that the primary purpose of the page is announced by a screen reader first. This provides a far better experience than having to listen to the name of a website before the unique page title, for every page a user navigates to in the same website.

示例

¥Examples

html

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

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

¥If a form submission contains errors and the submission re-renders the current page, the title can be used to help make users aware of any errors with their submission. For instance, update the page title value to reflect significant page state changes (such as form validation problems).

html

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

注意：目前，屏幕阅读器不会自动宣布动态更新页面标题。如果你要更新页面标题以反映页面状态的重大更改，那么也可能需要使用 ARIA 现场区域。

¥Note: Presently, dynamically updating a page's title will not be automatically announced by screen readers. If you are going to update the page title to reflect significant changes to a page's state, then the use of ARIA Live Regions may be necessary, as well.

技术总结

¥Technical summary

内容类别	元数据内容.
允许的内容	不是元素间 whitespace 的文本。
标签遗漏	开始和结束标签都是必需的。请注意，保留 `</title>` 会导致浏览器忽略页面的其余部分。
允许的父级	不包含其他 `<title>` 元素的 `<head>` 元素。
隐式 ARIA 角色	没有对应的角色
允许的 ARIA 角色	不允许 `role`。
DOM 接口	`HTMLTitleElement`

规范

Specification
HTML Standard # the-title-element

¥Specifications

浏览器兼容性

BCD tables only load in the browser

¥Browser compatibility

也可以看看

¥See also

SVG <title> 元素