一、網(wǎng)頁(yè)整體布局規(guī)范

網(wǎng)頁(yè)頁(yè)面結(jié)構(gòu)劃分為A區(qū)與B區(qū)兩大核心模塊。A區(qū)涵蓋廣告一區(qū)與主體內(nèi)容區(qū)，由站長(zhǎng)負(fù)責(zé)開發(fā)實(shí)現(xiàn)，其主體內(nèi)容區(qū)的標(biāo)準(zhǔn)樣式需參照后續(xù)章節(jié)的具體規(guī)范執(zhí)行。B區(qū)則包含廣告二區(qū)、推薦區(qū)、廣告三區(qū)及服務(wù)區(qū)，統(tǒng)一采用第13頁(yè)所提供的技術(shù)組件進(jìn)行構(gòu)建。若主體內(nèi)容區(qū)域因篇幅過(guò)長(zhǎng)，超出1.5倍屏幕顯示范圍的內(nèi)容，需通過(guò)折疊功能進(jìn)行合理收納，確保頁(yè)面布局的緊湊性與用戶瀏覽的流暢性。需要特別說(shuō)明的是，主體內(nèi)容區(qū)可定義為頁(yè)面核心信息的集中呈現(xiàn)區(qū)域，其范圍從標(biāo)題起始至正文內(nèi)容結(jié)束，而文章末尾的分享、推薦等功能模塊不計(jì)入主體內(nèi)容范疇。頁(yè)面布局標(biāo)準(zhǔn)示意圖詳見附圖。

主體內(nèi)容區(qū)根據(jù)內(nèi)容形態(tài)分為三種基礎(chǔ)類型：文章類基礎(chǔ)樣式、問(wèn)答類基礎(chǔ)樣式、視頻類基礎(chǔ)樣式。在此基礎(chǔ)上，文章類擴(kuò)展樣式涵蓋縮進(jìn)、加粗、無(wú)段落等變體，以及展開狀態(tài)、TAG推薦、音頻樣式等多樣化展示形式；問(wèn)答類擴(kuò)展樣式包括患者追問(wèn)、咨詢記錄、多種回答聚合、IM對(duì)話展示等交互模式；模塊樣式標(biāo)注則涵蓋組件樣式、模塊標(biāo)注、特殊樣式、圖文樣式等細(xì)節(jié)規(guī)范。

二、主體內(nèi)容區(qū)內(nèi)容觸達(dá)規(guī)范

針對(duì)視頻/音頻類內(nèi)容，需支持直接播放功能，且播放效果需達(dá)到當(dāng)前主流視頻類應(yīng)用的標(biāo)準(zhǔn)水平。嚴(yán)禁設(shè)置過(guò)高的權(quán)限門檻，例如強(qiáng)制用戶登錄后方可瀏覽或使用、要求下載特定APP才能獲取完整內(nèi)容等限制性措施，確保用戶能夠無(wú)障礙獲取信息。相關(guān)內(nèi)容頁(yè)面的展示標(biāo)準(zhǔn)示意圖如下所示。

對(duì)于文字類內(nèi)容，必須保證用戶可直接完整閱讀，禁止設(shè)置外部跳轉(zhuǎn)鏈接或要求下載APP才能繼續(xù)閱讀等障礙，保障信息獲取的便捷性與連續(xù)性。頁(yè)面展示標(biāo)準(zhǔn)示意圖如下。

三、主體內(nèi)容區(qū)內(nèi)容質(zhì)量規(guī)范

頁(yè)面內(nèi)容需嚴(yán)格杜絕作弊信息、低質(zhì)內(nèi)容及詐騙類信息，確保信息的真實(shí)性與可靠性。頁(yè)面主體內(nèi)容需易于辨識(shí)，排版布局合理有序，段落劃分清晰分明，文本內(nèi)容與背景顏色需形成鮮明對(duì)比，提升內(nèi)容的可讀性。主體內(nèi)容應(yīng)在頁(yè)面中占據(jù)突出位置，通常位于首屏中心區(qū)域，且頁(yè)面廣告需通過(guò)標(biāo)簽或布局設(shè)計(jì)明確區(qū)分，確保廣告數(shù)量極少且對(duì)主體信息無(wú)任何干擾影響。用戶獲取主體信息的過(guò)程應(yīng)避免多余干擾與成本，能夠快速定位所需內(nèi)容，并通過(guò)頁(yè)面布局清晰了解各模塊的主要內(nèi)容。內(nèi)容布局標(biāo)準(zhǔn)示意圖如下。

