创建 Google Web Stories：发布商最佳实践指南

Google Web Stories 是可点击、互动且沉浸式的内容，类似于 Instagram 和 Facebook 的故事。. 

最初于 2018 年以 AMP Stories 的名义推出，Google 在 2020 年将这种视觉格式重新命名为 Web Stories ， ¹ 这或许部分是由于 AMP 技术在数字出版领域存在一些争议^{2 3} 。

经过更新和改进，谷歌的 Web Stories 以更丰富的视觉效果呈现，让发布者能够更好地掌控其创意输出和品牌形象。正如谷歌所说，Web Stories 是 “基于网络的流行故事格式，允许创作者托管和拥有自己的内容。”^⁴

根据2019年的一项研究，近三分之二的读者（64%）更喜欢故事性内容而非滚动式内容，因此 开发者应该专注于“利用”这种形式^。5

然而，同一项调查也显示， “许多设计陷阱会造成困惑、疲劳和沮丧”。因此，实施最佳设计实践对于打造最具影响力的网络故事至关重要。 

通过了解如何创建和发布视觉效果丰富的 Google Web Stories，发布商可以保持创作控制权， 培养品牌信任度， 并为其网站带来流量^。6 

什么是 Google Web Stories？

网络故事是一种视觉叙事形式，由一系列图像、视频以及文字和/或音频组成。内容可以分成特定的观看顺序，每个部分可以在几秒钟后自动显示，也可以在用户点击或轻触时显示。.

与 Snapchat 或 Instagram 上的 Stories 不同，Web Stories 不会在 24 小时后消失，这使得发布商也可以将此格式应用于常青内容。.

Web Stories 基于 AMP 构建，并继承了 AMP 的所有相关优势：

• 它可以嵌入任何网站
• 它可在任何浏览器上运行，包括移动设备和桌面电脑。
• 高装载速度
• 可在 Google 搜索结果中发现，包括通过 Web Stories Carousel 和 Google 图片

可点击故事的背景故事

Snapchat 首创故事模式，并将其作为应用程序的核心部分，当时很少有人想到这种叙事模式会如此成功。.

^然而，率先跟进的是 Instagram，如今它 拥有 5 亿用户。 随后是 WhatsApp、Facebook、Medium、Skype、YouTube、Twitter，甚至 LinkedIn 也都采用了这种格式。

此后，出现了一些值得注意的受害者， Twitter 、 Skype^和LinkedIn都宣布^放弃 Stories 格式。

与此同时，谷歌将其Stories功能纳入了 AMP规范，允许出版商在其在线故事讲述中使用这种格式^。11

Google Web Stories 的功能

Google Web Stories 已被证明是一种有效的在线故事讲述形式，上述 2019 年的研究表明，读者认为“可点击的故事示例比滚动式的故事示例更具视觉吸引力，也更容易浏览”。.

这一点在特定内容类型方面尤为突出，例如常青生活方式内容。. 

在谷歌的 Web Stories 中，发布者可以添加各种视觉内容：图像、声音、视频或动画。.

这些新闻报道可以被搜索引擎收录，并在用户搜索时显示出来。当用户进行新闻相关的搜索时，谷歌搜索会将它们以摘要的形式呈现在“热门新闻”栏目中。.

Web Stories 可以设计成响应式的，这意味着无论用户是在网页上查看还是在移动设备上查看，它们都会适应用户的屏幕尺寸。. 

发布商可以在页面的任何位置添加链接和行动号召 (CTA)。这有助于引导用户继续浏览其他页面、阅读更多文章或订阅。.

添加最后一页（称为书末页）可以突出显示社交分享和相关链接。.

如何创建 Google Web Stories – 最佳设计实践

对于 小型 出版商来说，谷歌让创建 网络 故事变得轻而易举。

谷歌网络创作者每周推出的教育系列节目“故事时间”的第三集 是个 不错的起点^。12 

创建 Google Web Stories 包括以下步骤。.

选择可视化编辑器

网络故事由一系列面板组成，用户可以点击切换或等待自动切换。.

每个新页面都由文本、图像和视频组合而成，视觉格式的特性决定了其内容必须生动且图文并茂。因此，可视化编辑器——无论是软件、插件还是在线服务——都是创建网络故事的第一步，或许也是最关键的一步。.

 创建 Google Web Stories 时，可以使用各种工具和一系列 Google 产品。.

对于拥有 WordPress 网站的内容创作者来说，真正需要考虑的插件只有两个：

网络故事

谷歌为 WordPress 开发了自己的 Web Stories 编辑器 ，谷歌将其描述为一款用户友好、“所见即所得的创作工具”。^¹³

创作故事

MakeStories 是一个开源的可视化编辑器，可帮助用户直接从 WordPress 网站的控制面板发布 Google Web Stories。

WordPress替代方案

对于 不使用 WordPress 但仍想在网站上实现 这种格式的小型 出版商来说 ，有一些 拖放式、无需代码的工具可用于 构建 Google Web Stories ，其中 Newsroom AI 和 MakeStories 是首选^。14

撰写故事草稿

谷歌给出的下一个建议是创建故事板，展示故事中每个画面将出现哪些图片和 内容。一个优秀的网络故事正是如此，它讲述了一个从头到尾的完整故事。 

谷歌提供 免费模板 ，帮助创作者创建新的故事^。15 

创意素材来源

从封面图片到最后一格漫画，找到合适的素材或许是创作新故事最关键的环节。.

