編輯導(dǎo)語(yǔ)：如何能夠設(shè)計(jì)出更加好用、方便的CMS系統(tǒng)，進(jìn)而提升用戶的系統(tǒng)使用體驗(yàn)？也許你可以借鑒本篇文章里作者的系統(tǒng)設(shè)計(jì)思路，在頁(yè)面管理、菜單管理等層級(jí)上做好設(shè)計(jì)策略。本文作者就針對(duì)CMS系統(tǒng)的設(shè)計(jì)案例做了復(fù)盤，一起來(lái)看一下。

書接上篇 “產(chǎn)品日記（1）：CMS系統(tǒng)一階段復(fù)盤” ，我們利用欄目和頁(yè)面內(nèi)容管理可以完成了門戶網(wǎng)站的基本骨架搭建，對(duì)于可用性來(lái)說(shuō)已經(jīng)能做到可用狀態(tài)，為了更好的運(yùn)營(yíng)以及用戶體驗(yàn)，我做了第二階段的迭代設(shè)計(jì)，使得由基本可用盡量變得易用甚至好用，因此有了第二階段的迭代以及此復(fù)盤。

（迭代方向和內(nèi)容可能由項(xiàng)目而異，僅代表團(tuán)隊(duì)主觀想法）

在原本的欄目與內(nèi)容管理的骨架上， 新增了對(duì)應(yīng)的自由頁(yè)面管理、導(dǎo)航菜單管理、標(biāo)簽管理、廣告管理等功能模塊，實(shí)現(xiàn)更好的運(yùn)營(yíng)和網(wǎng)站管理。

如果把欄目和對(duì)應(yīng)的內(nèi)容比喻是網(wǎng)站的骨架的話，那么后續(xù)增加的頁(yè)面管理、前端組件與菜單管理等等，均可以作為網(wǎng)站的皮膚和著裝，也標(biāo)示著網(wǎng)站變得越來(lái)越豐滿和靈活。

一、頁(yè)面管理：實(shí)現(xiàn)更便捷的網(wǎng)站頻道管理

頻道的概念在很多網(wǎng)站都會(huì)出現(xiàn)，可能會(huì)根據(jù)不同的主題或者內(nèi)容專題，頁(yè)面內(nèi)容也會(huì)不同。

實(shí)現(xiàn)同一站點(diǎn)的不同專題頻道，可以使用頁(yè)面管理的模式進(jìn)行配置，將首頁(yè)弱化成其中一個(gè)頁(yè)面，從而支持新增多個(gè)不同的頁(yè)面配置，利用共用的欄目架構(gòu)，搭建出和首頁(yè)內(nèi)容不同，樣式不同的頁(yè)面，然后通過(guò)組件的鏈接或者導(dǎo)航菜單，將入口放置在所需的位置，從而豐富網(wǎng)站的內(nèi)容，采用多個(gè)子頻道的模式。

搭建頁(yè)面的過(guò)程中，建議利用通用組件的模式，通過(guò)組合不同的組件，調(diào)整組件的排序，來(lái)表達(dá)不同的網(wǎng)站頁(yè)面展示需求。

通用組件作為組成頁(yè)面的主要元素，可以預(yù)先設(shè)置好對(duì)應(yīng)的樣式和展示內(nèi)容，配合欄目來(lái)進(jìn)行不同形式的展示。每個(gè)CMS系統(tǒng)中均會(huì)有自己風(fēng)格的組件庫(kù)，而組件庫(kù)的豐富程度也會(huì)影響網(wǎng)站的展示靈活度，組件也是作為頁(yè)面配置中的基本要求。

同時(shí)，因?yàn)椴煌捻?yè)面主題可能會(huì)需要匹配不同的導(dǎo)航菜單，所以必要時(shí)需要同時(shí)增加對(duì)導(dǎo)航菜單的管理，邏輯和頁(yè)面管理一樣，通過(guò)不同的導(dǎo)航與頁(yè)面的搭配，配置出更多不一樣的網(wǎng)站頻道。

二、標(biāo)簽管理：實(shí)現(xiàn)靈活的頁(yè)面查詢與搜索優(yōu)化

