W3Cschool
恭喜您成為首批注冊(cè)用戶(hù)
獲得88經(jīng)驗(yàn)值獎(jiǎng)勵(lì)
如何提升信息流落地頁(yè)體驗(yàn)
信息流是小程序獲取流量、凸顯內(nèi)容差異化價(jià)值的重要渠道,智能小程序官方針對(duì)信息流落地頁(yè)的主流呈現(xiàn)形式,提供了豐富詳盡的體驗(yàn)指引。
遵循體驗(yàn)指引提升小程序信息流落地頁(yè)體驗(yàn),小程序可達(dá)成以下目標(biāo):
長(zhǎng)圖文類(lèi)型小程序落地頁(yè)是在信息流分發(fā)中最常見(jiàn)的資源類(lèi)型,長(zhǎng)圖文類(lèi)型小程序落地頁(yè)在信息流分發(fā)中具體體驗(yàn)規(guī)范如下:
1. 整體框架結(jié)構(gòu)規(guī)范
圖文落地頁(yè)建議按照如圖結(jié)構(gòu)布局,符合用戶(hù)對(duì)信息流圖文落地頁(yè)文章的結(jié)構(gòu)和認(rèn)知,降低跳出感。頁(yè)面從上至下是一個(gè)固定的結(jié)構(gòu),模塊位置是不可以變更的,除了固定的框架、標(biāo)題、來(lái)源和正文是必不可少的,其他部分模塊可根據(jù)實(shí)際情況進(jìn)行進(jìn)行插拔。
框架選擇: 建議使用默認(rèn)白色框架??蚣軜?biāo)題: 展示小程序名稱(chēng)。字?jǐn)?shù)限制: 標(biāo)題文字不超過(guò)8個(gè)字, 否則會(huì)截?cái)囡@示,影響用戶(hù)閱讀。
正確
標(biāo)題字?jǐn)?shù)合理,小程序名稱(chēng)一目了然。
注意
標(biāo)題字?jǐn)?shù)過(guò)長(zhǎng),截?cái)鄬?dǎo)致信息丟失,容易困惑。
3.1.正文標(biāo)題: 正文內(nèi)容區(qū)規(guī)范 字號(hào)72px,行距36px,中粗體。
3.1.正文標(biāo)題: 正文內(nèi)容區(qū)規(guī)范 字號(hào)72px,行距36px,中粗體。
3.2.信息來(lái)源: 作者頭像大小105x105px;名稱(chēng)字號(hào)48px,字色#000000;發(fā)布時(shí)間等輔助信息字號(hào)36px,字色#999999。
3.3.正文文字: 字號(hào)57px,行距33px,中粗體。
3.4.圖片樣式: 圖片通欄展示,寬度=屏幕寬度,高度根據(jù)寬度自適應(yīng)。
3.5.頁(yè)邊距: 文字距離兩邊51px,圖片距離兩邊0px。
3.6.模塊間距: 正文段落之間108p,正文與圖片間距90px,圖片與圖片間距60px。
排版樣式: 左文右圖列表樣式,圖片比例為3:2。列表文字: 列表標(biāo)題字號(hào)57px,字色#000000;輔助信息字號(hào)36px,字色#999999。
為了降低開(kāi)發(fā)成本,小程序官方提供“page-feed 信息流模板”,包含左文右圖樣式,開(kāi)發(fā)者可以快速調(diào)用該通用模板。(查看開(kāi)發(fā)文檔)
圖文類(lèi)小程序落地頁(yè)建議開(kāi)發(fā)者設(shè)置評(píng)論區(qū),便于用戶(hù)獲取更多信息;在用戶(hù)實(shí)驗(yàn)中,缺少評(píng)論區(qū)用戶(hù)接受度低。
小程序官方提供一站式互動(dòng)組件,包含互動(dòng)bar能力、評(píng)論列表&評(píng)論詳情落地頁(yè)能力以及數(shù)據(jù)存儲(chǔ)能力,開(kāi)發(fā)者可以快速接入。(查看開(kāi)發(fā)文檔)
可以在小程序長(zhǎng)圖文類(lèi)資源落地頁(yè)的文章末尾和相關(guān)推薦區(qū)插入廣告,廣告需要與正文內(nèi)容有如圖標(biāo)注的明顯分割;推薦區(qū)廣告樣式建議與推薦列表樣式對(duì)齊。
前往查看小程序信息流詳細(xì)廣告規(guī)范(信息流落地頁(yè)體驗(yàn)-廣告)
為了降低開(kāi)發(fā)成本,除了規(guī)范文檔外,我們也為開(kāi)發(fā)者提供以下工具,助力小程序落地頁(yè)體驗(yàn)的提升。各種工具能力對(duì)比可參考以下圖表:
能力 | 一、規(guī)范文檔 | 二、圖文詳情頁(yè)模板 | 三、信息流統(tǒng)一模板 | 四、發(fā)文工具 |
---|---|---|---|---|
開(kāi)發(fā)方式 | 手動(dòng)
閱讀文檔進(jìn)行開(kāi)發(fā) |
半自動(dòng)
使用開(kāi)發(fā)者工具快速調(diào)用 |
全自動(dòng)
授權(quán)配置,內(nèi)容轉(zhuǎn)化 |
全自動(dòng)
內(nèi)容管理平臺(tái)編輯后發(fā)布 |
開(kāi)發(fā)成本 | 高
需要使用代碼編輯 |
中
可以直接調(diào)用代碼 |
低
不需要通過(guò)代碼 |
低
不需要通過(guò)代碼 |
定制能力 | 高
符合基礎(chǔ)體驗(yàn)規(guī)范后, 可進(jìn)行自定義 |
中
各模塊參數(shù)已基本配置好, 自定義需要修改代碼 |
低
統(tǒng)一模板內(nèi)部, 已封裝好各項(xiàng)參數(shù)和配置 |
低
編輯器中, 已封裝好各項(xiàng)參數(shù)和配置 |
使用門(mén)檻 | 無(wú)門(mén)檻 | 無(wú)門(mén)檻 | 無(wú)門(mén)檻,全流量開(kāi)放 | 質(zhì)量達(dá)到要求后開(kāi)放該能力 |
二、圖文詳情頁(yè)模板開(kāi)發(fā)者可以在開(kāi)發(fā)者工具中的歡迎頁(yè),選擇圖文詳情頁(yè)模板,模板中內(nèi)置了符合信息流落地頁(yè)體驗(yàn)的各種樣式內(nèi)容,可以快速生產(chǎn)符合體驗(yàn)的落地頁(yè)文章。查看模板
三、信息流統(tǒng)一模板:開(kāi)發(fā)者可以通過(guò)在開(kāi)發(fā)者平臺(tái)進(jìn)行授權(quán)配置,配置生成百度規(guī)范化模板,呈現(xiàn)出符合體驗(yàn)的落地頁(yè)文章。查看模板
四、發(fā)文工具:內(nèi)容管理模塊提供一種全新的運(yùn)營(yíng)方式,支持開(kāi)發(fā)者在百度域內(nèi)運(yùn)營(yíng)自己的粉絲用戶(hù)和潛在用戶(hù)。開(kāi)發(fā)者可以通過(guò)開(kāi)發(fā)者平臺(tái),在運(yùn)用中心-內(nèi)容管理新建群發(fā)消息,生成的圖文內(nèi)容符合信息流體驗(yàn)一致性,并且信息流會(huì)給予高權(quán)重分發(fā)。該能力有一定的準(zhǔn)入要求,具體可查看模板。
以上介紹的生產(chǎn)優(yōu)質(zhì)體驗(yàn)的信息流落地頁(yè)方式,開(kāi)發(fā)者可以根據(jù)實(shí)際需求選擇最合適的開(kāi)發(fā)方式。
視頻類(lèi)型小程序落地頁(yè)在信息流中的分發(fā)體驗(yàn)規(guī)范具體如下:
視頻建議按照如右圖結(jié)構(gòu)布局,符合用戶(hù)對(duì)信息流常規(guī)視頻落地頁(yè)的結(jié)構(gòu)的認(rèn)知,降低用戶(hù)跳出感。頁(yè)面從上至下是一個(gè)固定的結(jié)構(gòu),模塊位置是不可以變更的,除了固定的框架、視頻、標(biāo)題、輔助信息區(qū)和作者信息區(qū)是必不可少的,其他部分模塊可根據(jù)實(shí)際情況進(jìn)行進(jìn)行插拔。
框架選擇: 建議使用默認(rèn)白色框架,不可使用透明框架??蚣軜?biāo)題: 展示小程序名稱(chēng)。字?jǐn)?shù)限制: 不超過(guò)8個(gè)字,否則會(huì)截?cái)囡@示,影響用戶(hù)閱讀。
正確
標(biāo)題字?jǐn)?shù)合理,小程序名稱(chēng)一目了然。
錯(cuò)誤
標(biāo)題字?jǐn)?shù)過(guò)長(zhǎng)且使用透明框架,框架與視頻播放器重合影響視頻內(nèi)容瀏覽。
3.1.視頻區(qū): 放置視頻播放器,展示當(dāng)前視頻資源。
橫向視頻 資源展示可以使用小程序video視頻組件,寬:高=16:9。豎向視頻 資源展示最低高度≥屏幕寬度;最高高度≤屏幕高度*78%。
3.2.標(biāo)題文字: 字號(hào)57px,行距24px,中粗體,字色#000000。
3.3.輔助信息區(qū): 字號(hào)36px,行距18px,字色#999999。
3.4.互動(dòng)功能區(qū): 功能按鈕以全圓角描邊膠囊形式展現(xiàn)。
3.5.作者信息區(qū): 作者頭像大小105x105px;名稱(chēng)字號(hào)48px,字色#000000;輔助信息字號(hào)36px,字色#999999;輔助信息與名稱(chēng)間距21px。
3.6.頁(yè)邊距及間距: 內(nèi)容距離左右頁(yè)邊距為51px,其他各模塊間距可參考圖中標(biāo)示。
排版樣式: 可采用大圖樣式或者左文右圖列表樣式,視頻封面尺寸為16:9。列表文字: 列表標(biāo)題字號(hào)51px,字色#000000;輔助信息字號(hào)36px,字色#999999。
視頻類(lèi)小程序落地頁(yè)建議開(kāi)發(fā)者設(shè)置評(píng)論區(qū),便于用戶(hù)獲取更多信息;在用戶(hù)實(shí)驗(yàn)中,缺少評(píng)論區(qū)用戶(hù)接受度低。
可以在小程序視頻類(lèi)資源落地頁(yè)的相關(guān)推薦區(qū)插入廣告,并且廣告與視頻區(qū)有明顯分割;廣告樣式建議與推薦列表樣式對(duì)齊。
除了以上文字內(nèi)容以外,我們同時(shí)為開(kāi)發(fā)者提供如下關(guān)于小程序在信息流分發(fā)體驗(yàn)的詳細(xì)視頻解讀:在線觀看地址
Copyright©2021 w3cschool編程獅|閩ICP備15016281號(hào)-3|閩公網(wǎng)安備35020302033924號(hào)
違法和不良信息舉報(bào)電話:173-0602-2364|舉報(bào)郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號(hào)
聯(lián)系方式:
更多建議: