itemtype 属性本身不直接标记视频信息，它仅声明结构化数据类型（如 https://schema.org/VideoObject），具体字段需由 itemprop 配合 itemscope 使用；必须三者共存，且 thumbnailUrl 等关键属性需可访问、符合格式要求。

itemtype 属性本身不直接标记视频信息

itemtype 是 Microdata 规范里的属性，它只负责声明一个结构化数据的类型（比如 https://schema.org/VideoObject），并不承载具体字段值。真正标记“视频标题”“时长”“缩略图”这些信息的是配合使用的 itemprop 属性。单独写 itemtype 没有意义，必须和 itemscope、itemprop 一起用。

正确嵌套：itemscope + itemtype + itemprop 缺一不可

常见错误是只加 itemtype 却漏掉 itemscope，导致搜索引擎完全忽略这段标记。正确结构如下：

<div itemscope itemtype="https://schema.org/VideoObject">
  <h1 itemprop="name">如何调试 React Suspense</h1>
  <meta itemprop="duration" content="PT12M30S">
<link itemprop="thumbnailUrl" href="https://example.com/thumb.jpg">
<meta itemprop="uploadDate" content="2024-05-20">
</div>

要点：

• itemscope 必须存在，它是开启 Microdata 解析的开关
• itemtype 值推荐用 https://schema.org/VideoObject（不是 http，注意协议）
• itemprop 的值要严格匹配 Schema.org 定义的属性名，比如不能写 videoDuration，得写 duration
• 时间类字段（如 duration、uploadDate）必须用 ISO 8601 格式，PT12M30S 表示 12 分 30 秒，2024-05-20 表示日期

避免用 标签直接套 itemtype

很多人试图这样写：。这在语法上合法，但实际效果差—— 是替换元素，内部文本内容不可见也不被解析，itemprop="name" 等属性容易丢失上下文。更稳妥的做法是用

或

包裹整个视频区块，把 和元数据都放进去：

<section itemscope itemtype="https://schema.org/VideoObject"><h2 itemprop="name">Webpack 5 模块联邦实战</h2>
  <video controls><source src="webpack-federation.mp4" type="video/mp4"></source></video><meta itemprop="embedUrl" content="https://example.com/embed/123">
<meta itemprop="description" content="详解模块联邦的三种使用模式"></section>

注意：embedUrl 应指向可嵌入播放页（如 YouTube iframe 地址或自建 embed 接口），不是原始 MP4 链接。

HTML Text Extract

从HTML页面（URL、文件或标准输入）中提取主体内容文本，去除导航、页脚、广告和模板文本。可直接传递给readability_check或其他文本工具。

下载

验证是否生效：别信浏览器开发者工具

Chrome DevTools 的 Elements 面板不会高亮 Microdata，也看不到结构化数据解析结果。必须用 Google 的 Rich Results Test 或 Schema Markup Validator 提交 HTML 片段验证。常见失败原因：

• itemtype URL 写成 http://schema.org/VideoObject（少一个 s）
• itemprop="thumbnailUrl" 指向的图片返回 404 或跨域限制（CORS），导致抓取失败
• 缺失必填字段：Google 对 VideoObject 要求至少提供 name、description、thumbnailUrl、uploadDate 四个 itemprop
• 页面未部署上线，验证工具无法访问相对路径资源（如 ./thumb.jpg）

最常被忽略的是 thumbnailUrl 的可访问性——本地开发时能加载，上线后因路径或权限问题 403，整个视频富媒体卡片就失效了。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！