在SEO中，關(guān)鍵詞作為一個(gè)搜索元素，一定程度上決定著網(wǎng)頁(yè)的流量。同時(shí)站內(nèi)的搜索中，也需要依賴關(guān)鍵詞來(lái)定位對(duì)應(yīng)的頁(yè)面。

引入標(biāo)簽管理，就是為了解決搜索相關(guān)的網(wǎng)頁(yè)定位問(wèn)題。通過(guò)標(biāo)簽的引導(dǎo)來(lái)為對(duì)應(yīng)的頁(yè)面引流，提高頁(yè)面的流量，或者用于快速查找和定位。

在內(nèi)容編輯的設(shè)計(jì)中，引入標(biāo)簽字段來(lái)給每個(gè)內(nèi)容頁(yè)面打上標(biāo)簽，添加的標(biāo)簽就可以作為此頁(yè)面的搜索關(guān)鍵詞。利用標(biāo)簽管理功能，批量調(diào)整標(biāo)簽的內(nèi)容或者對(duì)標(biāo)簽進(jìn)行分類等，可以有效提高標(biāo)簽的使用效果。

這里需要注意的是，結(jié)合頁(yè)面標(biāo)簽關(guān)鍵詞的搜索需求，需要提前與前端同事做好技術(shù)溝通，由于前端頁(yè)面存在單頁(yè)面模式和多頁(yè)面模式兩種技術(shù)選型，對(duì)SEO影響是不一樣的。

三、廣告管理：實(shí)現(xiàn)廣告形式的可配置化

對(duì)于引流類網(wǎng)站來(lái)說(shuō)，廣告位是一個(gè)十分重要的東西，而一般網(wǎng)站的廣告及入口大都在banner中展示，前面在進(jìn)行頁(yè)面配置的過(guò)程中，我們可以利用banner組件，創(chuàng)建出多個(gè)banner，對(duì)生成的banner進(jìn)行ID和名稱標(biāo)記，在進(jìn)行廣告管理時(shí)，就可以對(duì)廣告鏈接進(jìn)行投放到對(duì)應(yīng)的banner位置中。配置好生效、失效時(shí)間等，實(shí)現(xiàn)對(duì)廣告鏈接的展示。

站內(nèi)頁(yè)面廣告也可以先搭建好內(nèi)容頁(yè)面之后，再講欄目關(guān)聯(lián)到廣告位中。同時(shí)，記得配置手動(dòng)上下架，使得廣告的展示和管理更加靈活。

同時(shí)廣告形式可以根據(jù)自身需求進(jìn)行設(shè)計(jì)，不局限于banner中，還可以管理彈窗、組件等形式的廣告（可見下框架圖）。

總體來(lái)看，我對(duì)CMS能力框架大致作了如下劃分，主要包含了 基礎(chǔ)能力、運(yùn)營(yíng)能力、適配能力、高階能力幾個(gè)區(qū)塊，構(gòu)成了CMS系統(tǒng)的產(chǎn)品模塊地圖。相對(duì)于帝國(guó)CMS（EmpireCMS）來(lái)說(shuō)可能只是占了全域的一部分，考慮到自身產(chǎn)品需求，因此規(guī)劃了一個(gè)簡(jiǎn)化版本，以供參考。

由于CMS系統(tǒng)受網(wǎng)站類型和用途的影響，會(huì)有不同的設(shè)計(jì)模式，也是因?yàn)槿绱?，?nèi)容管理的設(shè)計(jì)暫時(shí)并沒(méi)有很統(tǒng)一且很好用的設(shè)計(jì)思路和邏輯，需要靠產(chǎn)品經(jīng)理根據(jù)自己產(chǎn)品的特點(diǎn)和需求，在大的框架思路下補(bǔ)充差異化和個(gè)性化的產(chǎn)品功能設(shè)計(jì)。

總體思路均是離不開通用化和解耦，通過(guò)通用組件和獨(dú)立功能模塊搭配出所需要的網(wǎng)站功能。也是由于沒(méi)有嚴(yán)格的標(biāo)準(zhǔn)限制，讓CMS的設(shè)計(jì)更具自由度。

本文由 @大飛Eric 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來(lái)自Unsplash，基于CC0協(xié)議