長內容的可以讓你的網站擁有超越視覺美感的吸引力，給用戶的愉悅感就不僅僅源自于眼睛。

先撇開用戶興趣和碎片時間的爭論，我們來聊聊較長的內容在網頁設計中應當注意的問題吧。對于網站和APP而言，長內容，或者說長文，可能是內容策略中最有價值的一個組成部分（前提是它并不是無聊內容的堆砌）。用戶喜歡好故事，而長內容所提供的沉浸式的閱讀感受則能夠為用戶提供引人入勝的體驗。

為了能夠讓用戶保持興趣不停讀下去，你必須提供令人愉悅的設計和交互，讓內容從頭到尾的體驗都是一致的。想要達成這個目標，需要有針對性地進行設計。

大量的留白

長文的內容如果堆積到一起，是相當具有壓迫力的，所以，讓用戶不會為之厭倦，空間的運用是首要的技巧。

如果文章內容看起來太重，用戶肯定會為之感到恐懼的。通過合理的留白和排版設計，讓長文更容易為用戶所瀏覽和快速掃視，讓內容的視覺重量相應的降低，讓它們看起來更加友好。

你可以考慮控制下面的留白來達到降低視覺重量的目的：

• 控制內容和屏幕邊緣之間的間距
• 控制行間距和段間距
• 圖片、視頻等非文本視覺元素周圍的留白

有目的地運用動效

當頁面內容太長，用戶需要長時間的滾動翻頁，這個時候，頁面輔助導航的視覺線索就顯得非常重要了。你可以考慮使用引導性的動效，比如箭頭、按鈕或者視差特效，用以引導用戶。

這些微小的動效通常不會給長文或者故事帶來割裂性的體驗，甚至會讓用戶在瀏覽過程中感受到愉悅。

視頻動畫則是吸引用戶的另外一個利器。雖然絕大多數的視頻會打破長內容的閱讀流暢性，但是它可以為用戶瀏覽提供一個修整調劑的機會，也可以置于開頭，作為一個引子。

無論你是打算置于長文開頭作為介紹，還是置于中間用作間隔，都盡量保持簡短，盡量不要讓它自動播放，可能會分散用戶的注意力。

視差滾動這種手法也相當值得運用，一邊瀏覽一邊有動畫“隨之舞動”的體驗是相當有趣的。相當值得注意的是，視差滾動的動效不需要復雜，簡單的動效不僅節省性能，而且不會喧賓奪主，保持引人入勝的體驗的同時還不打斷閱讀。

加入插畫

對于長文而言，插畫是必不可少的組成部分。如果你的內容正好是故事的話，插畫的優勢就顯得更加明顯了。

將插圖分散地加入到文章的各個部分，能夠強化內容的故事性，提升用戶的體驗和參與度，圖文并舉能夠讓用戶更輕松獲取信息。這種技巧對于小說和缺少清晰視覺形象的文本而言，特別有用。

有策略地配圖

配圖的放置位置其實是很有技巧的。一些好的長文在圖文搭配上其實是遵循一定套路的，因為要讓整體符合美學特征，閱讀流暢，還要讓文字和圖片配比正確，整個規則就不難推導出來了：

1. 設計一個頂部大圖
2. 添加介紹性的文本
3. 加入高清大圖
4. 添加子標題
5. 設計易于閱讀的正文文本
6. 在設計子章節內容的時候，遵循３和５兩個步驟

絕大多數的圖片應當進行適當縮放，居中顯示，內容不要環繞在周圍。這種排版方式基本上是模仿傳統的圖書排版來的，這種方式為用戶來帶自然的閱讀流程和舒適的體驗。

這種設計流程幾乎適合所有的數碼設備的長文內容設計，不論是手機、平板還是桌面端網頁。

強化文本閱讀體驗

不要害怕創造優質的閱讀體驗。既然是長文，大量的文本是不可避免的。你沒有必要為每一張圖片搭配一個風騷的動畫效果，但是你一定要做好排版，確保流暢的閱讀感受，讓用戶始終能夠保持閱讀的興趣。

• 在長文中借助大量的子標題將文章分隔成不同的章節，讓字體大小和正文區分開，讓用戶一眼可辨。
• 使用粗體、色彩和斜體讓特定的段落或者句子更加引人注意。
• 使用引用的文本信息，便于用戶抓住內容核心。

滾動應該是直觀的

滾動操作并不是新東西，所以你應當讓滾動操作顯得直觀，特別是當你在滾動過程中加入一些不一樣的東西的時候。

炫酷的滾動效果，比如視差滾動，能夠提升長文的閱讀體驗。但是這種設計千萬不能過，滾動的特效應當符合用戶的基本預期，而不是過于意外。

滾動閱讀的體驗應當和內容無縫地整合起來，用戶在瀏覽信息的過程中，滾動特效應當有助于內容的可讀性，而不是干擾。

呈現進度

Medium 最大的特點是每篇文章都會標識上平均閱讀時間。而Polygon 則會在屏幕左側展示閱讀的進度，用戶在閱讀的過程中能夠清晰的判斷閱讀的進度，并且能夠對最終花費的時間有一個明顯的預期。

每一個閱讀進度“里程碑”的完成，都能給用戶帶來一定的成就感。

另外一種為用戶展現進度的設計，則是將內容直接劃分為不同的章節，并且提供相應的導航進度條。這種進度條不僅可以幫助用戶跳過特定的章節，而且更加便于返回特定的位置。這種設計能夠讓用戶便捷的掌控長文的內容，獲得閱讀的愉悅感。

講述一個驚艷的故事

好的長文大多是從一個好故事開始的。如果你需要將一個故事講述給別人，那么用長內容來展示可能是最佳答案。

但是，千萬不要被慣性思維給限制住，長內容并不一定必須是純文字的。用最合理的媒介來呈現信息才是正確的思路。國家地理的“Hiking the Grand Canyon”使用大量的圖片和地圖來講述故事，相當值得一看。

當然，再好的東西也不能一次給太多。即使頁面設計的再好，一個頁面需要翻幾百次才看得玩，誰都受不了。

如果故事結束了，頁面也最好收尾，另外的故事，換一個頁面展現吧。

結語

長內容的可以讓你的網站擁有超越視覺美感的吸引力，給用戶的愉悅感就不僅僅源自于眼睛。

對于小企業而言，優質的長內容能夠給網站帶來更強的黏度以及更快的排名提升速度，在品牌建設和社交媒體上，這些長內容都能帶來更多的價值。

譯文來自：優設

譯者：@陳子木

原文地址：designshack

原文作者：CARRIE COUSINS