您當前位置:網絡公司> 建站教程> 網站建設>

網站內容頁設計經驗總結

本文對網站內容頁設計做了六大分類,如果每個分類內容頁深入下去還是有很多東西可研究的,絕不是這篇文章就能說完的。所以,謹在此做一個拋磚引玉..

18553827618 立即咨詢

快速申請辦理

稱       呼 :
手機號碼 :
備       注:
分享:

網站內容頁設計經驗總結

發布時間:2017-10-26 熱度:

什么是用戶體驗?所以,整理了一份最最基礎的內容頁設計總結給設計新人。希望新人在做內容頁設計的時候,不再毫無頭緒或胡拼亂湊起內容,而是能有基礎的認知。哪些元素是內容頁的基石,缺少它甚至就不是內容頁了。而又有哪些元素是錦上添花的東西。本文對內容頁做了六大分類,如果每個分類內容頁深入下去還是有很多東西可研究的,絕不是這篇文章就能說完的。所以,謹在此做一個拋磚...

  目錄1.認識內容頁2.內容頁終端簡析3.內容頁分類說明(新聞、商品、活動、UGC、用戶、消息)

  一.認識內容頁概述:內容頁,也稱為詳細資料頁。用戶最終可以在這里驗證自己的選擇,瀏覽自己找到的內容。內容頁意味著整個搜尋行動的尾聲。——《網站設計解構》

  組成:內容頁一般由“條目簡述”、“詳情描述”、“社交影響模式”、“關聯列表”、“操作”五個版塊組成。(內容頁的前臺和后臺形式差異較大,本文的內容頁僅針對前臺。)

  二.內容頁終端簡析內容頁將從新聞、商品、活動、UGC、用戶、消息六個類型,網絡公司,分別在PC端和移動端舉例說明。

  PC端的內容頁的垂直排布順序一般為:“條目簡述”,“詳情描述”,評論等“社交影響模式”。“關聯列表”的排布比較靈活,一般在正文的左側或底部。對于營銷型網站,往往在左側和底部都有關聯列表。

Image title

  移動端由于其版面的限制,垂直排布順序一般為“條目簡述”、“詳情描述”,“關聯列表”。“社交影響模式”在設計上會更多樣化一些,比如會用到底部懸浮框一直展示在頁面上,方便用戶隨時評論點贊。同時,移動端的內容頁一般顯示篇幅較長,會有“一鍵置頂”的按鈕。

Image title

  三.內容頁分類說明新聞必備:標題、發布時間、發布來源、正文、圖片、評論、相關推薦列表

  可選:頭圖、瀏覽量、評論量、點贊量、圖片庫、字號選擇、推薦、分享等

  補充:1.新聞內容的瀏覽者用戶較廣,針對一些政商類的新聞,其用戶群年齡層偏大,這時,添加一個“字號選擇”選項會極大增加對這類用戶的良好體驗感。2.移動端的“詳情描述”在前兩屏一般會顯示不完全。這時,如果能考慮到用戶流量和因用戶不想閱讀燈跳出等問題,可以添加“全文閱讀”按鈕。1.能讓用戶對是否看完全文有所選擇,不浪費用戶流量。2.進入頁面的速度更快,不需要等內容全部加載完。3.在兩屏的位置就有“相關推薦"的內容,可以減少用戶跳出率。

  舉例:百度新聞

PC端

PC端

  

移動端

移動端

  商品必備:商品圖片、商品名稱、商品價格、配置選項、商品詳情、商品評價、相關推薦、購買入口可選:促銷信息、銷售量、推薦轉發分享、收藏

  補充:1.圖片庫/查看大圖:電子商務網站一般會提供圖片庫,以便用戶以多種方式查看商品。通常是縮略圖的形式,并提供“查看大圖”選項,網站建設,這種方式節省了屏幕空間,網絡公司,又讓用戶看到清晰的大圖。2.移動端的操作按鈕會懸浮在頁面底部,方面用戶隨時購買,收藏商品。3.商品內容頁的關聯項會更多,會穿插在頁面的很多地方。目的是為了提高購買率。

  舉例:淘寶

PC端

PC端

PC端

移動端

移動端

  活動必備:標題、活動時間、活動地點、活動發起者、活動說明、相關推薦可選:頭圖、活動費用、活動類型、活動人數、活動須知、活動照片、活動成員、評論、評分、推薦、轉發分享

  補充:活動分為免費和付費類。付費類的活動相當于商品,所以此類活動的內容頁會和商品的差不多。移動端首屏一般會是活動的條目簡述,在頂部會有轉發分享。

  舉例:豆瓣同城

PC端

PC端

移動端

移動端

  UGC必備:標題、作者、正文、評論、推薦/分享、關注作者、相關推薦可選:瀏覽量、評論數、點贊量、點贊、打賞

  補充:UGC的特殊性,在社交模式里會有關注作者這一選項。同時,在知識付費的現在,打賞功能也是UGC內容不可或缺的一塊。

  舉例:知乎

PC端

PC端

移動端

移動端

  用戶必備:用戶頭像、用戶名稱、用戶簡介、關注用戶可選:性別、地區、認證、標簽、粉絲數、留言、私信、關聯用戶、推薦分享

  補充:以用戶為主的平臺,其用戶內容頁的社交影響模式往往會比較豐富。


關閉窗口
上一篇:網頁設計人員求職指南
下一篇:這些響應式網頁測試工具確保你的設計萬無一失

相關閱讀

什么是CuteFTP?如何將網站內容上傳(FTP)到網站空間?
什么是CuteFTP?如何將網站內容上傳(FTP)到網站空間?

CuteFTP是一個常用的上傳網站內容的軟件,用于將網站內容上傳(FTP)到網站空間。...

<strong>泰安網站建設公司與您分享網站內容布局的基本視覺表現方式:線框圖</strong>
泰安網站建設公司與您分享網站內容布局的基本視覺表現方式:線框圖

網站內容布局的基本視覺表現方式:線框圖,使用線框圖來簡化你的產品設計流程....

官方微信公眾號

集團總部

北京分部

上海分部

黑手党2怎么快递赚钱