四、主體內(nèi)容區(qū)瀏覽體驗(yàn)規(guī)范

獲取成本方面：頁(yè)面打開速度需控制在3秒以內(nèi)，確保用戶等待時(shí)間在合理范圍；廣告區(qū)域需采用定制化模塊，并嚴(yán)格遵守醫(yī)療廣告樣式規(guī)范（具體詳見下一章節(jié)）；頁(yè)面上下范圍邊框等設(shè)計(jì)元素需參照下圖標(biāo)準(zhǔn)執(zhí)行。

瀏覽順暢性方面：排版需注重字號(hào)、字色及段落間距的科學(xué)設(shè)置。字號(hào)標(biāo)準(zhǔn)為：文章標(biāo)題72PX、模塊標(biāo)題54PX、文章內(nèi)容48PX、輔助信息39PX；字色標(biāo)準(zhǔn)為：醫(yī)療用色#02b7ca、黑色文字#1f1f1f、灰色文字#757575、淺灰文字#a3a3a3；段落間距標(biāo)準(zhǔn)為：文章段落90PX、文章行距36PX、摘要行距24PX，確保視覺(jué)體驗(yàn)的舒適性與閱讀的流暢性。

五、廣告一區(qū)廣告規(guī)范

廣告面積限制：廣告一區(qū)的廣告總面積占比不得超過(guò)10%，避免過(guò)度占用頁(yè)面空間。廣告內(nèi)容合規(guī)性：廣告內(nèi)容需同時(shí)符合國(guó)家廣告法相關(guān)規(guī)定及百度廣告審核準(zhǔn)入標(biāo)準(zhǔn)，嚴(yán)禁出現(xiàn)低俗內(nèi)容（醫(yī)療領(lǐng)域灰色廣告需從嚴(yán)審核）、賭博、法律法規(guī)明令禁止的違禁品或服務(wù)（包括純文字形式的各類廣告），以及誘導(dǎo)、欺騙、虛假宣傳等違規(guī)內(nèi)容。廣告樣式要求：禁止使用懸浮彈窗廣告（包括遮屏、置底、兩側(cè)懸浮等形式）；禁止廣告出現(xiàn)閃動(dòng)、抖動(dòng)等不固定狀態(tài)；禁止廣告與功能按鈕重疊；禁止廣告自動(dòng)播放或自動(dòng)下載；禁止設(shè)置引導(dǎo)用戶打開APP或下載APP的遮屏交互；禁止將廣告放置于用戶容易誤觸的區(qū)域（如與播放、購(gòu)買等功能按鈕重疊）；廣告需明確標(biāo)注“廣告”標(biāo)識(shí)，并配備關(guān)閉按鈕，確保用戶自主選擇權(quán)。具體廣告樣式標(biāo)準(zhǔn)如下圖所示。

六、技術(shù)實(shí)現(xiàn)規(guī)范

技術(shù)實(shí)現(xiàn)框架：全面采用開源MIP框架（https://www.mipengine.org）作為技術(shù)支撐，確保頁(yè)面的高效加載與適配性。組件應(yīng)用規(guī)范：B區(qū)（包含推薦區(qū)、廣告二區(qū)、廣告三區(qū)及服務(wù)區(qū)）需基于開源MIP框架的組件機(jī)制進(jìn)行開發(fā)，保障功能的模塊化與可維護(hù)性。技術(shù)解決方案文檔詳見：https://pan.baidu.com/s/1bpMyksn。技術(shù)咨詢聯(lián)系方式：QQ：3160059657。

來(lái)源：百度搜索資源平臺(tái) 百度搜索學(xué)堂