無論是PC端還是移動端都會有首頁，但是后臺往往是不需要首頁的。為什么？因為前端面對的是不了解你的用戶，所以需要首頁把你最想告訴的用戶的東西給展示出來。而后臺不同，使用的人本身就是對你的平臺了解。即使是第三方服務(wù)的后臺，也是信任你才使用的平臺。所以前端偏重展示和簡潔為主，后臺偏重邏輯和使用度。所以前端頁面，更注重的是UI設(shè)計的排版和布局，前端工程師切圖和炫酷的效果。后臺頁面更注重后臺工程師的邏輯、數(shù)據(jù)調(diào)用。今天主要說一說web端的首頁。
web端頁面展示復(fù)雜，我們以用戶體驗五要素（戰(zhàn)略層、范圍層、結(jié)構(gòu)層、框架層、表現(xiàn)層）和簡約至上四策略（刪除、組織、影藏、轉(zhuǎn)移）作為指導(dǎo)思想。設(shè)計的web首頁的時候，我們要展示簡潔大方也要思考周密，但有時候真的會有遺漏怎么辦？那我們可以從以下十步去完成，不會有遺漏。
一、產(chǎn)品整體布局
整體布局顯示從我們的業(yè)務(wù)出發(fā)，首先思考我們的用戶是誰？進入首頁，首屏展示一定是要告訴用戶我們是干什么的？那些首頁分類的導(dǎo)航起到就是告訴用戶我們是干什么的。然后從第二屏開始，告訴用戶為什么要選擇我們？然后告訴用戶我們是怎么解決這些問題的。從用戶角度出發(fā)，首次進入首頁看見的所有產(chǎn)品和服務(wù)的大類目。這些是我需要的嗎？然后開始瀏覽首頁下滑，找到買這個服務(wù)和商品信任的理由和價格是不是優(yōu)惠。整體布局思考從WHO，WHAT，WHY，HOW的層面進行分解，簡單說就是3W1H法則。
二、用戶需求確認
特別電商和O2O產(chǎn)品在web端首頁的商品分類很重要。在web端首頁展示產(chǎn)品分類夠不夠直達用戶心理很重要。好的產(chǎn)品分類可以讓用戶導(dǎo)流。所有設(shè)計產(chǎn)品分類時，一定是按合理的用戶認知進行排列。這里分類就牽涉到用戶需求。我們在確認了用戶畫像后，建立了用戶用例。這個時候用戶需求已經(jīng)確認。比如用戶用例把用戶整體購買流程和順序完全模擬出來。怎么確認這些需求？1、流量品的需求路徑。2、流量品的路徑周邊盈利品類目展示。3、盈利品的需求路徑。確認這些后，不僅業(yè)務(wù)也是從用戶需求出發(fā)了，相近的需求安排，可以不按常規(guī)安排也是了解用戶需求很重要的。從點擊分類，進入列表頁，再進入商品詳情頁，再點擊購買。這一套需求路徑需要站在用戶角度，我們往往太局限于業(yè)務(wù)角度。
三、競品設(shè)計分析
競品分析有時候在我們看來可能是抄襲，但是借用喬布斯話說，這就是借鑒了。但是競品分析依舊重要，我們必須時刻關(guān)注對手的動向。在頁面布局時，其實你會發(fā)現(xiàn)產(chǎn)品思考點越來越重合，因為業(yè)務(wù)重合性的關(guān)系。設(shè)計層面卻是不同的，是基于自身業(yè)務(wù)展示的。這里需要思考的是，對手上的這個塊頁面需求點是哪塊？對手又上了哪些業(yè)務(wù)？他的下一階段產(chǎn)品目標是什么？然后再思考我們是不是可以上這個頁面？最后，在產(chǎn)品設(shè)計可以采取不一樣的展示風(fēng)格，不一樣的展示風(fēng)格基于用戶層面去思考。哪怕小小的設(shè)計展示不同，也是打動用戶的關(guān)鍵。比如，web端你鼠標下滑動時，你的頂部工具欄是吸頂式導(dǎo)航，就能很好吸引用戶注冊你網(wǎng)站。如果在閱讀網(wǎng)頁時，你加入了小小返回首頁功能，用戶就更能進入沉浸式閱讀。在移動端設(shè)計時，哪怕你返回有一個向右滑動手勢比沒有好很多，技術(shù)上只是多了十幾行代碼。
四、功能模塊確認
從3W1H和競品分析確認后，我們功能模式其實大致都可以確認。首屏的全部分類展示和banner圖展示。頂部的吸頂式工具欄。第二屏展示熱門服務(wù)，熱門服務(wù)的吸引點在于告訴我們產(chǎn)品的優(yōu)勢。展示運營活動和信任的用戶展示。后面是SEO頁面和常用頁面底部。每個功能模塊確認都是從產(chǎn)品設(shè)計和業(yè)務(wù)邏輯進行支撐，最后通過QA的測試用例進行模擬測試。功能模塊確認需求注意的是：1、展示的功能是否直觀。2、展示的功能是不是表達清楚，用戶了解。3、展示的功能是不是容易操作理解。4、展示的功能上下銜接是不是合理。
五、布局排版簡潔
web端布局排版越來越簡潔了，從90年代那種談屏幕框漫天飛，到00年代頁面布局小而雜亂?，F(xiàn)在web端頁面展示也繼承了移動端一樣的特性，簡潔大方。web端頁面設(shè)計也經(jīng)歷了3個時代變更。在排版合理基礎(chǔ)上，簡潔并不是意味著簡單。我們要避免簡潔就是簡單的誤區(qū)。而是要用簡單的語句和圖片解釋清楚我們是干什么的。頁面整體呈現(xiàn)出統(tǒng)一性。上下視覺保持一致性，不要使得頁面分散用戶的注意力。每個往下滑動的頁面都是需要層層吸引用戶的。文字圖片整體簡潔和色調(diào)一致性容易讓用戶進入沉浸式瀏覽和思維中。
六、交互設(shè)計考量
交互設(shè)計上考量一定是簡單交互為主，交互設(shè)計邏輯性是關(guān)鍵。如果有位很好的交互設(shè)計師，他一定幫助你從用戶心理進行設(shè)計。當(dāng)然我們產(chǎn)品經(jīng)理也一定是這方面的高手?！稙鹾现姟泛汀兑c》是二本不錯從心理層面解析用戶的書籍。交互從展示頁面到點擊后展示頁面都是層層相扣的。在首頁設(shè)計上，一定是簡潔和吸引用戶點擊下去的想法，文字和圖片是吸引的關(guān)鍵點。文字從用戶心理角度去思考，圖片從業(yè)務(wù)展示角度思考。因為文字更具有想象空間，所以適合用戶心理角度思考。圖片設(shè)計從業(yè)務(wù)角度思考，用戶喜歡更專業(yè)的，因為他們相信專業(yè)就是放心的商品和服務(wù)。而在運營模塊和banner，主題活動展示就不同了，需要一些炫酷的設(shè)計和復(fù)雜展示，這里一定是和web端首頁設(shè)計不同的，它們需要炫酷的設(shè)計吸引用戶，不需要迭代。
七、內(nèi)容容易理解
產(chǎn)品設(shè)計上，我們往往忽視文字展示重要性。其實哪怕在五年后的產(chǎn)品，文字依舊是很重要的單位。無論是圖片還是視頻都是基于文字的。如何做到內(nèi)容的可理解性呢？1、用戶理解的語句。比如大量網(wǎng)絡(luò)流行語和二次元年輕化的語句。2、內(nèi)容閱讀無重合的獨特性。比如你這里有，我這里也有。但是我們內(nèi)容解釋更簡單短小精悍，更容易理解，那么用戶就來我們這里了。3、最重要的文字進行重點突出。用戶在碎片化場景下閱讀內(nèi)容越來越多，把重點展示出來，用戶就可以快速了解，可以快速做后續(xù)用戶行為。
八、站外引流思考
web端與M端最大不同點就是SEO需要在web端進行展示，因為首頁大部分都是作為落地頁進行展示。而首頁也是最能解釋清楚我們的產(chǎn)品是做什么的頁面。也是用戶體驗和打開幾率最高的頁面。SEO我們需要建立相關(guān)鏈接、相關(guān)服務(wù)、相關(guān)服務(wù)的問題解答、網(wǎng)站地圖、相關(guān)服務(wù)的分支：城市、服務(wù)商入口、網(wǎng)站自身的招聘、關(guān)于我們都是SEO建立關(guān)鍵點。然后思考站外每一個流量入口落地頁在哪里。需要多少關(guān)鍵詞落地在首頁的。每一個站外進來的用戶，都是不一樣的，針對不一樣的用戶，我們盡量展示他們需要的內(nèi)容。在數(shù)據(jù)PV和UV統(tǒng)計下，根據(jù)28原則，如果能留住那80%的用戶進入沉浸式閱讀已經(jīng)不容易了。
九、整體邏輯架構(gòu)
web端首頁頁面前后邏輯是否可以讓用戶進行沉浸式瀏覽時關(guān)鍵，哪怕是一個小小的功能和不是主打的商品和服務(wù)，只要能打動用戶就是成功的。做好更個數(shù)據(jù)埋點分析，更好支撐我們的產(chǎn)品迭代和更好的升級。整體邏輯就是每一個點擊后的頁面都是符合用戶心理和正常邏輯的。后續(xù)的每一個列表頁和商品詳情頁都是可以進行相互關(guān)聯(lián)的，在用戶不知不覺中就進入沉浸式瀏覽的狀態(tài)了。1、做到頁面關(guān)聯(lián)性強。2、頁面展示結(jié)構(gòu)合理。3、整體框架和邏輯符合用戶瀏覽角度。
十、總結(jié)梳理
最后把所有的業(yè)務(wù)邏輯和用戶行為進行總結(jié)展開和思維維度回收。留下思考中合理的，和現(xiàn)階段先完成的需求的，建立需求管理池，安排優(yōu)先級。然后把總結(jié)核心的需求功能的梳理和思考，把所有步驟進行思維回收總結(jié)。接下去就去找技術(shù)吧，進行需求評審，開發(fā)周期。然后進行項目排期。
總結(jié)：1、產(chǎn)品整體布局：3W1H法則。2、用戶需求確認：流量品和盈利品的思考。3、競品設(shè)計分析：不同點是不是適用于我們產(chǎn)品。4、功能模塊確認：功能模塊的合理性。5、布局排版簡潔：簡潔并不是簡單。6、交互設(shè)計考量：文字從用戶角度，圖片從業(yè)務(wù)角度。7、內(nèi)容容易理解：重要內(nèi)容的突出。8、站外引流思考：完善的SEO落地頁。9、整體邏輯架構(gòu)：頁面的關(guān)聯(lián)性。10、總結(jié)梳理：思維維度展開的再回收。
本文系作者：
運營那些事兒
授權(quán)發(fā)表，鳥哥筆記平臺僅提供信息存儲空間服務(wù)。
本文為作者獨立觀點，不代表鳥哥筆記立場，未經(jīng)允許不得轉(zhuǎn)載。
《鳥哥筆記版權(quán)及免責(zé)申明》
如對文章、圖片、字體等版權(quán)有疑問，請點擊
反饋舉報
我們致力于提供一個高質(zhì)量內(nèi)容的交流平臺。為落實國家互聯(lián)網(wǎng)信息辦公室“依法管網(wǎng)、依法辦網(wǎng)、依法上網(wǎng)”的要求，為完善跟帖評論自律管理，為了保護用戶創(chuàng)造的內(nèi)容、維護開放、真實、專業(yè)的平臺氛圍，我們團隊將依據(jù)本公約中的條款對注冊用戶和發(fā)布在本平臺的內(nèi)容進行管理。平臺鼓勵用戶創(chuàng)作、發(fā)布優(yōu)質(zhì)內(nèi)容，同時也將采取必要措施管理違法、侵權(quán)或有其他不良影響的網(wǎng)絡(luò)信息。
一、根據(jù)《網(wǎng)絡(luò)信息內(nèi)容生態(tài)治理規(guī)定》《中華人民共和國未成年人保護法》等法律法規(guī)，對以下違法、不良信息或存在危害的行為進行處理。
1. 違反法律法規(guī)的信息，主要表現(xiàn)為：
1)反對憲法所確定的基本原則；
2)危害國家安全，泄露國家秘密，顛覆國家政權(quán)，破壞國家統(tǒng)一，損害國家榮譽和利益；
3)侮辱、濫用英烈形象，歪曲、丑化、褻瀆、否定英雄烈士事跡和精神，以侮辱、誹謗或者其他方式侵害英雄烈士的姓名、肖像、名譽、榮譽；
4)宣揚恐怖主義、極端主義或者煽動實施恐怖活動、極端主義活動；
5)煽動民族仇恨、民族歧視，破壞民族團結(jié)；
6)破壞國家宗教政策，宣揚邪教和封建迷信；
7)散布謠言，擾亂社會秩序，破壞社會穩(wěn)定；
8)宣揚淫穢、色情、賭博、暴力、兇殺、恐怖或者教唆犯罪；
9)煽動非法集會、結(jié)社、游行、示威、聚眾擾亂社會秩序；
10)侮辱或者誹謗他人，侵害他人名譽、隱私和其他合法權(quán)益；
11)通過網(wǎng)絡(luò)以文字、圖片、音視頻等形式，對未成年人實施侮辱、誹謗、威脅或者惡意損害未成年人形象進行網(wǎng)絡(luò)欺凌的；
12)危害未成年人身心健康的；
13)含有法律、行政法規(guī)禁止的其他內(nèi)容；
2. 不友善：不尊重用戶及其所貢獻內(nèi)容的信息或行為。主要表現(xiàn)為：
1)輕蔑：貶低、輕視他人及其勞動成果；
2)誹謗：捏造、散布虛假事實，損害他人名譽；
3)嘲諷：以比喻、夸張、侮辱性的手法對他人或其行為進行揭露或描述，以此來激怒他人；
4)挑釁：以不友好的方式激怒他人，意圖使對方對自己的言論作出回應(yīng)，蓄意制造事端；
5)羞辱：貶低他人的能力、行為、生理或身份特征，讓對方難堪；
6)謾罵：以不文明的語言對他人進行負面評價；
7)歧視：煽動人群歧視、地域歧視等，針對他人的民族、種族、宗教、性取向、性別、年齡、地域、生理特征等身份或者歸類的攻擊；
8)威脅：許諾以不良的后果來迫使他人服從自己的意志；
3. 發(fā)布垃圾廣告信息：以推廣曝光為目的，發(fā)布影響用戶體驗、擾亂本網(wǎng)站秩序的內(nèi)容，或進行相關(guān)行為。主要表現(xiàn)為：
1)多次發(fā)布包含售賣產(chǎn)品、提供服務(wù)、宣傳推廣內(nèi)容的垃圾廣告。包括但不限于以下幾種形式：
2)單個帳號多次發(fā)布包含垃圾廣告的內(nèi)容；
3)多個廣告帳號互相配合發(fā)布、傳播包含垃圾廣告的內(nèi)容；
4)多次發(fā)布包含欺騙性外鏈的內(nèi)容，如未注明的淘寶客鏈接、跳轉(zhuǎn)網(wǎng)站等，誘騙用戶點擊鏈接
5)發(fā)布大量包含推廣鏈接、產(chǎn)品、品牌等內(nèi)容獲取搜索引擎中的不正當(dāng)曝光；
6)購買或出售帳號之間虛假地互動，發(fā)布干擾網(wǎng)站秩序的推廣內(nèi)容及相關(guān)交易。
7)發(fā)布包含欺騙性的惡意營銷內(nèi)容，如通過偽造經(jīng)歷、冒充他人等方式進行惡意營銷；
8)使用特殊符號、圖片等方式規(guī)避垃圾廣告內(nèi)容審核的廣告內(nèi)容。
4. 色情低俗信息，主要表現(xiàn)為：
1)包含自己或他人性經(jīng)驗的細節(jié)描述或露骨的感受描述；
2)涉及色情段子、兩性笑話的低俗內(nèi)容；
3)配圖、頭圖中包含庸俗或挑逗性圖片的內(nèi)容；
4)帶有性暗示、性挑逗等易使人產(chǎn)生性聯(lián)想；
5)展現(xiàn)血腥、驚悚、殘忍等致人身心不適；
6)炒作緋聞、丑聞、劣跡等；
7)宣揚低俗、庸俗、媚俗內(nèi)容。
5. 不實信息，主要表現(xiàn)為：
1)可能存在事實性錯誤或者造謠等內(nèi)容；
2)存在事實夸大、偽造虛假經(jīng)歷等誤導(dǎo)他人的內(nèi)容；
3)偽造身份、冒充他人，通過頭像、用戶名等個人信息暗示自己具有特定身份，或與特定機構(gòu)或個人存在關(guān)聯(lián)。
6. 傳播封建迷信，主要表現(xiàn)為：
1)找人算命、測字、占卜、解夢、化解厄運、使用迷信方式治病；
2)求推薦算命看相大師；
3)針對具體風(fēng)水等問題進行求助或咨詢；
4)問自己或他人的八字、六爻、星盤、手相、面相、五行缺失，包括通過占卜方法問婚姻、前程、運勢，東西寵物丟了能不能找回、取名改名等；
7. 文章標題黨，主要表現(xiàn)為：
1)以各種夸張、獵奇、不合常理的表現(xiàn)手法等行為來誘導(dǎo)用戶；
2)內(nèi)容與標題之間存在嚴重不實或者原意扭曲；
3)使用夸張標題，內(nèi)容與標題嚴重不符的。
8.「飯圈」亂象行為，主要表現(xiàn)為：
1)誘導(dǎo)未成年人應(yīng)援集資、高額消費、投票打榜
2)粉絲互撕謾罵、拉踩引戰(zhàn)、造謠攻擊、人肉搜索、侵犯隱私
3)鼓動「飯圈」粉絲攀比炫富、奢靡享樂等行為
4)以號召粉絲、雇用網(wǎng)絡(luò)水軍、「養(yǎng)號」形式刷量控評等行為
5)通過「蹭熱點」、制造話題等形式干擾輿論，影響傳播秩序
9. 其他危害行為或內(nèi)容，主要表現(xiàn)為：
1)可能引發(fā)未成年人模仿不安全行為和違反社會公德行為、誘導(dǎo)未成年人不良嗜好影響未成年人身心健康的；
2)不當(dāng)評述自然災(zāi)害、重大事故等災(zāi)難的；
3)美化、粉飾侵略戰(zhàn)爭行為的；
4)法律、行政法規(guī)禁止，或可能對網(wǎng)絡(luò)生態(tài)造成不良影響的其他內(nèi)容。
二、違規(guī)處罰
本網(wǎng)站通過主動發(fā)現(xiàn)和接受用戶舉報兩種方式收集違規(guī)行為信息。所有有意的降低內(nèi)容質(zhì)量、傷害平臺氛圍及欺凌未成年人或危害未成年人身心健康的行為都是不能容忍的。
當(dāng)一個用戶發(fā)布違規(guī)內(nèi)容時，本網(wǎng)站將依據(jù)相關(guān)用戶違規(guī)情節(jié)嚴重程度，對帳號進行禁言 1 天、7 天、15 天直至永久禁言或封停賬號的處罰。當(dāng)涉及欺凌未成年人、危害未成年人身心健康、通過作弊手段注冊、使用帳號，或者濫用多個帳號發(fā)布違規(guī)內(nèi)容時，本網(wǎng)站將加重處罰。
三、申訴
隨著平臺管理經(jīng)驗的不斷豐富，本網(wǎng)站出于維護本網(wǎng)站氛圍和秩序的目的，將不斷完善本公約。
如果本網(wǎng)站用戶對本網(wǎng)站基于本公約規(guī)定做出的處理有異議，可以通過「建議反饋」功能向本網(wǎng)站進行反饋。
(規(guī)則的最終解釋權(quán)歸屬本網(wǎng)站所有)