HowTo (HowTo
) 结构化数据
请使用 HowTo
结构化数据明确告诉 Google 您的内容是 HowTo 内容。HowTo 内容旨在引导用户通过一系列步骤成功完成某项任务,HowTo 中可以包含视频、图片和文字。例如,“如何打领带”或“如何铺设厨房防溅墙瓷砖”。如果用户必须按顺序阅读 HowTo 中的每个步骤,您最好添加 HowTo
结构化数据,使您的内容更有吸引力。HowTo
结构化数据非常适用于重点内容是 HowTo 的网页。
如果您正确标记了 HowTo 网页,则其可能会在 Google 搜索中显示为富媒体搜索结果,并且系统可能会为其生成适用于 Google 助理的 Action,而这有助于您的网站触及合适的用户。
Comment ajouter des données structurées
Ces données structurées représentent un format normalisé permettant de fournir des informations sur une page et de classer son contenu. En savoir plus sur le fonctionnement des données structurées
Voici, dans les grandes lignes, comment créer, tester et publier des données structurées. Pour consulter un guide détaillé sur l'ajout de données structurées à une page Web, accédez à cet atelier de programmation.
- Ajoutez les propriétés obligatoires. En fonction du format que vous utilisez, découvrez où insérer des données structurées sur la page.
- Suivez les consignes.
- Validez votre code à l'aide de l'outil de test des résultats enrichis et corrigez les erreurs critiques, le cas échéant. Envisagez également de résoudre les problèmes non critiques que l'outil a pu signaler, car cela peut contribuer à améliorer la qualité de vos données structurées. Toutefois, ce n'est pas nécessaire pour pouvoir bénéficier des résultats enrichis.
- Déployez quelques pages où figurent vos données structurées et utilisez l'outil d'inspection d'URL pour découvrir comment Google voit la page. Assurez-vous que Google peut accéder à votre page et qu'elle n'est pas bloquée par un fichier robots.txt, la balise
noindex
ni par des identifiants de connexion. Si tout semble être en ordre, vous pouvez demander à Google d'explorer de nouveau vos URL. - Pour informer Google des modifications futures de vos pages, nous vous recommandons de nous envoyer un sitemap. Vous pouvez automatiser cette opération à l'aide de l'API Sitemap de la Search Console.
功能可用性
目前,HowTo 富媒体搜索结果适用于 Google 搜索支持的所有语言以及国家/地区。此功能既支持移动设备,也支持桌面设备。
示例
下面这些示例展示了您的内容在 HowTo 富媒体搜索结果中可能会如何呈现。如果您的 HowTo 中包含一张 HowTo 操作完成后的图片以及每个步骤的图片,则您的内容可能会以更加直观的方式进行呈现。请务必添加尽可能多的必需属性和建议属性,以便您的 HowTo 能够以最有效的方式显示在 Google 搜索结果中。
标准 HowTo 富媒体搜索结果

