# Web Stories SEO 最佳实践

> 来源：Google Search Central

---

* Ranking and search appearance
  ** Visual Elements gallery  **
  ** Title links  **
  ** Snippets  **
  ** Images  **
  ** Videos  **
  ** Structured data  **
  ** Favicons  **

  * Site-specific guides
  ** Ecommerce  **
  ** International and multilingual sites  **

  * Data analysis
  ** Get started with Search Console  **
  ** Debug traffic drops  **
  ** Using Search Console and Google Analytics data for SEO  **
  ** Get started with Google Trends  **

[ Support ](https://developers.google.com/search/help) [ Blog ](https://developers.google.com/search/blog) [ What's new ](https://developers.google.com/search/news)

  ** All updates  **
  ** Documentation updates  **
  ** Ranking updates  **
  ** New YouTube videos  **
  ** Recent podcast episodes  **

[ Events ](https://developers.google.com/search/events) [ Case studies ](https://developers.google.com/search/case-studies)

`/`

  * English
  * Deutsch
  * Español
  * Español – América Latina
  * Français
  * Indonesia
  * Italiano
  * Polski
  * Português – Brasil
  * Tiếng Việt
  * Türkçe
  * Русский
  * العربيّة
  * हिंदी
  * ภาษาไทย
  * 中文 – 简体
  * 中文 – 繁體
  * 日本語
  * 한국어

Sign in

  ** Documentation **

[Search Console](https://goo.gle/searchconsole)

[ ](https://developers.google.com/search)

  ** Google Search Central **

  ** Documentation  **
    * More 
  ** Support  **
  ** Blog  **
  ** What's new  **
    * More 
  ** Events  **
  ** Case studies  **

  **Introduction**
  * Search Essentials

    **Overview**
    **Technical requirements**
    **Spam policies**

  * SEO fundamentals

    **SEO Starter Guide**
    **How Google Search works**
    **Creating helpful, reliable, people-first content**
    **Do you need an SEO?**
    **Maintaining your site's SEO**
    **Developer's guide to Search**
    **Get your website on Google**
    **Guidance on using generative AI**

  * Crawling and indexing

    **Overview**
    **File types Google can index**
    **URL structure**
    **Links**
    * Sitemaps

      **Learn about sitemaps**
      **Build and submit a sitemap**
      **Manage sitemaps with sitemap index file**
      * Sitemap extensions

        **Image sitemaps**
        **News sitemaps**
        **Video sitemaps and alternatives**
        **Combining sitemap extensions**

    * Crawler management

      **Ask Google to recrawl your URLs**
      **Troubleshoot crawl errors**
      * Google crawlers

        **List of Google crawlers**
        **Googlebot**
        **Reduce the Google crawl rate**
        **Verifying Googlebot and other Google crawlers**

    * robots.txt

      **Introduction to robots.txt**
      **How Google interprets the robots.txt specification**

    * Canonicalization

      **What is URL canonicalization**
      **How to specify a canonical URL with rel="canonical" and other methods**
      **Fix canonicalization issues**

    **Mobile site and mobile-first indexing**
    * AMP

      **AMP on Google Search guidelines**
      **Understand how AMP works in search results**
      **Enhance AMP content**
      **Validate AMP content**
      **Remove AMP content**

    * JavaScript

      **Understand the JavaScript SEO basics**
      **Fix search-related JavaScript problems**
      **Fix lazy-loaded content**
      **Dynamic rendering as a workaround**

    * Page and content metadata

      **Page metadata**
      * Meta tags

        **Meta tags and HTML attributes that Google supports**
        **Robots meta tag, data-nosnippet, and X-Robots-Tag**
        **noindex**

      **rel attributes**

    * Removals

      **Control what you share with Google**
      **Page removals**
      **Image removals**
      **Redacted information**

    * Site moves and changes

      **Redirects and Google Search**
      * Site moves

        **Changing your hosting**
        **Move a site with URL changes**

      **A/B testing**
      **Temporarily pause or disable a website**

  * Ranking and search appearance

    **Overview**
    **AI features**
    **Byline dates**
    **Favicons**
    **Featured snippets**
    **Flexible Sampling**
    **Google Discover**
    **Images**
    * Local features

      **Business details**
      **Top Places List**
      **Opting out of local search results**

    * Page experience

      **Understanding page experience**
      **Core Web Vitals**
      **Interstitials and dialogs**
      **Get started with signed exchanges on Google Search**

    **Preferred sources**
    * Ranking systems

      **A guide to Google Search ranking systems**
      **Reviews system**

    * Ranking updates

      **List of ranking updates**
      **Core updates**
      **Spam updates**

    **Site names**
    **Sitelinks**
    **Snippets**
    * Structured data

      **Understand how structured data works**
      **Structured data general guidelines**
      **Enriched search results**
      **Generate structured data with JavaScript**
      * Feature guides

        **All structured data features**
        **Article**
        **Book actions**
        **Breadcrumb**
        **Carousel**
        **Course list**
        **Dataset**
        **Discussion forum**
        **Education Q&A**
        **Employer aggregate rating**
        **Fact check**
        **Event**
        **FAQ**
        **Image metadata**
        **Job posting**
        **Local business**
        **Math solver**
        **Movie carousel**
        **Organization**
        * Shopping

          **Overview**
          **Product snippet**
          **Merchant listing**
          **Variants**
          **Loyalty program**
          **Merchant return policy**
          **Merchant shipping policy**

        **Profile page**
        **Q&A**
        **Recipe**
        **Review snippet**
        **Software app**
        **Speakable**
        **Subscription and paywalled content**
        **Vacation rental**
        **Video**

    **Title links**
    * Translated features

      **Translated results**
      **Ad networks and translation-related Google Search features**

    **Videos**
    **Visual Elements gallery**
    * Web Stories

      **Enable Web Stories on Google**
      **Best practices for creating Web Stories**
      **Web Story content policy**

    * Early Adopters Program

      **Package tracking**
      **Structured data carousels (beta)**

  * Monitoring and debugging

    **Debug drops in Search traffic**
    * Monitor with Search Console

      **Get started with Search Console**
      **Improve SEO with a bubble chart**
      **Using Search Console and Google Analytics data for SEO**

    * Debug with search operators

      **Overview**
      **site: search operator**
      **Google Images search operators**

    * Preventing and monitoring abuse

      **Overview**
      **Prevent user-generated spam**
      **Malware and unwanted software**
      **Prevent a malware infection**
      **Social engineering (phishing and deceptive sites)**
      **Google Safe Browsing Repeat Offenders Policy**

    **Get started with Google Trends**

  * Site-specific guides

    * Ecommerce

      **Overview**
      **Where content can appear**
      **Share product data**
      **Include structured data**
      **Launch a new website**
      **Write high quality reviews**
      **Design a URL structure**
      **Ecommerce site structure**
      **Pagination, incremental page loading, and Search**

    * International and multilingual

      **Overview**
      **Managing multi-regional and multilingual sites**
      **Tell Google about localized versions of your page**
      **How Google crawls locale-adaptive pages**

    * Explicit content

      **Guidelines for sites with explicit content**
      **What to do if your site is incorrectly flagged as explicit**

  * SEO fundamentals 
  ** Introduction  **
  ** Search Essentials  **
  ** SEO Starter Guide  **
  ** How Google Search Works  **
  ** Do you need an SEO?  **
  * Crawling and indexing 
  ** Sitemaps  **
  ** robots.txt  **
  ** Meta tags  **
  ** Crawler management  **
  ** Removals  **
  ** Canonicalization  **
  ** Redirects  **
  ** JavaScript SEO  **
  * Ranking and search appearance 
  ** Visual Elements gallery  **
  ** Title links  **
  ** Snippets  **
  ** Images  **
  ** Videos  **
  ** Structured data  **
  ** Favicons  **
  * Site-specific guides 
  ** Ecommerce  **
  ** International and multilingual sites  **
  * Data analysis 
  ** Get started with Search Console  **
  ** Debug traffic drops  **
  ** Using Search Console and Google Analytics data for SEO  **
  ** Get started with Google Trends  **

  ** All updates  **
  ** Documentation updates  **
  ** Ranking updates  **
  ** New YouTube videos  **
  ** Recent podcast episodes  **

  ** Home **
  ** Search Central **
  ** Documentation **

Send feedback 

# Best practices for creating Web Stories

To keep your readers engaged, follow our best practices for creating [Web Stories](/search/docs/appearance/enable-web-stories). We recommend focusing on the critical tasks first. If you have more time, follow the recommended best practices too. 

##  Storytelling 

Critical storytelling best practices |  Video first  |  Video is more engaging than text or images. Use as much video as possible, and supplement with images and text.   
---|---  
  
### More storytelling best practices

Recommended storytelling best practices |  Bring your perspective  |  Go beyond the facts. Share your opinions. Be the protagonist of your own story. Make it relatable.   
---|---  
Have a narrative arc  |  Create suspense in your story from one page to another. Bring the user along in the journey by providing context and narrative. Deliver payoff for sticking with you to the end.   
  
##  Design 

Critical design best practices |  Reduce your character count  |  Avoid including multiple pages with walls of text. Consider reducing text to approximately 280 characters per page (the length of a tweet).   
---|---  
Don't block text  |  Make sure text is not blocked by other content on the page. Avoid burned in text; by not using burned in text, you prevent text from being blocked when it gets resized to fit various device sizes.   
Keep text within bounds  |  Ensure that all text in your Web Story is visible to the reader. Avoid burned in text; by not using burned in text, you prevent text from overflowing when it gets resized to fit various device sizes.   
Use animations mindfully  |  Bring your stories to life with animations. Avoid distracting or repetitive animations which can cause fatigue.   
  
### More design best practices

Recommended design best practices |  Use Web Stories-specific call to action  |  When re-creating stories that were originally created for a social platform like Instagram, Snapchat or YouTube, be sure to remove any reader call-to-action specific to a certain platform. Make sure that users are able to follow any actions suggested in your Web Story.   
---|---  
Use full bleed videos and images  |  Include full bleed assets in your stories to create a more immersive experience for readers.   
Avoid low resolution or distorted images and videos  |  Use high-quality images, and take care when resizing images to portrait.   
Add a logo to your cover page  |  Include a high-resolution logo that represents your brand.   
Shorten video length  |  We recommend videos that are less than 15 seconds per page, or 60 seconds maximum.   
Include audio  |  Use high-quality audio clips that are at least 5 seconds long with balanced volume, and ensure speech is audible.   
Consider auto advance for video-only stories  |  Auto-advanced experience for video-based Web Stories could work well for a laid back experience.   
  
##  SEO 

Note: The same [SEO best practices](/search/docs/fundamentals/seo-starter-guide) for web pages also apply to [Web Stories](/search/docs/appearance/enable-web-stories). A Web Story is still a web page. Critical SEO best practices |  Provide high-quality content  |  Like any web page, providing high-quality content that is useful and interesting to your readers the most important thing you can do. Include a complete narrative and follow the storytelling best practices to keep your readers engaged.   
---|---  
Keep the title short  |  Keep titles shorter than 90 characters. We recommend using a descriptive title that is shorter than 70 characters.   
Make sure Google Search can find your story  |  Don't include a `noindex` attribute in your story; this attribute blocks Google from indexing the page and prevents it from appearing on Google. Additionally, add your Web Stories to your sitemap. You can check to see if Google can find your Web Stories with the [Index Coverage Report](https://support.google.com/webmasters/answer/7440203) and [Sitemaps Report](https://support.google.com/webmasters/answer/7451001) in Search Console.   
Make the story self-canonical  |  All Web Stories must be canonical. Make sure that each Web Story has a [`link rel="canonical"`](https://amp.dev/documentation/guides-and-tutorials/optimize-and-measure/discovery/) to itself. For example: `<link rel="canonical" href="https://www.example.com/url/to/webstory.html">` Note: If there are multiple versions of the same story in different languages, make sure to [tell Google about localized versions](/search/docs/specialty/international/localized-versions).   
Attach metadata  |  Make sure that your Web Stories follow the [AMP story metadata guidelines](https://amp.dev/documentation/components/amp-story/#metadata-guidelines). Include markup that you would normally include on a web page, such as:

  **`title`** and [`description`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta) `meta` tags
  **Structured data**
  **OGP**
  **Twitter card**

  
  
### More SEO best practices

Recommended SEO best practices |  Include structured data  |  We recommend [including structured data](/search/docs/appearance/structured-data/article#amp-sd) in your Web Story to help Google Search understand the structure and content of your Web Story.   
---|---  
Include alt text on images  |  We recommend including alt text on your images to improve your story's discoverability.   
Integrate stories into your website  |  We recommend integrating Web Stories into your website, such as linking them from your home page or category pages where applicable. For example, if your Web Story is about a travel destination and you have a page that lists all your travel articles, then also link the Web Stories on that category page. An additional special landing page like `www.example.com/stories` (which would then be linked from key pages like your home page) might also make sense.  There is no need to indicate in the URL of a Web Story that it is using the Web Stories format or AMP Stories technology. Ideally, your Web Stories are integrated into a wider URL strategy. For example, if your "New York Travel" articles are using a format like `"/new-york/travel/title-of-article.html"`, then consider using the exact same directory structure and URL format for your Web Stories.  
Use AMP story page attachments  |  [AMP story page attachments](https://amp.dev/documentation/components/amp-story-page-attachment/) can be used to present additional information alongside your Web Story. This can be useful to provide extra detail, deep dives, or onward journeys for the content presented in your Web Story.   
Include subtitles on video  |  Add [captions to your video](https://developer.mozilla.org/en-US/docs/Web/Guide/Audio_and_video_delivery/Adding_captions_and_subtitles_to_HTML5_video) to help readers better understand your story. Avoid captions that are burned into the video to ensure that they don't overlap with other content or flow off the screen.   
Optimize video-only stories  |  We recommend that you use semantic HTML to build your Web Story. However, some Web Story editor tools may instead export a story that formats each slide as a video file that bakes in all the text into the video. In this case, we recommend that you add the precise text displayed inside of the video as a `title` attribute on the [`amp-video`](https://amp.dev/documentation/components/amp-video/?format=stories) element. Again, only do this if you can't use semantic markup in your Web Stories.   
Add support for landscape displays  |  To enable Web Stories to appear in desktop Google Search results, add [support for landscape displays](https://amp.dev/documentation/examples/style-layout/desktop_and_landscape_mode_support/).   
  
##  Technical 

Critical technical best practices |  Make the story valid  |  Web Stories must be valid AMP pages. To avoid invalid AMP issues, test your Story using the [AMP Validator tool](https://validator.ampproject.org/) and fix any detected errors.   
---|---  
Don't include text in the poster image  |  Avoid using images that contain burned in text, as this could obstruct the title of your story when users preview your story in Search results. If users are unable to clearly read the title, they may be less likely to continue reading.   
Include the right poster image size and aspect ratio  |  Make sure that the image linked to your `<amp-story> poster-portrait-src` attribute is at least 640x853px and use an aspect ratio of 3:4.   
Include the right aspect ratio for the logo  |  Make sure that the logo image linked to your `<amp-story> publisher-logo-src` attribute is at least 96x96 px and aspect ratio of 1:1.   
  
### More technical best practices

Recommended technical best practices |  Include `og:image` |  We recommend including `og:image` in your `<meta>` tags to improve your story's discoverability.   
---|---  
  
##  Other resources 

  **Web Stories on Google**: Creator-focused resources to making Web Stories.
  **Enable Web Stories on Google Search**: Developer-oriented guide on building Web Stories that meet the technical guidelines required to appear on Google Search.
  **AMP stories website**: Developer-focused Web Stories format capabilities.
  **Web accessibility**: Tips to help ensure your Web Story is accessible to all users.
  **Structured data guidelines**: Details on adding structured data to help Google Search understand your content.

[ Previous arrow_back  Enable Web Stories on Google  ](/search/docs/appearance/enable-web-stories)

[ Next Web Story content policy  arrow_forward  ](/search/docs/appearance/web-stories-content-policy)

Send feedback 

Except as otherwise noted, the content of this page is licensed under the [Creative Commons Attribution 4.0 License](https://creativecommons.org/licenses/by/4.0/), and code samples are licensed under the [Apache 2.0 License](https://www.apache.org/licenses/LICENSE-2.0). For details, see the [Google Developers Site Policies](https://developers.google.com/site-policies). Java is a registered trademark of Oracle and/or its affiliates.

Last updated 2026-03-02 UTC.

Need to tell us more?  [[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2026-03-02 UTC."],[],["Prioritize video, using it extensively and supplementing with images/text. Minimize text per page to around 280 characters, and ensure text isn't blocked. For SEO, provide high-quality content, keep titles under 90 characters, ensure Google can index the story, and include appropriate metadata. Technically, ensure the story is a valid AMP page and uses correct image sizes. Use narrative arcs and share your own perspective. Use the correct aspect ratios for poster images and logos, and include an og:image tag.\n"]] 

  ** LinkedIn  **

Join us on LinkedIn

  ** YouTube  **

Watch our videos

  ** Blog  **

Subscribe to our RSS feed

  ** Podcast  **

Listen to Search Off the Record

  ** X (Twitter)  **

Join us on X (Twitter)

  * ### Get support

    ** Go to the help forum **
    ** Submit a question for office hours **
    ** Report spam, phishing, or malware **
    ** More support resources **
  * ### Resources

    ** Do you need an SEO? **
    ** SEO Starter Guide **
    ** Status of Search systems **
    ** Search Console documentation **
    ** Case Studies **
  * ### Tools

    ** Search Console **
    ** Rich Results Test **
    ** PageSpeed Insights **
    ** AMP Test **

[ ](https://developers.google.com/)

  ** Android **
  ** Chrome **
  ** Firebase **
  ** Google Cloud Platform **
  ** Google AI **
  ** All products **

  ** Terms **
  ** Privacy **
  * Manage cookies 

  * English
  * Deutsch
  * Español
  * Español – América Latina
  * Français
  * Indonesia
  * Italiano
  * Polski
  * Português – Brasil
  * Tiếng Việt
  * Türkçe
  * Русский
  * العربيّة
  * हिंदी
  * ภาษาไทย
  * 中文 – 简体
  * 中文 – 繁體
  * 日本語
  * 한국어
