方格子開發誌#6｜「文章閱讀頁」改版啦！ #愛情釀的酒
近期某個不算寧靜的夜晚，工程獅先生在忙完一切「有格調」的事務後，離開書桌（應該是電腦桌才對），走在自己小窩附近的街巷，提著不起眼的三公斤垃圾袋（不臭，所以不影響心情，但可能超過三公斤，微胖），走路的速度夾帶徐徐夜晚微風，看見黃色的國家動產物後，下意識不留情地將垃圾袋往那動產黑洞一丟，心喊著：「舊的不棄，新的不來！」
這應該就是近期方格子格鬥士們的心聲，雖然大家真滴忙得焦頭爛額，還是希望用剩餘的查克拉，逐步地提升平台體驗，讓不管是身為作者或讀者的格友們，都能夠在一次次的去蕪存菁之中，更順暢、更「有格調」（硬要前後呼應）地寫作和閱讀！
相信眼尖的格友們有發現，近期方格子在某個頁面上做了很大的視覺優化！沒錯，今天就是要跟各位聊聊──
方格子的「文章閱讀頁」又改版啦！ (⁎⁍̴̛ᴗ⁍̴̛⁎)
文章閱讀頁再次改版動機
繼前陣子我們推出了 AMP 版本的文章閱讀頁後，又經過格鬥士們仔細地討論與評估，希望能再次調整地更好，而有了這次的改版。主要是基於以下兩個核心動機：(￣^￣)ゞ
- 讓閱讀更專注：
在文章閱讀頁上，我們希望作者的創作成果，是讀者優先關注的重點，因此朝沉浸式閱讀方向進行了調整。 - 持續優化 SEO：
不只是頁面設計上的改動，在網頁結構也做了更有利於 SEO 的調整，為好內容爭取更多被 Google 自然曝光的可能。
沉浸式閱讀
更聚焦地閱讀起來
在沉浸式閱讀考量中，首先就是重新檢討過去頁首的專題主視覺區塊。以下圖圖一為例，可以看到專題文章在閱讀頁的頁首，會優先出現置頂的專題主視覺，讓閱讀者眼球容易失焦；同時若使用手機閱讀，加上遇到網路不那麼穩定的狀況時，會需要額外增加等待圖片加載時間，而影響到該次的閱讀體驗......
經過反覆討論後，我們才決定將此區塊移除，希望讀者們在一進入文章閱讀頁的當下，映入眼簾的就是清晰、大方、明確的文章標題，馬上能進入精彩的內容閱讀情境！工程獅先生在執行完這部分的改動後，首先觀看成果後的感覺就是四個字：
通體舒暢 ╮(╯▽╰)╭
更一致的閱讀動線
在閱讀動線的部分，我們從文末到頁尾都調了個遍！將色彩豐富的視覺感，更動為更平衡而沈穩的設計，主要調整兩個部分：
- 社群分享按鈕區調成灰階，用一致的顏色均化整體分享的概念。
- 文章關鍵字標籤的顏色一併淡化。
此兩項的優化，４８４讓大家讀到後面會多了點輕快愜意，一改以往可能被各種絢麗顏色閃爆你的視網膜？讓我們把要被閃爆視網膜的扣打留給明年的大稻埕煙火！ ≧ω≦
再來也有格友發現了，原倒數第二區域的「編輯精選專題」被隱藏了，直接接續「你可能也想看」的文章推薦與「本日熱門」區。
這是為了讓讀者可以在閱讀完一篇文章後，持續閱讀更多精彩的內容，並減少讀者在專題與文章的不同維度切換下而可能產生隱性的干擾（因為精選專題區塊是橫向操作，與其他所有區塊都是上至下的瀑布流動線是相反的）。
作者們別著急
有些作者或許會想：那，我的專題主視覺呢？你說啊！！(╯°□°）╯︵ ┻━┻
莫橘、莫慌、莫害怕！請繼續往下滑～～如下圖圖二所示，我們將過去單一的區域呈現，擴增成為有「作者介紹」與「專題介紹」的兩個區域！
這樣的版型可以讓讀者更全面地看到正在閱讀的文章，是來自哪位作者、被收錄在哪個出版專題內，可以直接追蹤、贊助或購買，以行動支持喜愛的作者！
持續優化 SEO
工程獅先生平時「有格調」的例行事務其中有一項便是時刻關注 Google 後台數據，持續優化 SEO，來爭取文章能夠更被 Google 喜歡，進而增加自然曝光。
不想理解火星文也沒關係，簡單來說，好的 SEO 代表較可能被 Google 認定為閱讀價值較高的頁面，在同樣的搜尋條件下，Google 會選擇優先展示品質好的頁面，等同你的內容被看見得機會更高了，是不是很像一種正向的能量循環帶動！(⊙o⊙)。
寫到肚子餓總結
在這次的文章閱讀頁改版上，相信大家應該都可以強烈感受到，整體閱讀體驗感相較過去更輕盈，「文章本位」的思維更強化，能夠讓讀者更沉浸在文章中舒適地閱讀，讓閱讀的深化成為可能；而整體脈絡上也因為色塊的色調沉穩化、區塊內容的專注化，讓整個頁面從頭到腳像是一系列的排毒過程（以前是有多毒？），不會充斥著太多的內容層次與維度相互干擾。
希望這次的文章閱讀頁全新改版可以帶給大家更輕巧、更有品質、更順暢的閱讀體驗蛤！∠( ᐛ 」∠)＿
愛情釀的酒
最後的最後，工程獅先生在下本篇開發誌的標籤時，老靈魂靈光一閃，想到了愛情釀的酒 XD
方格子從開始至今，都是在各方格友們的支持下慢慢成長茁壯，就像愛情長跑一樣，每個功能展現到發酵都是需要經過長時間的醞釀與吸取精華（以及格友們堅定的包容），過程可能百般滋味卻又陳年精華！這次想要分享這首「愛情釀的酒」，因為平台優化沒有結束的一天，而是像一首好歌一樣，不斷傳唱，越陳越香！
大家愉快：）
工程獅先生 敬上 2021-09-04
為什麼會看到廣告
206.9K會員
1.7K內容數
留言0
查看全部