下面是一个使用 JSON-LD 的文本型 HowTo 网页示例。此示例仅包含 1 张代表 HowTo 最终状态的图片。在此结果中,用户可以看到某些步骤的内容预览。
<html> <head> <title>How to tile a kitchen backsplash</title> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "HowTo", "name": "How to tile a kitchen backsplash", "image": { "@type": "ImageObject", "url": "https://example.com/photos/1x1/photo.jpg", "height": "406", "width": "305" }, "estimatedCost": { "@type": "MonetaryAmount", "currency": "USD", "value": "100" }, "supply": [ { "@type": "HowToSupply", "name": "tiles" }, { "@type": "HowToSupply", "name": "thin-set mortar" }, { "@type": "HowToSupply", "name": "tile grout" }, { "@type": "HowToSupply", "name": "grout sealer" } ], "tool": [ { "@type": "HowToTool", "name": "notched trowel" }, { "@type": "HowToTool", "name": "bucket" },{ "@type": "HowToTool", "name": "large sponge" } ], "step": [ { "@type": "HowToStep", "url": "https://example.com/kitchen#step1", "name": "Prepare the surfaces", "itemListElement": [{ "@type": "HowToDirection", "text": "Turn off the power to the kitchen and then remove everything that is on the wall, such as outlet covers, switchplates, and any other item in the area that is to be tiled." }, { "@type": "HowToDirection", "text": "Then clean the surface thoroughly to remove any grease or other debris and tape off the area." }], "image": { "@type": "ImageObject", "url": "https://example.com/photos/1x1/photo-step1.jpg", "height": "406", "width": "305" } }, { "@type": "HowToStep", "name": "Plan your layout", "url": "https://example.com/kitchen#step2", "itemListElement": [{ "@type": "HowToTip", "text": "The creases created up until this point will be guiding lines for creating the four walls of your planter box." }, { "@type": "HowToDirection", "text": "Lift one side at a 90-degree angle, and fold it in place so that the point on the paper matches the other two points already in the center." }, { "@type": "HowToDirection", "text": "Repeat on the other side." }], "image": { "@type": "ImageObject", "url": "https://example.com/photos/1x1/photo-step2.jpg", "height": "406", "width": "305" } }, { "@type": "HowToStep", "name": "Prepare your and apply mortar (or choose adhesive tile)", "url": "https://example.com/kitchen#step3", "itemListElement": [{ "@type": "HowToDirection", "text": "Follow the instructions on your thin-set mortar to determine the right amount of water to fill in your bucket. Once done, add the powder gradually and make sure it is thoroughly mixed." }, { "@type": "HowToDirection", "text": "Once mixed, let it stand for a few minutes before mixing it again. This time do not add more water. Double check your thin-set mortar instructions to make sure the consistency is right." }, { "@type": "HowToDirection", "text": "Spread the mortar on a small section of the wall with a trowel." }, { "@type": "HowToTip", "text": "Thinset and other adhesives set quickly so make sure to work in a small area." }, { "@type": "HowToDirection", "text": "Once it's applied, comb over it with a notched trowel." }], "image": { "@type": "ImageObject", "url": "https://example.com/photos/1x1/photo-step3.jpg", "height": "406", "width": "305" } }, { "@type": "HowToStep", "name": "Add your tile to the wall", "url": "https://example.com/kitchen#step4", "itemListElement": [{ "@type": "HowToDirection", "text": "Place the tile sheets along the wall, making sure to add spacers so the tiles remain lined up." }, { "@type": "HowToDirection", "text": "Press the first piece of tile into the wall with a little twist, leaving a small (usually one-eight inch) gap at the countertop to account for expansion. use a rubber float to press the tile and ensure it sets in the adhesive." }, { "@type": "HowToDirection", "text": "Repeat the mortar and tiling until your wall is completely tiled, Working in small sections." }], "image": { "@type": "ImageObject", "url": "https://example.com/photos/1x1/photo-step4.jpg", "height": "406", "width": "305" } }, { "@type": "HowToStep", "name": "Apply the grout", "url": "https://example.com/kitchen#step5", "itemListElement": [{ "@type": "HowToDirection", "text": "Allow the thin-set mortar to set. This usually takes about 12 hours. Don't mix the grout before the mortar is set, because you don't want the grout to dry out!" }, { "@type": "HowToDirection", "text": "To apply, cover the area thoroughly with grout and make sure you fill all the joints by spreading it across the tiles vertically, horizontally, and diagonally. Then fill any remaining voids with grout." }, { "@type": "HowToDirection", "text": "Then, with a moist sponge, sponge away the excess grout and then wipe clean with a towel. For easier maintenance in the future, think about applying a grout sealer." }], "image": { "@type": "ImageObject", "url": "https://example.com/photos/1x1/photo-step5.jpg", "height": "406", "width": "305" } } ], "totalTime": "P2D" } </script> </head> <body> </body> </html>
下面是一个使用微数据的文本型 HowTo 网页示例。此示例仅包含 1 张代表 HowTo 最终状态的图片。在此结果中,用户可以看到某些步骤的内容预览。
<html> <head> <title>How to tile a kitchen backsplash</title> </head> <body> <div itemscope itemtype="https://schema.org/HowTo"> <b><span itemprop="name">How to tile a kitchen backsplash</span></b> <div>About <span itemprop="estimatedCost" itemscope itemtype="https://schema.org/MonetaryAmount"> <meta itemprop="currency" content="USD"/> <meta itemprop="value" content="100"/> $100 </span> </div> <div>About <span itemprop="totalTime" content="P2D">2 days</span></div> <div>Necessary Items:</div> <div itemprop="supply" itemscope itemtype="https://schema.org/HowToSupply"> <a itemprop="url" href="https://example.com/supplies?id=1"> <span itemprop="name">tiles</span> </a> <img alt="Blue kitchen tiles with scalloped edges" itemprop="image" src="https://example.com/photos/1x1/photo.jpg"/> </div> <div itemprop="supply" itemscope itemtype="https://schema.org/HowToSupply"> <a itemprop="url" href="https://example.com/supplies?id=2"> <span itemprop="name">thin-set mortar</span> </a> <img alt="Thin-set mortar" itemprop="image" src="https://example.com/photos/1x1/photo.jpg"/> </div> <div itemprop="supply" itemscope itemtype="https://schema.org/HowToSupply"> <a itemprop="url" href="https://example.com/supplies?id=3"> <span itemprop="name">tile grout</span> </a> <img alt="White tile grout" itemprop="image" src="https://example.com/photos/1x1/photo.jpg"/> </div> <div itemprop="supply" itemscope itemtype="https://schema.org/HowToSupply"> <a itemprop="url" href="https://example.com/supplies?id=4"> <span itemprop="name">grout sealer</span> </a> <img alt="Grout sealer" itemprop="image" src="https://example.com/photos/1x1/photo.jpg"/> </div> <div itemprop="tool" itemscope itemtype="https://schema.org/HowToTool"> <a itemprop="url" href="https://example.com/supplies?id=5"> <span itemprop="name">notched trowel</span> </a> <img alt="Notched trowel with a red handle" itemprop="image" src="https://example.com/photos/1x1/photo.jpg"/> </div> <div itemprop="tool" itemscope itemtype="https://schema.org/HowToTool"> <a itemprop="url" href="https://example.com/tools?id=6"> <span itemprop="name">bucket</span> </a> <img alt="Medium-sized blue bucket" itemprop="image" src="https://example.com/photos/1x1/photo.jpg"/> </div> <div itemprop="tool" itemscope itemtype="https://schema.org/HowToTool"> <a itemprop="url" href="https://example.com/tools?id=7"> <span itemprop="name">large sponge</span> </a> <img alt="Large yellow sponge" itemprop="image" src="https://example.com/photos/1x1/photo.jpg"/> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <link itemprop="url" href="https://example.com/example#step1" /> <div itemprop="name">Preparation</div> <img itemprop="image" alt="image showing preparation" src="https://example.com/photos/1x1/photo-step1.jpg"/> <div itemprop="itemListElement" itemscope itemtype="https://schema.org/HowToDirection"> <div itemprop="text">Turn off the power to the kitchen and then remove everything that is on the wall, such as outlet covers, switchplates, and any other item in the area that is to be tiled. Then clean the surface thoroughly to remove any grease or other debris and tape off the area. </div> </div> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <link itemprop="url" href="https://example.com/example#step2" /> <div itemprop="name">Plan your Layout</div> <img itemprop="image" alt="image showing layout planning" src="https://example.com/photos/1x1/photo-step2.jpg"/> <div itemprop="itemListElement" itemscope itemtype="https://schema.org/HowToDirection"> <div itemprop="text">Lay out your tile horizontally below the wall where you're going to place it. This makes it easy to ensure that your pattern will fit in the space provided. Also it helps you double check that you have enough tile and know exactly where each piece will go. </div> </div> <div itemprop="itemListElement" itemscope itemtype="https://schema.org/HowToDirection"> <div itemprop="text">Spread the mortar on a small section of the wall with a trowel. Thinset and other adhesives set quickly so make sure to work in a small area. Once it's applied, comb over it with a notched trowel. </div> </div> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <link itemprop="url" href="https://example.com/example#step3" /> <div itemprop="name">Add your tile to the wall</div> <img itemprop="image" alt="image grout application" src="https://example.com/photos/1x1/photo-step3.jpg"/> <div itemprop="itemListElement" itemscope itemtype="https://schema.org/HowToDirection"> <div itemprop="text">Place the tile sheets along the wall, making sure to add spacers so the tiles remain lined up. Press the first piece of tile into the wall with a little twist, leaving a small (usually one-eight inch) gap at the countertop to account for expansion. use a rubber float to press the tile and ensure it sets in the adhesive. Repeat the mortar and tiling until your wall is completely tiled, working in small sections. </div> </div> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <link itemprop="url" href="https://example.com/example#step4" /> <div itemprop="name">Apply the grout</div> <img itemprop="image" alt="image grout application" src="https://example.com/photos/1x1/photo-step4.jpg"/> <div itemprop="itemListElement" itemscope itemtype="https://schema.org/HowToDirection"> <div itemprop="text">Allow the thin-set mortar to set. This usually takes about 12 hours. Don't mix the grout before the mortar is set, because you don't want the grout to dry out! To apply, cover the area thoroughly with grout and make sure you fill all the joints by spreading it across the tiles vertically, horizontally, and diagonally. Then fill any remaining voids with grout. </div> </div> <div itemprop="itemListElement" itemscope itemtype="https://schema.org/HowToDirection"> <div itemprop="text">Then, with a moist sponge, sponge away the excess grout and then wipe clean with a towel. For easier maintenance in the future, think about applying a grout sealer. </div> </div> </div> </div> </body> </html>
附有各步骤图片的 HowTo 富媒体搜索结果

