HTML元信息（metadata）是通过<meta>标签在HTML文档的<head>部分中定义的。元信息主要用于提供有关页面的额外信息，这些信息不会直接显示在页面上，但可以被浏览器、搜索引擎和其他web服务使用。以下是一个HTML元信息的实例：
html复制代码
|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|
|
|
<!-- 页面描述 --> |
|
<meta name="description" content="这是一个示例网页，展示了如何使用HTML元信息。"> |
|
|
|
<!-- 页面关键词 --> |
|
<meta name="keywords" content="HTML, 示例, 元信息, metadata, <meta> 标签"> |
|
|
|
<!-- 作者信息 --> |
|
<meta name="author" content="Your Name"> |
|
|
|
<!-- 页面生成器 --> |
|
<meta name="generator" content="Your Website Builder"> |
|
|
|
<!-- 页面版权信息 --> |
|
<meta name="copyright" content="Copyright © 2023 Your Company. All rights reserved."> |
|
|
|
<!-- 页面修订日期 --> |
|
<meta name="revised" content="David Yang, 3/15/23"> |
|
|
|
<!-- 页面刷新和跳转 --> |
|
<meta http-equiv="refresh" content="5; url=https://www.example.com/new-page.html"> |
|
|
|
<!-- 页面字符集 --> |
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
|
|
|
<!-- 搜索引擎优化 --> |
|
<meta name="robots" content="index, follow"> |
|
|
|
<!-- 社交媒体卡片信息 --> |
|
<meta property="og:title" content="网页标题"> |
|
<meta property="og:description" content="网页描述"> |
|
<meta property="og:image" content="https://www.example.com/image.jpg"> |
|
|
|
<!-- 网页图标 --> |
|
<link rel="icon" href="favicon.ico" type="image/x-icon"> |
|
|
|
<!-- CSS样式表链接 --> |
|
<link rel="stylesheet" type="text/css" href="styles.css"> |
|
|
|
<!-- 其他头部内容... --> |
|
</head> |
|
<body> |
|
<!-- 页面内容 --> |
|
<h1>欢迎来到我的网页！</h1> |
|
<p>这是一个展示HTML元信息的示例页面。</p> |
|
</body> |
|
</html> |
在这个例子中，<meta> 标签被用来提供多种元信息：
· name="description" 和 name="keywords" 用于描述网页内容和关键词，通常用于搜索引擎优化（SEO）。
· name="author" 用于指定网页作者。
· name="generator" 用于说明创建该网页所使用的软件或工具。
· name="copyright" 用于声明版权信息。
· name="revised" 用于指示网页的最后修订日期。
· http-equiv="refresh" 用于指定页面自动刷新并跳转到另一个URL。
· http-equiv="Content-Type" 用于指定文档类型和字符编码。
· name="robots" 用于指示搜索引擎爬虫如何索引该页面。
此外，还有用于社交媒体优化的元信息，如 property="og:title"、property="og:description" 和 property="og:image"，这些通常用于Open Graph协议，使得页面在社交媒体上分享时能够显示更丰富的信息。
请注意，虽然元信息对搜索引擎优化和网页功能有一定的影响，但它们并不直接影响用户在浏览器中看到的页面内容。因此，在设计和编写网页时，元信息通常只是整个HTML文档中的一小部分。