发布者应确保使用替代文本，并确保不违反版权法。此外，务必记住所有全屏视频都应采用垂直格式。这将确保 Web Stories 占用最少带宽并尽可能快速加载。. 

开始创建

一旦构思完成，就可以进入选定的编辑器开始创作了。首先添加图片或视频，并撰写简洁明了的文字。标题要简短，行动号召（CTA）要醒目。提供指向目标网站的链接，鼓励观众订阅。.

在创作网络故事时，请参考 以下研究：

• 故事太长会让读者感到难以承受。
• 单个版面上内容过多容易造成混乱和读者疲劳。
• 读者喜欢行动号召和其他视觉提示。
• 只要位置和数量合适，可点击的故事就为通过广告实现盈利提供了绝佳的机会。

点击发布

Google Web Story 开发、素材搜集和创建完成后，就到了向全世界发布的时候了。使用可视化编辑器，只需按下发布按钮即可轻松完成发布。.

规模较大的出版商，或者拥有必要资源和技术专长的出版商，可能更喜欢按照 Google AMP 标准，使用 HTML、CSS 和 Javascript 从头开始​​创作故事。.

对 Web 故事进行编码可以很好地控制最终产品，并更容易与现有的 CMS 和代码库集成。.

别忘了SEO

在创作网络故事时，人们很容易沉浸于创意之中，但同时也要记住遵循最佳SEO实践，以确保最终的故事能够出现在搜索结果中。毕竟，网络故事也只是网页而已。.

谷歌提供了一系列 最佳 SEO 实践 ，这些实践也适用于 Web Stories。^¹⁶ 其中包括：

• 提供高质量内容
• 使用少于 70 个字符的描述性标题
• 避免使用 noindex 属性
• 使故事成为自我认可的经典
• 遵守 AMP 故事元数据指南¹⁷
• 使用 AMP 验证器 工具¹⁸
• 避免使用带有嵌入式文字的图片。
• 使用正确的海报图像尺寸和宽高比
• 确保标志的宽高比正确

Google Web Stories 的优秀示例

体验 Google Web Stories 的强大功能和多功能性的最佳方法是查看一些知名出版商的优秀案例：

人像模式示例

这些故事是专为移动设备体验而设计的。虽然也可以在电脑上访问，但大部分屏幕空间都无法充分利用。.

VICE 完美地运用了 Google Web Stories 格式，并利用其设计在新冠疫情期间制作了一系列经久不衰的生活方式内容，例如烹饪演示^。19

Refinery 29 也采用了 类似的 跳播视频技术来制作寓教于乐的故事^。20

《孤独星球》 展示了 在故事性内容中，精美的​​图片和有力的文字说明与视频一样引人入胜^。21

BBC新闻——香港便利贴抗议。22部分页面包含视频，并在视频无法加载或带宽不足以下载播放时提供图片作为备用。页面顶部和底部会引导读者访问更多与香港抗议活动相关的内容以及BBC新闻主页^。

CNN世界新闻——巴士底日：它如何激励了几个世纪的公民不服从运动。23^发表 日期，每张图片都注明了摄影师和 图片来源。它的文字量比BBC的例子要多得多。

如何通过 Google Web Story 获利

如果实施得当，全屏插页式广告可以成为出版商通过 视觉故事获利的一种有效方式。

在 Google Web Story 中插入广告需要配置一个支持 在 Web Story 中插入广告的广告平台 。

截至发稿时，在 Web Story 中插入广告的最简单方法仍然是通过 Google Ad Manager 或 Google AdSense 投放广告，两者都支持程序化广告， ^开源AMP 开发者社区表示。24

但是，其他广告平台也有办法整合对 Web Story 广告的支持，发布商也可以通过自己的广告服务器投放自定义广告。.

广告网络既需要 投放 有效的 AMPHTML 广告（包含额外的元数据以支持 AMP 运行时渲染），也需要集成 Fast Fetch。AMP 社区已提供了关于 AMPHTML 广告^²⁵ 、额外 元 数据标签^²⁶ 和 Fast Fetch 集成^²⁷的文档。

该社区还为有兴趣通过其广告网络投放广告的发布商编写了相关文档，但同时声明这是一个“更为复杂”的解决方案^。28

Google Ads 非常灵活，并且可以与 WordPress 插件 MakeStories 和 NewsRoom AI 无缝集成。.

另一种利用 Google Web Stories 盈利的方式是在故事中添加联盟链接或发布赞助内容。这可以包括指向各种网页的链接，例如 Patreon 页面或产品页面。.

采用 订阅付费模式 可以在文章开头和结尾处插入“阅读更多”链接，未订阅用户点击后将跳转到注册页面^。29

《澳大利亚人报》的 “视觉故事”栏目就采用了这种方式，每篇故事都作为付费内容的预览^。30

与任何 广告宣传 活动一样，必须考虑网站、读者群体和页面格式。

最后想说的话

Google Web Stories 采用了一种引人入胜的形式，这种形式人们已经在移动设备和社交媒体上习以为常了。.

对于任何规模的出版商来说，开发 Web Stories 都轻而易举，这得益于简单易用的无代码故事创作工具。Web Stories 的 优势 不仅在于其良好的用户体验，其加载速度和格式也使其成为 SEO 表现优异的理想之选。

创建 Google Web Stories 可以让发布商更好地控制自己的内容和品牌，带来自然流量，并提供越来越多的盈利机会。 

通过利用故事性内容，出版商可以在保持知识产权所有权的同时扩大其影响力。.