創作網路故事的最佳做法

遵循以下創作網路故事的最佳做法，就能持續吸引觀眾。建議先把重心放在重要的事項，如果還有時間，再遵循其他建議的最佳做法。

述說故事

述說故事的重要最佳做法
影片優先	影片比文字或圖片更具吸引力。請盡可能使用影片，並以圖片和文字做為補充。

更多述說故事的最佳做法

述說故事的建議最佳做法
加入個人觀點	深入探索事實背後的意義，分享您的個人意見。讓故事更貼近個人，引起共鳴。
建立敘事線	在不同網頁之間營造故事的懸疑性。透過提供背景資訊和敘述文字，引導使用者逐步瞭解故事進展。在故事最後，為觀看完整內容的觀眾提供一點回報。

設計

設計的重要最佳做法
減少字元數	避免使用多個含有大段文字的網頁。建議將文字量減少至每頁大約 280 個半形字元，也就是一則 Tweet 的長度。
不要遮擋文字	確認網頁上的其他內容並未遮住文字。避免將文字內嵌在圖片中，這樣當系統為配合不同裝置尺存而調整圖片大小時，可防止文字受到遮擋。
讓文字保持在範圍內	確保觀眾都能看到網路故事中的所有文字內容。避免將文字內嵌在圖片中，這樣當系統為配合不同裝置尺存而調整圖片大小時，可防止文字溢位。
謹慎使用動畫	運用動畫讓故事更生動活潑，不過請避免使用容易使人疲乏的擾人或是重複性動畫。

更多設計最佳做法

設計的建議最佳做法
使用網路故事專用的行動號召	如果故事本來是為 Instagram、Snapchat 或 YouTube 等社交平台所創作，在重新改造故事時，請務必移除特定平台專屬的任何觀眾行動號召。請確保使用者能夠執行網路故事中建議的任何動作。
使用滿版影片和圖片	在故事中使用滿版的素材資源，提供觀眾更身歷其境的體驗。
避免使用低解析度或變形的圖片及影片	使用高畫質圖片，並謹慎調整圖片大小，以符合直立的畫面。
為封面網頁加上標誌	加入能代表品牌的高解析度標誌。
縮短影片長度	建議每個網頁的影片長度不要超過 15 秒，或者最長不超過 60 秒。
加入音訊	使用長度至少 5 秒且音量適中的高品質音訊片段，並確保語音能夠正常聽見。
考慮在僅有影片的故事中使用自動播放功能	在影片型的網路故事中使用影片自動播放功能，能為訪客帶來輕鬆愉快的使用體驗。

搜尋引擎最佳化 (SEO)

SEO 的重要最佳做法
提供優質內容	和任何網頁一樣，網路故事最重要的目的是提供觀眾實用又有趣的優質內容。因此請提供完整的敘事結構並遵循述說故事的最佳做法，以吸引觀眾繼續觀看。
保持標題簡短	標題長度不得超過 90 個半形字元。建議使用少於 70 個半形字元的描述性標題。
確保 Google 搜尋能找到您的故事	請勿在故事中加入 noindex 屬性，這個屬性會禁止 Google 為網頁建立索引，並讓該網頁無法顯示在 Google 上。此外，請將您的網路故事加入 Sitemap。您可以透過 Search Console 中的索引涵蓋範圍報表和 Sitemap 報告，確認 Google 是否能找到您的網路故事。
讓網路故事成為標準網頁	所有網路故事都必須為標準網頁。請確定每則網路故事都使用 link rel="canonical" 指向自身。例如：<link rel="canonical" href="https://www.example.com/url/to/webstory.html">
附加中繼資料	確保網路故事符合 AMP 故事中繼資料規範。您可以加入網頁中常用的標記，例如： title 和 description meta 標記 結構化資料 OGP Twitter 資訊卡

更多 SEO 最佳做法

SEO 的建議最佳做法
加入結構化資料	建議在網路故事中加入結構化資料，協助 Google 搜尋瞭解網路故事的結構和內容。
在圖片中加入替代文字	建議在圖片中加入替代文字，讓使用者更容易找到您的故事。
將故事整合到網站中	建議將網路故事整合進您的網站，例如在首頁或適當的類別頁面中設置連結。舉例來說，如果您的網路故事以旅遊目的地為主題，而您的網站其中有一頁列出了所有與旅遊相關的文章，那麼也請在該類別頁面上連結該則網路故事。也可以將網路故事連結至 www.example.com/stories 這類特殊到達網頁，這類網頁會從首頁等重要網頁中連出。
使用 AMP 故事網頁附件	AMP 故事網頁附件可呈現除了網路故事本身以外的其他資訊。這項功能非常實用，可針對網路故事呈現的內容提供額外詳細資訊、深入探討或未來發展。
在影片中加入字幕	加上影片字幕，方便觀眾進一步瞭解故事內容。避免在影片中直接嵌入字幕，以確保字幕不會與其他內容重疊或出現在畫面外。
對純影片故事進行最佳化調整	建議採用語意式 HTML 來建構網路故事。不過，有些網路故事編輯工具在匯出故事時採用的格式，可能會將每張投影片都轉換為一個影片檔案，並將該投影片中的所有文字嵌入影片中。在這種情況下，我們建議以 amp-video 元素 title 屬性的形式，加入該影片中的完整文字。再次提醒您，請只在網路故事無法使用語意式標記時才採用這種做法。
支援橫向顯示器	如要讓電腦版 Google 搜尋結果顯示網路故事，請支援橫向顯示器。

技術

技術方面的重要最佳做法
確保故事網頁格式正確	網路故事必須是有效的 AMP 網頁。為了避免 AMP 無效，請使用 AMP 驗證工具測試故事，並修正任何偵測到的錯誤。
請勿在代表圖片中加入文字	避免使用包含嵌入文字的圖片，因為當使用者在搜尋結果中預覽故事時，這類圖片可能會干擾故事的標題。如果使用者無法清楚閱讀標題，繼續閱讀的可能性就會降低。
加入大小適當和顯示比例合宜的代表圖片	請確保與 <amp-story> poster-portrait-src 屬性連結的圖片至少為 640x853 像素，且使用的顯示比例為 3:4。
加入顯示比例合宜的標誌	請確保與 <amp-story> publisher-logo-src 屬性連結的標誌圖片至少為 96x96 像素，顯示比例為 1:1。

更多技術最佳做法

技術方面的建議最佳做法
加入 og:image	建議在 <meta> 標記中加入 og:image，讓使用者更容易找到您的故事。

其他資源

• 「Google 中的網路故事」網站：以創作者為主要服務對象，提供網路故事製作相關資源。
• 讓網路故事顯示在 Google 搜尋上：為開發人員提供的指南，說明如何創作符合技術指南要求的網路故事，以便能在 Google 搜尋中顯示。
• 「AMP 故事」網站：以開發人員為主要服務對象，提供網路故事格式功能。
• 網路無障礙功能：提供相關提示，協助您確保網路故事可供所有使用者存取。
• 結構化資料指南：提供詳細說明，解釋如何加入結構化資料，以便協助 Google 搜尋瞭解您的內容。