下面是一个使用 JSON-LD 且附有各步骤图片的 HowTo 网页示例。网页中包含每个步骤的图片时,用户可以通过图片轮播界面查看预览。
<html> <head> <title>How to tie a tie</title> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "HowTo", "image": { "@type": "ImageObject", "url": "https://example.com/1x1/photo.jpg" }, "name": "How to tie a tie", "totalTime": "PT2M", "video": { "@type": "VideoObject", "name": "Tie a Tie", "description": "How to tie a four-in-hand knot.", "thumbnailUrl": "https://example.com/photos/photo.jpg", "contentUrl": "https://www.example.com/videos/123_600x400.mp4", "embedUrl": "https://www.example.com/videoplayer?id=123", "uploadDate": "2019-01-05T08:00:00+08:00", "duration": "P1MT10S" }, "supply": [ { "@type": "HowToSupply", "name": "A tie" }, { "@type": "HowToSupply", "name": "A collared shirt" } ], "tool": [ { "@type": "HowToTool", "name": "A mirror" } ], "step":[ { "@type": "HowToStep", "name": "Preparations", "text": "Button your shirt how you'd like to wear it, then drape the tie around your neck. Make the thick end about 1/3rd longer than the short end. For formal button down shirts, it usually works best with the small end of the tie between 4th and 5th button.", "image": "https://example.com/1x1/step1.jpg", "url": "https://example.com/tie#step1" }, { "@type": "HowToStep", "name": "Crossing once", "text": "Cross the long end over the short end. This will form the basis for your knot.", "image": "https://example.com/1x1/step2.jpg", "url": "https://example.com/tie#step2" }, { "@type": "HowToStep", "name": "Second crossing", "text": "Bring the long end back under the short end, then throw it back over the top of the short end in the other direction.", "image": "https://example.com/1x1/step3.jpg", "url": "https://example.com/tie#step3" }, { "@type": "HowToStep", "name": "Loop in", "text": "Now pull the long end through the loop near your neck, forming another loop near your neck.", "image": "https://example.com/1x1/step4.jpg", "url": "https://example.com/tie#step4" }, { "@type": "HowToStep", "name": "Pull and tighten", "text": "Pull the long end through that new loop and tighten to fit!", "image": "https://example.com/1x1/step5.jpg", "url": "https://example.com/tie#step5" } ] } </script> </head> <body> </body> </html>
下面是一个使用微数据且附有各步骤图片的 HowTo 网页示例。网页中包含每个步骤的图片时,用户可以通过图片轮播界面查看预览。
<html> <head> <title>How to tie a tie</title> </head> <body> <div itemscope itemtype="https://schema.org/HowTo"> <b><span itemprop="name">How to tie a tie</span></b> <div>About <span itemprop="totalTime" content="PT2M">2 minutes</span></div> <div itemprop="video" itemscope itemtype="https://schema.org/VideoObject"> <meta itemprop="name" content="Tie a Tie" /> <meta itemprop="description" content="How to tie a four-in-hand knot." /> <link itemprop="thumbnailUrl" content="https://example.com/photos/photo.jpg" /> <link itemprop="contentUrl" content="https://www.example.com/videos/123_600x400.mp4" /> <link itemprop="embedUrl" content="https://www.example.com/videoplayer?id=123" /> <meta itemprop="duration" content="P1MT10S" /> <meta itemprop="uploadDate" content="2019-01-05T08:00:00+08:00" /> <video>...</video> </div> <div>Necessary Items:</div> <div itemprop="supply" itemtype="https://schema.org/HowToSupply">A tie</div> <div itemprop="supply" itemtype="https://schema.org/HowToSupply">A collared Shirt</div> <div itemprop="tool" itemtype="https://schema.org/HowToTool">A mirror</div> <div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Preparations</div> <div itemprop="text">Button your shirt how you'd like to wear it, then drape the tie around your neck. Make the thick end about 1/3rd longer than the short end. For formal button down shirts, it usually works best with the small end of the tie between 4th and 5th button.</div> <div itemprop="image">https://example.com/1x1/photo1.jpg</div> <meta itemprop="url" content="https://example.com/tie#step1" /> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Crossing once</div> <div itemprop="text">Cross the long end over the short end. This will form the basis for your knot.</div> <div itemprop="image">https://example.com/1x1/photo2.jpg</div> <meta itemprop="url" content="https://example.com/tie#step2" /> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Second crossing</div> <div itemprop="text">Bring the long end back under the short end, then throw it back over the top of the short end in the other direction.</div> <div itemprop="image">https://example.com/1x1/photo3.jpg</div> <meta itemprop="url" content="https://example.com/tie#step3" /> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Loop in</div> <div itemprop="text">Now pull the long end through the loop near your neck, forming another loop near your neck.</div> <div itemprop="image">https://example.com/1x1/photo4.jpg</div> <meta itemprop="url" content="https://example.com/tie#step4" /> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Pull and tighten</div> <div itemprop="text">Pull the long end through that new loop and tighten to fit!</div> <div itemprop="image">https://example.com/1x1/photo5.jpg</div> <meta itemprop="url" content="https://example.com/tie#step5" /> </div> </div> </div> </body> </html>
包含视频的 HowTo 富媒体搜索结果
下面是一个使用 JSON-LD 且同时包含文字、图片和视频剪辑的 HowTo 网页示例。该示例包含 1 个 HowTo 视频,并且视频中的各个步骤都带有 Clip
结构化数据标记。
<html> <head> <title>How to create a Trivia action</title> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "HowTo", "image": { "@type": "ImageObject", "url": "https://example.com/1x1/photo.jpg" }, "name": "How to create a Trivia action", "totalTime": "PT2M", "video": { "@type": "VideoObject", "name": "Build a Trivia Game for the Google Assistant with No Code", "description": "Learn how to create a Trivia action for Assistant within minutes.", "thumbnailUrl": "https://example.com/photos/photo.jpg", "contentUrl": "https://www.youtube.com/watch?v=4AOI1tZrgMI", "embedUrl": "https://www.youtube.com/embed/4AOI1tZrgMI", "uploadDate": "2019-01-05T08:00:00+08:00", "duration": "P1MT10S", "hasPart": [ { "@type": "Clip", "@id": "Clip1", "name": "Open Actions on Google Console", "startOffset": 29, "endOffset": 36, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI&t=29" }, { "@type": "Clip", "@id": "Clip2", "name": "Select Trivia Template", "startOffset": 36, "endOffset": 45, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI&t=36" }, { "@type": "Clip", "@id": "Clip3", "name": "Choose a Personality", "startOffset": 45, "endOffset": 65, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI&t=45" }, { "@type": "Clip", "@id": "Clip4", "name": "Feed your content", "startOffset": 65, "endOffset": 154, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI&t=65" }, { "@type": "Clip", "@id": "Clip5", "name": "Create the action", "startOffset": 154, "endOffset": 172, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI&t=154" }, { "@type": "Clip", "@id": "Clip6", "name": "Test your action", "startOffset": 172, "endOffset": 212, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI&t=172" }, { "@type": "Clip", "@id": "Clip7", "name": "Submit your action", "startOffset": 212, "endOffset": 285, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI&t=212" } ] }, "step": [ { "@type": "HowToStep", "name": "Open Actions on Google Console", "text": "Navigate to https://console.actions.google.com to get started.", "image": "https://example.com/1x1/step1.jpg", "url": "https://example.com/tie#step1", "video": { "@id": "Clip1" } }, { "@type": "HowToStep", "name": "Select Trivia Template", "text": "Create a new project and select Templates | You have a choice to select between Trivia, Flashcard or Personality Quiz.", "image": "https://example.com/1x1/step2.jpg", "url": "https://example.com/tie#step2", "video": { "@id": "Clip2" } }, { "@type": "HowToStep", "name": "Choose a Personality", "text": "Select one of the three personalities- Mr, Montgomery, Regal Queen, or the Trivia Bot.", "image": "https://example.com/1x1/step3.jpg", "url": "https://example.com/tie#step3", "video": { "@id": "Clip3" } }, { "@type": "HowToStep", "name": "Feed your content", "itemListElement": [ { "@type": "HowToDirection", "text": "Make a copy of our pre-filled sheet and replace with your content." }, { "@type": "HowToDirection", "text": "Ensure you make the sheet publicly accessible. Copy the URL of the sheet and paste it into the Console." } ], "image": "https://example.com/1x1/step4.jpg", "url": "https://example.com/tie#step4", "video": { "@id": "Clip4" } }, { "@type": "HowToStep", "name": "Create the action", "text": "Create the action. Once content is successfully uploaded, it will take couple of minutes to create the action.", "image": "https://example.com/1x1/step5.jpg", "url": "https://example.com/tie#step5", "video": { "@id": "Clip5" } }, { "@type": "HowToStep", "name": "Test your action", "text": "Navigate to the Simulator to test your action and simulate various surfaces, locations and locales.", "image": "https://example.com/1x1/step6.jpg", "url": "https://example.com/tie#step6", "video": { "@id": "Clip6" } }, { "@type": "HowToStep", "name": "Submit your action", "text": "Once you complete directory information and invocation names, submit your action for all Assistant users to see and use your action.", "image": "https://example.com/1x1/step7.jpg", "url": "https://example.com/tie#step7", "video": { "@id": "Clip7" } } ] } </script> </head> <body> </body> </html>
下面是一个使用微数据且同时包含文字、图片和视频剪辑的 HowTo 网页示例。该示例包含 1 个 HowTo 视频,并且视频中的各个步骤都带有 Clip
结构化数据标记。
<html> <head> <title>How to create a Trivia action</title> </head> <body> <div itemscope itemtype="https://schema.org/HowTo"> <b><span itemprop="name">How to create a Trivia action</span></b> <div>About <span itemprop="totalTime" content="PT2M">2 minutes</span></div> <div itemprop="video" itemscope itemtype="https://schema.org/VideoObject"> <meta itemprop="name" content="Tie a Tie" /> <meta itemprop="description" content="How to tie a four-in-hand knot." /> <link itemprop="thumbnailUrl" content="https://example.com/photos/photo.jpg" /> <link itemprop="contentUrl" content="https://www.example.com/videos/123_600x400.mp4" /> <link itemprop="embedUrl" content="https://www.example.com/videoplayer?id=123" /> <meta itemprop="duration" content="P1MT10S" /> <meta itemprop="uploadDate" content="2019-01-05T08:00:00+08:00" /> <div> <div itemprop="hasPart" itemscope itemtype="https://schema.org/Clip" itemid="Clip1"> <div itemprop="name">Open Actions on Google Console</div> <div itemprop="startOffset">29</div> <div itemprop="endOffset">36</div> <div itemprop="url">https://www.youtube.com/watch?v=4AOI1tZrgMI&t=29</div> </div> <div itemprop="hasPart" itemscope itemtype="https://schema.org/Clip" itemid="Clip2"> <div itemprop="name">Select Trivia Template</div> <div itemprop="startOffset">36</div> <div itemprop="endOffset">45</div> <div itemprop="url">https://www.youtube.com/watch?v=4AOI1tZrgMI&t=36</div> </div> <div itemprop="hasPart" itemscope itemtype="https://schema.org/Clip" itemid="Clip3"> <div itemprop="name">Choose a Personality</div> <div itemprop="startOffset">45</div> <div itemprop="endOffset">65</div> <div itemprop="url">https://www.youtube.com/watch?v=4AOI1tZrgMI&t=45</div> </div> <div itemprop="hasPart" itemscope itemtype="https://schema.org/Clip" itemid="Clip4"> <div itemprop="name">Feed your content</div> <div itemprop="startOffset">65</div> <div itemprop="endOffset">154</div> <div itemprop="url">https://www.youtube.com/watch?v=4AOI1tZrgMI&t=65</div> </div> <div itemprop="hasPart" itemscope itemtype="https://schema.org/Clip" itemid="Clip5"> <div itemprop="name">Create the action</div> <div itemprop="startOffset">154</div> <div itemprop="endOffset">172</div> <div itemprop="url">https://www.youtube.com/watch?v=4AOI1tZrgMI&t=154</div> </div> <div itemprop="hasPart" itemscope itemtype="https://schema.org/Clip" itemid="Clip6"> <div itemprop="name">Test your action</div> <div itemprop="startOffset">172</div> <div itemprop="endOffset">212</div> <div itemprop="url">https://www.youtube.com/watch?v=4AOI1tZrgMI&t=172</div> </div> <div itemprop="hasPart" itemscope itemtype="https://schema.org/Clip" itemid="Clip7"> <div itemprop="name">Submit your action</div> <div itemprop="startOffset">212</div> <div itemprop="endOffset">285</div> <div itemprop="url">https://www.youtube.com/watch?v=4AOI1tZrgMI&t=212</div> </div> </div> <video>...</video> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Open Actions on Google Console</div> <div itemprop="text">Navigate to https://console.actions.google.com to get started.</div> <div itemprop="image">https://example.com/1x1/photo1.jpg</div> <meta itemprop="url" content="https://example.com/tie#step1" /> <link itemprop="video" href="Clip1" /> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Select Trivia Template</div> <div itemprop="text">Create a new project and select Templates | You have a choice to select between Trivia, Flashcard or Personality Quiz.</div> <div itemprop="image">https://example.com/1x1/photo2.jpg</div> <meta itemprop="url" content="https://example.com/tie#step2" /> <link itemprop="video" href="Clip2" /> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Choose a Personality</div> <div itemprop="text">Select one of the three personalities- Mr, Montgomery, Regal Queen, or the Trivia Bot.</div> <div itemprop="image">https://example.com/1x1/photo3.jpg</div> <meta itemprop="url" content="https://example.com/tie#step3" /> <link itemprop="video" href="Clip3" /> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Feed your content</div> <div itemprop="itemListElement" itemscope itemtype="https://schema.org/HowToDirection"> <div itemprop="text">Make a copy of our pre-filled sheet and replace with your content.</div> </div> <div itemprop="itemListElement" itemscope itemtype="https://schema.org/HowToDirection"> <div itemprop="text">Ensure you make the sheet publicly accessible. Copy the URL of the sheet and paste it into the Console.</div> </div> <div itemprop="image">https://example.com/1x1/photo4.jpg</div> <meta itemprop="url" content="https://example.com/tie#step4" /> <link itemprop="video" href="Clip4" /> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Create the action</div> <div itemprop="text">Create the action. Once content is successfully uploaded, it will take couple of minutes to create the action.</div> <div itemprop="image">https://example.com/1x1/photo5.jpg</div> <meta itemprop="url" content="https://example.com/tie#step5" /> <link itemprop="video" href="Clip5" /> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Test your action</div> <div itemprop="text">PNavigate to the Simulator to test your action and simulate various surfaces, locations and locales.</div> <div itemprop="image">https://example.com/1x1/photo6.jpg</div> <meta itemprop="url" content="https://example.com/tie#step6" /> <link itemprop="video" href="Clip6" /> </div> <div itemprop="step" itemscope itemtype="https://schema.org/HowToStep"> <div itemprop="name">Submit your action</div> <div itemprop="text">Once you complete directory information and invocation names, submit your action for all Assistant users to see and use your action.</div> <div itemprop="image">https://example.com/1x1/photo7.jpg</div> <meta itemprop="url" content="https://example.com/tie#step7" /> <link itemprop="video" href="Clip7" /> </div> </div> </body> </html>
指南
若想让您的网页可显示为 HowTo 富媒体搜索结果以及可由系统生成适用于 Google 助理的 HowTo Action,您必须遵循以下指南:
内容指南
- 广告:请勿将
HowTo
结构化数据用于广告目的。 - 不符合条件的内容:如果内容为淫秽、亵渎、露骨色情或血腥暴力内容,宣扬危险活动或违法活动,或使用仇恨性/骚扰性语言,则不能显示为 HowTo 富媒体搜索结果。
- 来源:必须在源网页上向用户显示所有
HowTo
内容。确保 HowTo 内容是源网页的主要内容。请勿为特定网页添加多个HowTo
。 - 材料和工具:为完成相应任务所需的所有材料和工具添加结构化数据。
- 步骤:每个
HowToStep
都必须包含源步骤的完整内容。请勿将非步骤数据(例如摘要或简介部分)标记为步骤。 - 步骤图片:如果步骤的最佳呈现形式为图片,请确保针对每个
HowToStep
为这些步骤中的图片添加标记。仅标记每个步骤专用的说明性步骤图片;此外,请勿在同一 HowTo 的多个步骤中使用同一张图片。步骤中使用的图片应与您的网页内容相对应的图片相同。不要使用无法反映 HowTo 内容的图片,也不要使用不同的图片来优化富媒体搜索结果。 - 最终图片:如果可以用一张图片准确描述最终结果,请确保此图片显示在相应网页上,并且使用
image
属性将此图片包含在HowTo
标记中。此图片可与在上一步骤中标记的图片相同。 - 内容:请勿将
HowTo
标记用于食谱,食谱应使用Recipe structured data
。 如果文章和一般的建议内容不构成一套具体的说明,则不适合使用HowTo
标记。
结构化数据类型定义
要使您的内容能够显示为富媒体搜索结果,您必须为其添加必需属性。您还可以添加建议属性,以便向结构化数据添加更多信息,进而提供更好的用户体验。
HowTo
如需了解 HowTo
的完整定义,请访问 schema.org/HowTo。
HowTo
类型表示相应网页包含 HowTo。每个网页都必须有一个 HowTo
类型定义。
Google 支持的属性如下:
必需属性 | |
---|---|
name |
HowTo 的标题。例如,“如何打领带”。 |
step |
HowToStep 或 HowToSection
"step":[ { "@type": "HowToSection", "name": "Choose a Tie", "itemListElement": [ { "@type": "HowToStep", "name": "Choose a color", "text": "Pick a tie that matches your shirt color. Contrasting colors can be fun!" }, { "@type": "HowToStep", "name": "Choose a pattern", "text": "A tie with a pattern can add flare to your outfit. Make sure the pattern is not too noisy against your shirt" } ] }, { "@type": "HowToSection", "name": "Put on the Tie", "itemListElement": [ { "@type": "HowToStep", "name": "Arrange the Tie", "text": "Stand in front of the mirror with the tie around your neck." }, { "@type": "HowToStep", "name": "Tie the Tie", "text": "Use your hands to tie the tie into a neat knot around your neck. Looking sharp!" } ] } ] |
建议属性 | |
---|---|
estimatedCost |
MonetaryAmount 或 Text
按说明操作时所耗材料的估算费用。 |
image |
ImageObject 或 URL
HowTo 操作完成后的图片。 其他的图片指南:
|
supply |
HowToSupply 或 Text
按说明或指导操作时所消耗的材料。 |
tool |
HowToTool 或 Text
按说明或指导操作时使用(但未消耗掉)的物品。 |
totalTime |
Duration
执行所有说明/指导需消耗的总时间,包括准备材料的时间(采用 ISO 8601 时长格式)。 |
video |
VideoObject
HowTo 的视频。需遵循必需和建议的视频属性的列表。使用 { "@context": "https://schema.org", "@type": "HowTo", "video": { "@type": "VideoObject", "name": "Build a Trivia Game for the Google Assistant with No Code", "description": "Learn how to create a Trivia action for Assistant within minutes.", "thumbnailUrl": "https://example.com/photos/photo.jpg", "contentUrl": "https://www.youtube.com/watch?v=4AOI1tZrgMI", "embedUrl": "https://www.youtube.com/embed/4AOI1tZrgMI", "uploadDate": "2019-01-05T08:00:00+08:00", "duration": "P1MT10S", "hasPart": [ { "@type": "Clip", "@id": "Clip1", "name": "Open Actions on Google Console", "startOffset": 29, "endOffset": 36, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI?t=29" }, { "@type": "Clip", "@id": "Clip2", "name": "Select Trivia Template", "startOffset": 36, "endOffset": 45, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI?t=36" } ] } } |
video.hasPart
|
完整视频中的某段视频剪辑。 |
video.hasPart.endOffset
|
剪辑的结束时间,即从视频开始到剪辑结束之间经过的秒数。 |
video.hasPart.name
|
剪辑的名称。例如,对于介绍如何拉紧领带的剪辑,其名称可以是“拉紧”。 |
video.hasPart.startOffset
|
剪辑的开始时间,即从视频开始到剪辑开始之间经过的秒数。 |
video.hasPart.url
|
指向剪辑开始时间的链接。此开始时间必须与 "startOffset": 30, "endOffset": 45, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI&t=30" |
HowToSection
如需了解 HowToSection
的完整定义,请访问 schema.org/HowToSection。
HowToSection
类型用于定义单个 HowTo 的一部分,可包含一个或多个步骤。不得使用 HowToSection
来定义可用于完成相应任务的不同方法,而是要将 HowToSection
用作一种方法的一部分。如需列举可用于完成某项任务的多种方法,请使用多个 HowTo
对象。例如,您可以将更换爆胎的多种方法列为多个 HowTo
对象,而不是 HowToSection
对象。
Google 支持的属性如下:
必需属性 | |
---|---|
itemListElement |
HowToStep
相应部分的详细步骤列表。 |
name |
Text
相应部分的名称。 |
HowToStep
如需了解 HowToStep
的完整定义,请访问 schema.org/HowToStep。
HowToStep
类型用于定义 HowTo 中的简单文字步骤,可包含图片。
Google 支持的属性如下:
必需属性 | |
---|---|
itemListElement |
HowToDirection 或 HowToTip
详细子步骤列表,包括指导或提示。 如果使用了 |
text |
Text
相应步骤的完整说明文字。 如果使用了
|
建议属性 | |
---|---|
image |
ImageObject 或 URL
相应步骤的图片。其他图片指南:
|
name |
Text
步骤的总结性字词或短语(例如“将电线连接到接线柱上”或“挖掘”)。 请勿使用非描述性文字(例如“第 1 步:[文字]”)或其他形式的步骤编号(例如“1. [文字]”)。 |
url |
URL
一个可直接链接到相应步骤的 |
video |
VideoObject 或 Clip
HowTo 中此步骤的视频,或者对一个展示整个 HowTo 的视频的剪辑。 如果是
下面是一个使用 { "@type": "HowToStep", "video": { "name": "Drape the tie", "description": "Drape the tie.", "thumbnailUrl": "https://example.com/photos/photo.jpg", "contentUrl": "https://www.example.com/videos/123_600x400.mp4", "embedUrl": "https://www.example.com/videoplayer?id=123", "uploadDate": "2019-01-05T08:00:00+08:00", "duration": "PT12S" } } 下面是一个使用 { "@context": "https://schema.org", "@type": "HowTo", "name": "Build a Trivia Game for the Google Assistant with No Code", "video": { "@type": "VideoObject", "name": "Build a Trivia Game for the Google Assistant with No Code", "description": "Learn how to create a Trivia action for Assistant within minutes.", "thumbnailUrl": "https://example.com/photos/photo.jpg", "contentUrl": "https://www.youtube.com/watch?v=4AOI1tZrgMI", "embedUrl": "https://www.youtube.com/embed/4AOI1tZrgMI", "uploadDate": "2019-01-05T08:00:00+08:00", "duration": "P1MT10S", "hasPart": [ { "@type": "Clip", "@id": "Clip1", "name": "Open Actions on Google Console", "startOffset": 29, "endOffset": 36, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI?t=29" }, { "@type": "Clip", "@id": "Clip2", "name": "Select Trivia Template", "startOffset": 36, "endOffset": 45, "url": "https://www.youtube.com/watch?v=4AOI1tZrgMI?t=36" } ] }, "step": [ { "@type": "HowToStep", "name": "Open Actions on Google Console", "video": { "@id": "Clip1" } }, { "@type": "HowToStep", "name": "Select Trivia Template", "video": { "@id": "Clip2" } } ] } |
HowToSupply
、HowToTool
如需了解 HowToSupply
和 HowToTool
的完整定义,请访问 schema.org/HowToSupply 和 schema.org/HowToTool。
HowToSupply
和 HowToTool
用于完成 HowTo
。这两者具有相同的必需属性和建议属性。
必需属性 | |
---|---|
name |
Text
材料或工具的名称。 |
HowToDirection
、HowToTip
如需了解 HowToDirection
和 HowToTip
的完整定义,请访问 schema.org/HowToDirection 和 schema.org/HowToTip。
HowToDirection
和 HowToTip
用于描述指导或提示。这两者具有相同的必需属性和建议属性。
必需属性 | |
---|---|
text |
Text
指导或提示的文字。 |
Suivre les résultats enrichis avec la Search Console
La Search Console est un outil qui vous permet de suivre les performances de vos pages dans la recherche Google. Il n'est pas nécessaire de vous inscrire à la Search Console pour figurer dans les résultats de recherche Google. Cependant, en vous inscrivant, vous comprendrez mieux la façon dont Google interprète votre site et serez plus à même de l'améliorer. Nous vous recommandons de consulter la Search Console dans les cas suivants :
- Après avoir déployé des données structurées pour la première fois
- Après avoir publié de nouveaux modèles ou après avoir mis à jour votre code
- Lors des analyses régulières du trafic
Après avoir déployé des données structurées pour la première fois
Une fois que Google a indexé vos pages, recherchez les problèmes à l'aide du rapport sur l'état des résultats enrichis. Idéalement, il y aura une augmentation du nombre d'articles valides et pas d'augmentation du nombre d'articles non valides. Si vous détectez des problèmes au niveau des données structurées :
- Corrigez les éléments non valides.
- Inspectez une URL active pour vérifier si le problème persiste.
- Demandez la validation à l'aide du rapport d'état.
Après avoir publié de nouveaux modèles ou après avoir mis à jour votre code
Lorsque vous apportez des modifications importantes à votre site Web, surveillez l'augmentation des éléments non valides dans les données structurées.- Si vous constatez une augmentation du nombre d'éléments non valides, vous avez peut-être déployé un nouveau modèle qui ne fonctionne pas, ou votre site interagit différemment et de façon incorrecte avec le modèle déjà disponible.
- Si vous constatez une diminution du nombre d'éléments valides (sans augmentation du nombre d'éléments non valides), vous n'intégrez peut-être plus de données structurées dans vos pages. Utilisez l'outil d'inspection d'URL pour identifier la cause du problème.
Lors des analyses régulières du trafic
Analysez votre trafic de recherche Google à l'aide du rapport sur les performances. Les données indiquent la fréquence à laquelle votre page s'affiche en tant que résultat enrichi dans la recherche Google, ainsi que la fréquence à laquelle les internautes cliquent dessus et la position moyenne à laquelle vous apparaissez dans les résultats de recherche. Vous pouvez également extraire automatiquement ces résultats avec l'API Search Console.Dépannage
Si vous ne parvenez pas à mettre en œuvre ou à déboguer des données structurées, voici quelques ressources susceptibles de vous aider.
- Si vous utilisez un système de gestion de contenu (CMS) ou si une autre personne s'occupe de votre site, demandez à la personne en charge de vous aider. Veillez à lui transmettre tous les messages de la Search Console qui détaillent le problème.
- Google ne garantit pas que les fonctionnalités basées sur les données structurées apparaîtront dans les résultats de recherche. Pour consulter la liste des raisons courantes pour lesquelles Google n'affiche pas toujours votre contenu dans un résultat enrichi, reportez-vous aux consignes générales relatives aux données structurées.
- Vos données structurées comportent peut-être une erreur. Consultez la liste des erreurs de données structurées.
- Si vous avez reçu une action manuelle de données structurées concernant votre page, ces données seront ignorées (mais la page concernée apparaîtra peut-être toujours dans les résultats de recherche Google). Pour résoudre les problèmes de données structurées, utilisez le rapport sur les actions manuelles.
- Consultez à nouveau les consignes pour déterminer si votre contenu est bien conforme. Le problème peut être dû à une page contenant du spam ou à l'utilisation de balises qui en contiennent. Toutefois, il est possible qu'il ne s'agisse pas d'un problème de syntaxe et que le test des résultats enrichis ne puisse pas identifier le problème.
- Découvrez comment résoudre les problèmes liés aux résultats enrichis manquants ou à une baisse du nombre total de résultats enrichis.
- Prévoyez un certain temps avant que la réexploration et la réindexation soient effectuées. Gardez à l'esprit qu'il faut souvent compter plusieurs jours après la publication d'une page pour que Google puisse la trouver et l'explorer. Pour toute question d'ordre général sur l'exploration et l'indexation, consultez les FAQ sur l'exploration et l'indexation dans la recherche Google.
- Posez une question sur le forum Google Search Central.