《百度APP移動(dòng)搜索落地頁體驗(yàn)白皮書5.0》——百度APP移動(dòng)搜索落地頁體驗(yàn)標(biāo)準(zhǔn)1.信息獲取規(guī)范
1.1 加載速度
頁面首屏內(nèi)容應(yīng)在1秒內(nèi)加載完成。
頁面加載速度是影響用戶搜索體驗(yàn)的一個(gè)重要因素。百度APP對(duì)用戶行為的研究表明，頁面首屏的加載時(shí)間在1秒以內(nèi)的站點(diǎn)或小程序，用戶的留存率會(huì)越高，更符合用戶對(duì)快捷搜索體驗(yàn)的期待。
![]()
2.頁面瀏覽規(guī)范
2.1 排版布局
2.1.1頁面應(yīng)注意排版精良，段落分明，合理使用不同字號(hào)區(qū)分頁面的主次信息，圖片、視頻等多媒體資源的位置及尺寸選擇配合頁面整體布局，保證頁面整體的美觀度和用戶瀏覽頁面信息的最佳可讀性。
案例：
![]()
上圖：H5站點(diǎn)頁面排版差、段落距離不合理影響用戶閱讀
2.1.2 首屏主體內(nèi)容必須占屏幕的50%以上。并且主體內(nèi)容應(yīng)位于手機(jī)屏幕的中心位置。
案例：
![]()
上圖：首屏主體內(nèi)容小于50%，廣告等其他內(nèi)容過多，不符合要求
2.1.3展開全文功能：展開全文的設(shè)置必須具有文字標(biāo)示，且功能實(shí)際可用；展開全文功能最多只能出現(xiàn)一次，但不可出現(xiàn)在落地頁的首屏內(nèi)容中（列表頁除外）；展開全文與廣告等引導(dǎo)性內(nèi)容要設(shè)置一定距離間隔，避免干擾用戶操作。
案例：
![]()
上圖：展開功能無文字標(biāo)示，且與APP調(diào)起按鈕距離過近，不符合要求
案例:
![]()
上圖：小程序展開全文按鈕出現(xiàn)在首屏，不符合要求
2.1.4 主體內(nèi)容應(yīng)與廣告、相關(guān)推薦等次要內(nèi)容板塊之間有明顯間隔距離或分割線，使用戶獲取信息時(shí)不受任何干擾。
案例:
![]()
上圖：翻頁功能鍵與廣告之間無間距，易引發(fā)用戶誤點(diǎn)擊，不符合要求
案例:
![]()
上圖：小程序主體內(nèi)容與廣告之間距離過近，不符合要求
2.1.5 頁面的導(dǎo)航的功能與位置明確，避免用戶使用過程中被誤導(dǎo)。
案例：
![]()
上圖：點(diǎn)擊服務(wù)導(dǎo)航按鈕，小程序未跳轉(zhuǎn)到對(duì)應(yīng)頁面，不符合要求
2.2 字號(hào)間距
落地頁的字體大小及文本間距的選擇，不可明顯過大過小，需適合手機(jī)用戶閱讀。頁面主體內(nèi)容的字號(hào)應(yīng)不小于10pt，字體與行高的比率應(yīng)大于1.4。
案例：
![]()
上圖：頁面字體設(shè)置過小，用戶閱讀體驗(yàn)差
注：小程序整體的頁面排版布局、字號(hào)選擇、行間距選擇可參考《智能小程序設(shè)計(jì)規(guī)范》。
2.3 PC站移動(dòng)適配
移動(dòng)搜索結(jié)果落地頁必須是移動(dòng)頁而不是PC頁。因此，針對(duì)PC站點(diǎn)我們建議：
（1）設(shè)計(jì)搭建與PC站形成對(duì)應(yīng)適配關(guān)系的移動(dòng)站，并積極向百度提供移動(dòng)頁面及適配關(guān)系；
（2）若網(wǎng)站暫時(shí)沒有搭建移動(dòng)站的計(jì)劃，請(qǐng)將PC站點(diǎn)進(jìn)行自適應(yīng)改造，以便適應(yīng)移動(dòng)瀏覽器的界面，給用戶帶來良好視覺體驗(yàn)。
案例：
![]()
上圖：PC站點(diǎn)移動(dòng)端用戶瀏覽及交互體驗(yàn)差，不符合要求
2.4 頁面機(jī)型適配
所有開發(fā)者應(yīng)對(duì)資源頁面做好不同手機(jī)型號(hào)的適配效果，不影響用戶的正常瀏覽使用。其中IOS全面屏手機(jī)底部橫線不可遮擋頁面的具體功能和內(nèi)容。
案例：
![]()
上圖:左圖為小程序iOS端正確適配案例，右圖為錯(cuò)誤適配案例
2.5 落地頁廣告規(guī)范
2.5.1廣告內(nèi)容規(guī)范
落地頁的廣告內(nèi)容必須遵守《中華人民共和國廣告法》的規(guī)定要求，如果廣告存在違法內(nèi)容，給用戶帶來干擾，不論廣告形式、位置和面積是否符合規(guī)范，都會(huì)成為被打擊的對(duì)象。
2.5.1.1嚴(yán)禁違禁低俗廣告內(nèi)容
在用戶正常瀏覽頁面時(shí)，違禁低俗廣告無論是圖片還是文字鏈，都對(duì)用戶產(chǎn)生極大的干擾，百度對(duì)此將嚴(yán)厲打擊。對(duì)違禁低俗廣告（包括但不限于色情、賭博、法律規(guī)定的違禁品或服務(wù)）更是從重從嚴(yán)。
案例：
![]()
上圖：禁止低俗色情廣告
案例 ：
![]()
上圖：禁止博彩違禁廣告
2.5.1.2嚴(yán)禁虛假誘導(dǎo)類廣告內(nèi)容
廣告內(nèi)容禁止使用“國家級(jí)”、“最高級(jí)”、“最佳”等用語，不能夸大效果、虛假承諾，誘導(dǎo)用戶分享，對(duì)于帶有誘導(dǎo)、欺騙、虛假內(nèi)容的廣告，百度會(huì)堅(jiān)決予以打擊。
案例：
![]()
上圖：虛假廣告
案例：
![]()
2.5.1.3 嚴(yán)禁廣告內(nèi)容侵犯國家尊嚴(yán)利益、泄露國家秘密、侵犯?jìng)�(gè)人隱私
案例：
上圖：上圖廣告內(nèi)容侵犯?jìng)�(gè)人肖像權(quán)，不合規(guī)規(guī)范
2.5.2 廣告樣式規(guī)范
落地頁廣告樣式不允許遮擋頁面主體內(nèi)容及功能，干擾用戶正常的瀏覽體驗(yàn)和搜索需求。
2.5.2.1 在落地頁的任何位置都不允許放置懸浮廣告、彈窗廣告、遮屏廣告等用戶最為抵觸的廣告形式，避免阻礙用戶瀏覽或引起用戶誤操作，無論任何大小和目的。
案例:
![]()
上圖：頁面頂部設(shè)置懸浮廣告，底部設(shè)置膠囊懸浮廣告，不符合要求
案例：
![]()
上圖：禁止設(shè)置頁面底部懸浮廣告
案例：
![]()
上圖：禁止設(shè)置側(cè)面懸浮廣告
案例：
![]()
上圖：禁止設(shè)置彈窗廣告
案例：
![]()
上圖：禁止設(shè)置頁面遮屏廣告
案例:
![]()
上圖：禁止設(shè)置頁面低質(zhì)遮屏廣告
2.5.2.2 廣告不允許抖動(dòng)、閃動(dòng)、輪播、自動(dòng)播放，干擾用戶瀏覽主體內(nèi)容的視線。
案例：
![]()
上圖：底部輪播APP下載廣告，不符合要求
2.5.3 廣告位置以及面積規(guī)范
用戶使用搜索的目的是為了尋找自己需要的服務(wù)和信息，因此不希望看到過多的廣告。因此開發(fā)者在放置廣告時(shí)總體要求位置合適、廣告面積不可過大，不能遮擋用戶瀏覽主體信息。廣告與主體內(nèi)容、功能按鈕等模塊之間要有明顯的距離間隔，避免用戶誤點(diǎn)擊。
2.5.3.1 落地頁的首屏頂部允許嵌入不超過一屏面積10%的優(yōu)質(zhì)廣告，優(yōu)質(zhì)廣告是指廣告面積和內(nèi)容合規(guī)的前提下，形式上有明確廣告標(biāo)識(shí)，樣式美觀，視覺體驗(yàn)好，且宣傳內(nèi)容不違反法律法規(guī)要求，不涉及虛假、欺騙信息，值得信賴。
案例：
![]()
上圖：頁面頂部嵌入廣告面積過大，不符合要求
案例：
![]()
上圖：小程序頂部嵌入廣告面積過大，不符合要求
2.5.3.2文章內(nèi)容頁或信息詳情頁，從主體內(nèi)容標(biāo)題開始到正文內(nèi)容結(jié)束前，禁止插入任何形式的廣告。注：文章下方的評(píng)論、分享、推薦等不算作正文內(nèi)容，翻頁功能區(qū)算作正文。
案例：
![]()
上圖：禁止標(biāo)題與正文之間嵌入廣告
案例：
![]()
上圖：禁止正文中穿插廣告
案例:
![]()
上圖：禁止正文與功能鍵之間放置廣告
2.5.3.3 所有H5站點(diǎn)及智能小程序的列表頁（包括首頁）中，一屏的廣告面積必須小于1/3，且廣告內(nèi)容視覺感知上不能與原生內(nèi)容反差很大。圖片列表頁中的廣告也會(huì)被計(jì)算為廣告面積。
案例：
![]()
上圖：列表頁插入廣告面積超過一屏的1/3，不符合要求
- 交互操作規(guī)范
3.1 滑動(dòng)順暢
為保證搜索用戶瀏覽頁面的便捷性，頁面上下滑動(dòng)及tab模塊切換等操作需順暢不卡頓。
3.2 功能友好
3.2.1 用戶可以快速直達(dá)目標(biāo)頁面或使用功能，操作簡(jiǎn)易，回退自如，避免繁瑣步驟或重復(fù)點(diǎn)擊等行為。
特別提醒：為給用戶形成統(tǒng)一便捷的用戶體驗(yàn)，百度智能小程序提供的返回功能統(tǒng)一位于頁面左上方，建議不要放置其他位置。
案例：
如：選擇感興趣的商品，先到達(dá)商品詳情頁，還需要再次點(diǎn)擊才可到達(dá)購買頁，這種造成用戶多余操作的情況是不允許出現(xiàn)的。
錯(cuò)誤：選擇感興趣的商品——>商品詳情頁（多余操作操作繁雜）——>商品詳情頁，可下單購買
正確：選擇感興趣的商品——>商品詳情頁，可直接點(diǎn)擊購買
![]()
上圖：購買路徑繁瑣，不符合要求
案例:
![]()
上圖：小程序頁面的返回按鈕位于頁面左上方，回退自如
3.2.2 功能設(shè)置要簡(jiǎn)單易用，符合用戶操作習(xí)慣，同一功能在同一頁面只能出現(xiàn)一次，不可重復(fù)設(shè)置。具體要求如下：
3.2.2.1 功能位置必須固定，不可抖動(dòng)或閃爍，與頁面其他內(nèi)容模塊（如廣告）要有一定間距，不可重疊，避免用戶誤操作；
3.2.2.2 同一頁面上功能按鈕面積不可超過一屏面積的10%；
3.2.2.3功能必須實(shí)際可用，操作友好便捷，且實(shí)際功能與文字描述需完全一致，不可出現(xiàn)誘導(dǎo)信息或引導(dǎo)跳轉(zhuǎn)第三方頁面；
3.2.2.4 功能可設(shè)置成嵌入樣式也可設(shè)置成懸浮樣式，但設(shè)置懸浮功能時(shí)要注意面積不能過大，不可遮擋用戶瀏覽頁面內(nèi)容或進(jìn)行其他功能操作。
案例：
![]()
上圖：功能按鈕未放置在底部，不符合用戶習(xí)慣
案例：
![]()
上圖：功能按鈕抖動(dòng)，不符合要求
3.2.3 咨詢類功能在當(dāng)前頁只能出現(xiàn)一次，且位置不允許出現(xiàn)在頂部；在用戶未主動(dòng)點(diǎn)擊的情況下，咨詢的對(duì)話窗口不可自動(dòng)彈出；咨詢按鈕可在底部或側(cè)面懸浮，但面積不宜過大干擾用戶瀏覽。
案例：
![]()
上圖：咨詢功能自動(dòng)彈窗且與底部的咨詢按鈕重復(fù)，不符合要求
案例：
![]()
上圖：咨詢功能懸浮在頁面底部，面積小于一屏10%，符合規(guī)范
案例：
![]()
上圖：咨詢功能懸浮在頁面右側(cè)，面積較小，符合規(guī)范
3.3 操作便捷化
落地頁的交互操作應(yīng)符合用戶日常使用習(xí)慣，簡(jiǎn)單方便。
3.3.1 頁面的文本內(nèi)容應(yīng)支持長(zhǎng)按可復(fù)制，鏈接可點(diǎn)擊。
案例：
![]()
上圖：文字長(zhǎng)按可調(diào)起復(fù)制，符合要求
3.3.2 詳情頁的主體內(nèi)容在包含圖片的情況下，圖片應(yīng)支持點(diǎn)擊調(diào)起查看大圖，點(diǎn)擊返回，雙指按捏放大縮小功能使用自如，在有多張圖片的情況下，手勢(shì)支持左右滑動(dòng)，自由切換圖片。
案例：
【圖片】
上圖：圖片可點(diǎn)擊查看并退回，雙指按捏進(jìn)行縮放，左右滑動(dòng)進(jìn)行圖片切換
3.3.3視頻播放時(shí)，進(jìn)度條應(yīng)可被拖拽；視頻可以全屏播放，豎屏視頻在全屏播放時(shí)，應(yīng)保持豎屏模式的全屏播放；視頻不可出現(xiàn)抖動(dòng)、顫抖、卡頓多次的情況，避免傷害用戶體驗(yàn)。
案例：
![]()
上圖：小程序中的豎屏視頻全屏不支持豎屏播放，用戶觀看體驗(yàn)差
3.3.4 音頻播放時(shí)，進(jìn)度條可以被拖拽。歌詞需要與歌曲有映射關(guān)系，保持同步。
案例：
![]()
上圖：音頻進(jìn)度條不可拖拽
3.3.5用戶在H5站或智能小程序內(nèi)有地點(diǎn)查詢等需求時(shí)，應(yīng)支持用戶使用地圖查看地點(diǎn)，獲取地點(diǎn)周邊信息、調(diào)起主流地圖進(jìn)行路線規(guī)劃和目的地導(dǎo)航。
3.3.6 用戶高頻使用的電話、咨詢、QQ等功能應(yīng)實(shí)現(xiàn)組件化，用戶點(diǎn)擊功能后能快速進(jìn)入溝通交流頁面。如用戶點(diǎn)擊電話，實(shí)現(xiàn)電話撥打操作；用戶點(diǎn)擊咨詢功能，可直接進(jìn)入咨詢對(duì)話框；用戶點(diǎn)擊QQ，可直接進(jìn)入QQ對(duì)話框。
案例：
![]()
上圖：線上咨詢功能點(diǎn)擊后直接進(jìn)入咨詢對(duì)話框，符合規(guī)范
注明：當(dāng)前百度智能小程序提供的框架能力可支持文本、圖片、視頻以及音頻等資源交互操作，小程序開發(fā)者可自由選用，若開發(fā)者自行設(shè)置多媒體資源的交互能力，需遵守上述規(guī)范。
- 服務(wù)規(guī)范
服務(wù)閉環(huán)是指以用戶需求為中心，能提供用戶完整、全流程的服務(wù)體驗(yàn)。作為綜合性的內(nèi)容消費(fèi)及服務(wù)平臺(tái)，百度APP希望用戶在搜索時(shí)不僅能滿足用戶的信息及資源獲取需求，更能享受完整的服務(wù)流程，帶給用戶沉浸式的體驗(yàn)感受。
4.1登錄便捷
登錄需求作為用戶享有各種服務(wù)需求的前提，必須做到登錄簡(jiǎn)單便捷。
4.1.1 站點(diǎn)及小程序的登錄入口清晰明顯，登錄方式便捷，支持授權(quán)登錄，比如百度賬號(hào)授權(quán)等。
案例：
![]()
上圖：小程序支持多種登錄方式，既有登錄授權(quán)也有手機(jī)號(hào)登錄，符合要求
4.1.2 用戶登錄一次后應(yīng)能長(zhǎng)久的保持登錄狀態(tài)，避免多次重復(fù)登錄給用戶帶來的復(fù)雜體驗(yàn)。
4.2 定位服務(wù)
當(dāng)站點(diǎn)及小程序提供給用戶的服務(wù)有定位需求時(shí)，如電商類、生活服務(wù)類（外賣、買票、租房）等，應(yīng)該支持自動(dòng)定位服務(wù)，并且做到定位準(zhǔn)確無誤。
案例：
![]()
上圖：該小程序不支持自動(dòng)定位，用戶體驗(yàn)差
4.3 功能完備
4.3.1 H5站及智能小程序提供服務(wù)時(shí)，核心的服務(wù)功能應(yīng)設(shè)置完備，并且實(shí)際可用，給用戶有效反饋，使用戶享有便捷、完整的全流程服務(wù)體驗(yàn)。比如電商類站點(diǎn)或者小程序應(yīng)具備搜索、客服、支付、購物車、訂單查詢、退貨等基本服務(wù)功能。
案例:
![]()
上圖：電商小程序商品頁面缺失客服功能，用戶無法進(jìn)行咨詢
4.3.2 大部分服務(wù)體驗(yàn)的最終完成都需要有支付功能，因此開發(fā)者應(yīng)支持調(diào)起大部分用戶習(xí)慣使用的支付平臺(tái)，如微信支付或支付寶，簡(jiǎn)化支付流程。
案例：
![]()
上圖：以上小程序支持多重支付方式，簡(jiǎn)化了支付流程
4.4 服務(wù)交互
4.4.1 服務(wù)界面整體排版清晰，布局合理，色調(diào)一致，頁面和控件切換自如。
4.4.2 用戶的交互操作需降低用戶輸入成本，保障輸入填寫的智能化，如利用各種控件實(shí)現(xiàn)輸入選擇，鍵盤不能遮擋主體、輸入字體清晰可見等。
案例：
![]()
上圖：小程序整體布局清晰，利用功能組件實(shí)現(xiàn)輸入選擇，降低用戶輸入成本，優(yōu)化用戶體驗(yàn)
4.4.3 用戶的交互操作流程必須有提醒通知或引導(dǎo)提示，使用戶能快速得到有效反饋。（如接收驗(yàn)證碼倒計(jì)時(shí)，操作提醒、解釋性提示、客服消息通知、進(jìn)度通知等）
4.5 信息查詢
站點(diǎn)及小程序都應(yīng)當(dāng)支持用戶登錄后可查詢歷史信息，比如快遞追蹤、購買記錄查詢咨詢、記錄查詢等。
IP卡
狗仔卡
發(fā)表于 2021-2-7 16:54:11
QQ好友和群
QQ空間
騰訊微博
騰訊朋友
收藏
提升卡
置頂卡
沉默卡
喧囂卡
變色卡
顯身卡
樓主