wap改版門戶界面設(shè)計(jì)-v1.5版

1、中國(guó)移動(dòng) WAP 門戶界面設(shè)計(jì)規(guī)范版 本 號(hào) ： V 1 . 52013-6中國(guó)移動(dòng)通信內(nèi)容(一) 前言(二) 介紹(三) 說(shuō)明(四) 視覺規(guī)范(五) 頁(yè)面框架(六) 頁(yè)面流程(七) 頁(yè)面實(shí)現(xiàn)前言由中國(guó)移動(dòng)通信公司業(yè)務(wù)支撐系統(tǒng)部提出并歸口。起草機(jī)構(gòu)：中國(guó)移動(dòng)通信公司業(yè)務(wù)支撐系統(tǒng)部。解釋機(jī)構(gòu)：中國(guó)移動(dòng)通信公司業(yè)務(wù)支撐系統(tǒng)部。介紹規(guī)范目的：=6門戶（）是全網(wǎng)首個(gè)直接進(jìn)行集中建設(shè)的電子，兩級(jí)門戶整合的總體思路是：一級(jí)門戶從業(yè)務(wù)功能、客戶界面、三個(gè)方面對(duì)省級(jí)門戶進(jìn)行整合，省級(jí)門戶僅作為一級(jí)門戶的補(bǔ)充。逐步實(shí)現(xiàn)全網(wǎng)共用一個(gè)門戶，并在此基礎(chǔ)上做好體驗(yàn)優(yōu)化和應(yīng)用推廣。為推進(jìn)兩級(jí) =6 門戶客戶界面的融合兩級(jí)

2、 =6 門戶風(fēng)格及客戶感知，總部基于一級(jí) =6 門戶頁(yè)面框架設(shè)計(jì)方案和視覺設(shè)計(jì)方案，制定了中國(guó)移動(dòng) =6 門戶界面設(shè)計(jì)規(guī)范 版。適用范圍：適用于中國(guó)移動(dòng)通信公司一級(jí) =6 門戶及省級(jí)=6門戶;/ 開發(fā)參考。整合要求：（一）業(yè)務(wù)功能的整合 、一級(jí)門戶提供全網(wǎng)共性業(yè)務(wù)和服務(wù)功能的承載；已由一級(jí)門戶承載的業(yè)務(wù)，省級(jí)門戶不再重復(fù)承載。 、省級(jí)門戶作為一級(jí)門戶的補(bǔ)充，僅承載以下三類業(yè)務(wù)：三類增值業(yè)務(wù)和本地套餐的辦理；本地活動(dòng)的辦理；本地創(chuàng)新功能（如商城、智能等）的應(yīng)用。（二）客戶界面的融合 、針對(duì)省級(jí)門戶上述三類業(yè)務(wù)功能，有關(guān)客戶界面的展示要求如下：（ ）三類增值業(yè)務(wù)和本地套餐的辦理：在一級(jí)門戶增值業(yè)務(wù)

3、欄和套餐欄設(shè)置業(yè)務(wù)，客戶點(diǎn)擊后跳轉(zhuǎn)至省級(jí)門戶，由省級(jí)門戶提供業(yè)務(wù)詳細(xì)信息展示和辦理功能。（ ）本地活動(dòng)的辦理：在一級(jí)門戶信息發(fā)布欄為信息提供發(fā)布，并設(shè)置辦理，客戶點(diǎn)擊后跳轉(zhuǎn)至省級(jí)門戶，由省級(jí)門戶提供活動(dòng)詳細(xì)信息展示和辦理功能。（ ）本地創(chuàng)新功能的應(yīng)用：在一級(jí)門戶設(shè)置功能，客戶點(diǎn)擊后跳轉(zhuǎn)至省級(jí)門戶，由省級(jí)門戶負(fù)責(zé)功能的具體展示和應(yīng)用。 、一級(jí)門戶為上述三類業(yè)務(wù)提供標(biāo)準(zhǔn)化、屬地化的導(dǎo)航展示，各公司依據(jù)進(jìn)行具體業(yè)務(wù)內(nèi)容的頁(yè)面開發(fā)。 、為確?？蛻粼谝患?jí)門戶和省級(jí)門戶間頁(yè)面跳轉(zhuǎn)體驗(yàn)的一致和服務(wù)流暢，省級(jí)門戶的頁(yè)頭、頁(yè)尾設(shè)計(jì)應(yīng)與一級(jí)門戶保持一致，客戶點(diǎn)擊導(dǎo)航欄和“返回”按鈕能順利進(jìn)行頁(yè)面跳轉(zhuǎn)。說(shuō)明視覺規(guī)范

4、：為執(zhí)行中國(guó)移動(dòng)通信公司 =6 門戶的管理，形成的客戶界面風(fēng)格，通過(guò)對(duì)界面視覺元素、設(shè)計(jì)樣式的規(guī)范及完善，從而提供的視覺設(shè)計(jì)。頁(yè)面模版規(guī)范的總體目標(biāo)是：滿足中國(guó)移動(dòng) WAP 門戶的管理，保持客戶界面的要求，確保在問(wèn)中國(guó)移動(dòng) WAP 門戶達(dá)到企業(yè)品牌形象。具體表現(xiàn)為：1、實(shí)現(xiàn)公司視覺元素的規(guī)范使用、視覺風(fēng)格的；2、實(shí)現(xiàn)中國(guó)移動(dòng) WAP 門戶頁(yè)面設(shè)計(jì)樣式遵循公司設(shè)計(jì)思路和結(jié)構(gòu)原則；本文檔用以詳盡說(shuō)明制作中國(guó)移動(dòng) WAP 門戶的視覺設(shè)計(jì)規(guī)范的模版規(guī)范。標(biāo)準(zhǔn)：中國(guó)移動(dòng)企業(yè) VI 規(guī)范頁(yè)面框架：主要描述 WAP 門戶頁(yè)面的框架要求，規(guī)范出頁(yè)面中每個(gè)區(qū)域的內(nèi)容要求。通過(guò)頁(yè)面框架規(guī)范WAP 門戶一級(jí)頁(yè)面及省

5、二級(jí)頁(yè)面的頁(yè)面布局，增加頁(yè)面的相似度，形成用戶在 WAP 門戶頁(yè)面的交互，用戶體驗(yàn)。備注：對(duì)于頁(yè)面框架章節(jié)描述的業(yè)務(wù)框架要素請(qǐng)以中國(guó)移動(dòng)WAP 門戶信息架構(gòu)及業(yè)務(wù)分類.doc為準(zhǔn)頁(yè)面流程：主要描述 WAP 門戶典型業(yè)務(wù)的頁(yè)面跳轉(zhuǎn)流程。通過(guò)規(guī)范典型業(yè)務(wù)的頁(yè)面跳轉(zhuǎn)流程，確保一級(jí)門戶和二級(jí)門戶同類型的業(yè)務(wù)在頁(yè)面跳轉(zhuǎn)的交互行為給用戶帶來(lái)相同的用戶體驗(yàn)，符合用戶的心理預(yù)期。頁(yè)面實(shí)現(xiàn)：主要描述 WAP 門戶頁(yè)面開發(fā)的要求。通過(guò)對(duì)前端頁(yè)面開發(fā)進(jìn)行規(guī)范確保一級(jí)門戶和省級(jí)門戶的一致性。視覺規(guī)范中國(guó)移動(dòng)WAP 門戶整體視覺風(fēng)格建立移動(dòng)整體 VI 風(fēng)格的基礎(chǔ)上,又因 WAP 門戶為終端應(yīng)用，故界面設(shè)計(jì)整體感覺更具親

6、和力。整體視覺風(fēng)格，主要視覺元素嚴(yán)格遵循規(guī)范，在規(guī)范允許范圍內(nèi)，進(jìn)行個(gè)性化設(shè)計(jì)創(chuàng)意。視覺規(guī)范的相關(guān)內(nèi)容主要對(duì)客戶界面效果進(jìn)行規(guī)范，具體架構(gòu)及業(yè)務(wù)流程參看 UI 及頁(yè)面實(shí)現(xiàn)部分。主要視覺元素內(nèi)容包括：Logo 設(shè)置、色值、文字樣式、效果表現(xiàn)及尺寸、圖片規(guī)范、界面尺寸、屏幕分辨率的顯示分辨率，效果圖展示。Logo 設(shè)置Logo 標(biāo)識(shí)是企業(yè)和品牌的視覺象征，對(duì)于企業(yè)的整體至關(guān)重要，中國(guó)移動(dòng)Logo 的網(wǎng)絡(luò)應(yīng)用將遵循以下規(guī)定執(zhí)行。首頁(yè)面設(shè)置標(biāo)識(shí)。注：Logo 標(biāo)識(shí)的度量是pixel（像素)。中國(guó)移動(dòng) WAP門戶（含省公司），使用時(shí)需保證 Logo的比例以及背景顏色（淡藍(lán)色）不變。品牌專區(qū)采用品牌 Lo

7、go。色值色彩的運(yùn)用是為了美觀設(shè)計(jì)，吸引人們的注意力以及更好地區(qū)隔不同層級(jí)的內(nèi)容。規(guī)定主體風(fēng)格以藍(lán)色為主,內(nèi)容區(qū)域的背景色設(shè)置為淡藍(lán)色（#f3faff）。#顏色HTML 色值RGB組合分欄背景色漸變藍(lán)色#daf1ff#9bd2f4R:218 G:241 B:255R:155 G:210 B:244內(nèi)容詳情顏色藍(lán)色#f3faffR:243 G:250 B:255按鈕顏色橙色#800R:255 G:168 B:0頂部面包屑導(dǎo)航欄背景色宋體12pt#30aefb #279de5顏色名HTML 色值RGB主導(dǎo)航背景色漸變灰色#f9f9f9 #f2f2f2R:249 G:249 B:249 R:242

8、G:242 B:242標(biāo)題欄背景色漸變藍(lán)色#31adfb #289de7R:49 G: 173 B:251 R:40 G: 157 B:231頁(yè)尾背景色藍(lán)色#36aaf4R:54 G: 170 B:244文字樣式字體宋體字號(hào)12pt字體設(shè)置（粗體/斜體）正常字體顏色藍(lán)色：#5abdfd(normal)橘色：#ff9d12(normal)字體宋體字號(hào)12pt字體設(shè)置（粗體/斜體）正常字體顏色#21577a (normal)字體宋體字號(hào)12pt字體設(shè)置（粗體/斜體）正常字體顏色#e60012(normal)標(biāo)題與正文的間距10px行于行的文字間距10px字體宋體字號(hào)12pt字體設(shè)置（粗體/斜體）正

9、常字體顏色#1f5fa8 (normal)字體宋體字號(hào)12pt字體設(shè)置（粗體/斜體）正常字體顏色#333333 (normal)表現(xiàn)效果及尺寸公司門戶的主導(dǎo)航分為頁(yè)頭區(qū)域和導(dǎo)航欄區(qū)域。頁(yè)頭區(qū)域包括Logo 位置、導(dǎo)航區(qū)域欄目菜單設(shè)計(jì)。主導(dǎo)航第一行規(guī)格詳述:字體宋體字號(hào)12pt普通按鈕#800字體宋體加粗字號(hào)12pt前景色#3f3f3f背景色#bed到#94c9f0 漸變字體宋體字號(hào)12pt字體顏色#555555# 38f背景色#31adfc 到#289de7 漸變(點(diǎn)擊效果) #f9f9f9 到#f2f2f2 漸變（未點(diǎn)擊效果）質(zhì)量控制在 1K 以內(nèi)圖標(biāo)顏色# 字體宋體 字號(hào)12pt 顏色#

10、289de7行高 20px24x14px當(dāng)前位置路徑顯示欄是在一級(jí)頻道下屬各頁(yè)面主體內(nèi)容區(qū)域頂端顯示頁(yè)面所屬欄目層級(jí)結(jié)構(gòu)的導(dǎo)航信息。字體宋體字號(hào)12pt新增活動(dòng)標(biāo)志#fea109 到#ed8d25 漸變熱門活動(dòng)標(biāo)志#ff8c6e 到#e64625 漸變文字鏈后面的書名號(hào)箭頭，當(dāng)要顯示 HOT 或 NEW 的圖標(biāo)時(shí)，要在原有位置進(jìn)行替換，替換后原書名號(hào)箭頭不再顯示每行文字鏈最多為 24 個(gè)字符字體宋體字號(hào)12pt重點(diǎn)號(hào)顏色#1f5fa8漸變色#30aefb 到#279de5 漸變界面尺寸為適應(yīng)更大范圍用戶，中國(guó)移動(dòng) WAP 門戶所有頁(yè)面頁(yè)寬設(shè)定為 240X320，確保用戶在 2.4 吋系列、2.

11、8 吋系列、3.0 系列、3.2 吋系列、3.5 吋系列屏寬顯示中的正常瀏覽。240X320 在保持實(shí)用的同時(shí)，還能保證你的能夠在眾多設(shè)備上顯示正常。目前，屏幕的物理尺寸是多種多樣的，并沒有相應(yīng)的技術(shù)規(guī)范和市場(chǎng)標(biāo)準(zhǔn)。雖然屏幕越大越好，但是受制于便于攜帶、便于掌握等多種，只能在幾種主流的屏幕物理尺寸之間進(jìn)行取舍選擇。屏幕的物理尺寸主要包括：2.4 吋系列、2.8 吋系列、3.0系列、3.2 吋系列、3.5 吋系列、4 吋和 5 吋系列。屏幕的顯示分辨率目前，QVGA 是屏幕上一種最普遍的顯示分辨率標(biāo)準(zhǔn)。為了能夠?qū)崿F(xiàn)“用戶界面的兼容性”和“上網(wǎng)的標(biāo)準(zhǔn)化”，在屏幕上應(yīng)該采用CQVGA 顯示分辨率標(biāo)準(zhǔn)

12、。 為了能夠在屏幕上更好的瀏覽web 網(wǎng)頁(yè)，應(yīng)該采用 W2VGA 顯示分辨率屏幕按顯示分辨率，可分為 CQVGA、QVGA、QWVGA、VGA、WVGA、W2VGA 等。規(guī)范文件格式GIF和 JPG 的格式均可被應(yīng)用。1、的選用與反映的一致，畫面顯示清晰，不采用改變顯示尺寸的放大或縮小的方法；2、每張必須添加注釋文字（alternative text）；按照“所屬欄目名_描述名”的規(guī)則命名，例如，活動(dòng)中“12580 越打越驚喜”的，可命名為： news_sailing.jpg ；名稱均由小寫字母、數(shù)字和“_”組成，不能有空格或其它字符。移動(dòng)活動(dòng)短標(biāo)題要控制在 12 字以內(nèi)才能在一行以內(nèi)完整顯示

13、。標(biāo)題折行會(huì)造成在相同空間承載信息量減少；頻繁的眼動(dòng)容易引起視疲勞；在視覺上帶來(lái)無(wú)序松散的感受。上沒有很多的橫向空間給你發(fā)揮，一個(gè)橫向布局機(jī)并不實(shí)用，因?yàn)槠聊怀叽绮灰?。效果圖展示（一）登陸首頁(yè)（二）業(yè)務(wù)詳情頁(yè)面框架頁(yè)面框架規(guī)范對(duì) WAP 門戶的典型頁(yè)面給出了框架要求。本章節(jié)的目的是規(guī)范典型頁(yè)面的布局，每個(gè)頁(yè)面的圖示分為兩部分：左圖部分為示意頁(yè)面，右圖部分為頁(yè)面的框架要求?？蚣芤笸ㄟ^(guò)色塊來(lái)說(shuō)明?？蚣苌珘K說(shuō)明以下每個(gè)頁(yè)面的色塊所表示的含義請(qǐng)參見上圖。（一） 首頁(yè)未登錄頁(yè)面1.Logo 區(qū)域CMNET 方式頁(yè)面，首頁(yè)必須顯示logo 區(qū)域2.一級(jí)導(dǎo)航區(qū)域現(xiàn)階段固定的一級(jí)導(dǎo)航內(nèi)容為：首頁(yè)、充值、查詢

14、、辦理、3.公告區(qū)域點(diǎn)擊公告進(jìn)入公告列表頁(yè)點(diǎn)擊公告后的文字進(jìn)入該公告的詳情頁(yè)4.區(qū)域方式顯示內(nèi)容5.活動(dòng)區(qū)域CMNET 方式下顯示四條的活動(dòng)“首頁(yè)導(dǎo)航欄區(qū)域”點(diǎn)擊頻道，進(jìn)入活動(dòng)列表頁(yè)面點(diǎn)擊活動(dòng)列表進(jìn)入活動(dòng)詳情頁(yè)面6.業(yè)務(wù)查詢區(qū)域提供 6 個(gè)查詢業(yè)務(wù)。6 個(gè)全網(wǎng)基本服務(wù)內(nèi)容為賬單查詢、余額查詢、積分查詢、在用業(yè)務(wù)查詢、GPRS 流量查詢、歸屬地查詢。7.業(yè)務(wù)辦理區(qū)域?qū)I(yè)務(wù)辦理分為【套餐】、【生活 】、【資訊 商務(wù)】、【基礎(chǔ)服務(wù)】四類【套餐】資費(fèi)套餐、隨e 行無(wú)線寬帶（WLAN）【生活 】139 郵箱、飛信、號(hào)簿管家、彩鈴【資訊 商務(wù)】報(bào)、12580 業(yè)務(wù)、閱讀、【基礎(chǔ)服務(wù)】回執(zhí)、呼叫等待、呼叫轉(zhuǎn)

15、移、來(lái)電顯示點(diǎn)擊進(jìn)入相關(guān)業(yè)務(wù)的WAP 頁(yè)面8.積分服務(wù)區(qū)域包括積分查詢和訂單，其中訂單到積分商城的訂單【熱門兌換】30 元話費(fèi)直充、50 元話費(fèi)直充，直接到積分商城；而點(diǎn)擊【熱門兌換】文字到積分商城熱門兌換頁(yè)面9.中心區(qū)域提供營(yíng)業(yè)廳和隨e 行客戶端，兩個(gè)客戶端功能10. 站點(diǎn)導(dǎo)航區(qū)域提供 8 個(gè)業(yè)務(wù)的。飛信、音樂(lè)、郵箱、MM、閱讀、支付點(diǎn)擊進(jìn)入相關(guān)業(yè)務(wù)的WAP 頁(yè)面11. 服務(wù)支持區(qū)域包含：常見問(wèn)題、服務(wù)、三塊內(nèi)容12. 底部快捷區(qū)域快捷功能，如存為書簽、移動(dòng)、普通版式和炫彩版式的切換等13.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（二） 首頁(yè)已登錄頁(yè)面1.Logo 區(qū)域CMWAP 方式頁(yè)面，首頁(yè)必須顯示

16、logo 區(qū)域2.一級(jí)導(dǎo)航區(qū)域現(xiàn)階段固定的一級(jí)導(dǎo)航內(nèi)容為：首頁(yè)、充值、查詢、辦理、3.用戶信息說(shuō)明顯示該用戶機(jī)號(hào)碼4.公告區(qū)域文字方式顯示公告內(nèi)容（同首頁(yè)未登錄頁(yè)面的公告區(qū)域一致）5.區(qū)域方式顯示內(nèi)容6.活動(dòng)區(qū)域CMWAP 方式下分別顯示二條的活動(dòng)和二條省公司活動(dòng)“一級(jí)導(dǎo)航區(qū)域”點(diǎn)擊頻道，進(jìn)入活動(dòng)列表頁(yè)面點(diǎn)擊活動(dòng)列表進(jìn)入活動(dòng)詳情頁(yè)面7.業(yè)務(wù)查詢區(qū)域提供 6 個(gè)查詢業(yè)務(wù)。6 個(gè)全網(wǎng)基本服務(wù)內(nèi)容為賬單查詢、余額查詢、積分查詢、在用業(yè)務(wù)查詢、GPRS 流量查詢、歸屬地查詢提供 2 個(gè)省公司的查詢業(yè)務(wù)8.業(yè)務(wù)辦理區(qū)域?qū)I(yè)務(wù)辦理分為【套餐】、【生活 】、【資訊 商務(wù)】、【基礎(chǔ)服務(wù)】四類【套餐】資費(fèi)套餐、

17、隨e 行無(wú)線寬帶（WLAN）、省公司 2 個(gè)業(yè)務(wù)【生活 】139 郵箱、飛信、省公司 2 個(gè)業(yè)務(wù)【資訊 商務(wù)】報(bào)、省公司 3 個(gè)業(yè)務(wù)【基礎(chǔ)服務(wù)】回執(zhí)、省公司 3 個(gè)業(yè)務(wù)點(diǎn)擊進(jìn)入相關(guān)業(yè)務(wù)的WAP 頁(yè)面9.積分服務(wù)區(qū)域包括積分查詢和訂單。其中訂單到積分商城的訂單。省公司 2 個(gè)業(yè)務(wù)【熱門兌換】30 元話費(fèi)直充、50 元話費(fèi)直充，直接到積分商城；省公司 2 個(gè)兌換業(yè)務(wù)。而點(diǎn)擊【熱門兌換】文字到積分商城熱門兌換頁(yè)面10. 特色專區(qū)區(qū)域包含客戶端的中心，以及為省公司自建的特色內(nèi)容11. 站點(diǎn)導(dǎo)航區(qū)域提供 8 個(gè)業(yè)務(wù)的。飛信、音樂(lè)、郵箱、MM、閱讀、支付點(diǎn)擊進(jìn)入相關(guān)業(yè)務(wù)的WAP 頁(yè)面12. 服務(wù)支持區(qū)域包

18、含：常見問(wèn)題、服務(wù)、三塊內(nèi)容13. 底部快捷區(qū)域快捷功能，如存為書簽、移動(dòng)、普通版式和炫彩版式的切換等14.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（三） 查詢未登錄頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前業(yè)務(wù)查詢頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)業(yè)務(wù)查詢的一級(jí)2 返回必須提供：返回首頁(yè)的3說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（四） 查詢已登錄頁(yè)面1 面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前業(yè)務(wù)查詢頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)業(yè)務(wù)查詢的一級(jí)2 查詢業(yè)務(wù)查詢頁(yè)面包括一級(jí)承載的業(yè)務(wù)和省公司業(yè)務(wù)的。如果是一級(jí)，提供一級(jí)分類（2.1），如果是省級(jí)業(yè)務(wù)查詢提供省級(jí)分類（2.2）3

19、返回必須提供：返回首頁(yè)的4說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（五） 辦理未登錄頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前業(yè)務(wù)辦理頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)業(yè)務(wù)辦理的一級(jí)2.分類列表業(yè)務(wù)辦理的分類是用分類標(biāo)題和分割線區(qū)分分類中是一級(jí)業(yè)務(wù)3.返回必須提供：返回首頁(yè)的一級(jí)4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（六） 辦理已登錄頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前業(yè)務(wù)辦理頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)業(yè)務(wù)辦理的一級(jí)2.分類列表業(yè)務(wù)辦理的分類是用分類標(biāo)題和分割線區(qū)分業(yè)務(wù)辦理頁(yè)面包括一級(jí)承載的業(yè)務(wù)和省公司業(yè)務(wù)的。分類中可以是一級(jí)業(yè)務(wù)（2.1），也可以是省級(jí)業(yè)務(wù)

20、（2.2）3.返回必須提供：返回首頁(yè)的一級(jí)4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（七） 業(yè)務(wù)辦理分類頁(yè)未登錄1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前套餐頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)業(yè)務(wù)辦理的一級(jí)；第三層級(jí)是一級(jí)承載的業(yè)務(wù)名稱2.分類列表分類中是一級(jí)辦理業(yè)務(wù)3.返回必須提供：返回首頁(yè)和業(yè)務(wù)辦理頁(yè)的一級(jí)4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（八） 業(yè)務(wù)辦理分類頁(yè)已登錄1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前套餐頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)業(yè)務(wù)辦理的一級(jí)；第三層級(jí)可以是一級(jí)承載，也可以是省公司的業(yè)務(wù)名稱2.分類列表業(yè)務(wù)辦理分類頁(yè)面包括一級(jí)承載的業(yè)務(wù)和省公司業(yè)務(wù)的鏈

21、接。分類中可以是一級(jí)業(yè)務(wù)（2.1），也可以是省級(jí)業(yè)務(wù)（2.2）3.返回必須提供：返回首頁(yè)和業(yè)務(wù)辦理頁(yè)的一級(jí)4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（九） 特色專區(qū)未登錄頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前中心頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)中心的一級(jí)在未登錄時(shí)第二級(jí)層是中心；在已登錄后第二級(jí)層是特色專區(qū)，中心歸屬在特色專區(qū)內(nèi)2.中心一級(jí)門戶承載的客戶端3.返回必須提供：返回首頁(yè)的一級(jí)4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（十） 特色專區(qū)已登錄頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前特色專區(qū)頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)特色專區(qū)的一級(jí)2.中心中心欄目包括一

22、級(jí)承載的和省公司的。一級(jí)門戶承載的（2.1）?？梢愿鶕?jù)需求提供（2.2）3.省級(jí)只有省級(jí)詳情頁(yè)面才有該區(qū)域，制作規(guī)格、視覺規(guī)范與其它頁(yè)面相同各個(gè)省公司創(chuàng)新業(yè)務(wù)、個(gè)性化應(yīng)用的展現(xiàn)各個(gè)省可以根據(jù)需求提供一些分類內(nèi)容，如客戶服務(wù)類、主推的或熱門業(yè)務(wù)、產(chǎn)品等功能內(nèi)容4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（十一）服務(wù)支持頁(yè)面CMNET、CMWAP 方式頁(yè)面展示的內(nèi)容都是一致的。1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前服務(wù)支持頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)服務(wù)支持的一級(jí)2.常見問(wèn)題提供展示相關(guān)問(wèn)題及解答3.服務(wù)內(nèi)容包括：網(wǎng)上門戶地址、營(yíng)業(yè)廳辦理方法、10086 熱線、自助終端、WAP 營(yíng)業(yè)

23、廳、營(yíng)業(yè)廳，各介紹及使用方法4.提供內(nèi)容問(wèn)卷5.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（十二）詳情頁(yè)-查詢類頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前余額查詢頁(yè)面不可點(diǎn)擊第一、第二層級(jí)必須是：首頁(yè)業(yè)務(wù)查詢；第三層級(jí)，可以是一級(jí)門戶的業(yè)務(wù)名稱（1.1），也可以是省級(jí)門戶的業(yè)務(wù)名稱（1.2）2.查詢信息展示主要展現(xiàn)查詢結(jié)果。要有其他分類，如查詢?cè)路萁Y(jié)果也一并在此展示3.其他相關(guān)業(yè)務(wù)主要展現(xiàn)一級(jí)承載的其他查詢業(yè)務(wù)4.返回必須提供：返回首頁(yè)的一級(jí)必須提供返回分類頁(yè)的：一級(jí)門戶的分類頁(yè)5.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（十三）詳情頁(yè)-辦理類頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前基

24、礎(chǔ)服務(wù)頁(yè)面不可點(diǎn)擊第一、第二層級(jí)必須是：首頁(yè)業(yè)務(wù)辦理；第三層級(jí)，可以是一級(jí)門戶的業(yè)務(wù)名稱（1.1），也可以是省級(jí)門戶的業(yè)務(wù)名稱（1.2）2.業(yè)務(wù)信息顯示：業(yè)務(wù)圖標(biāo)，業(yè)務(wù)名稱，業(yè)務(wù)亮點(diǎn)文字及辦理按扭3.業(yè)務(wù)介紹包括：適用范圍、業(yè)務(wù)說(shuō)明、業(yè)務(wù)資費(fèi)、業(yè)務(wù)辦理、使用幫助默認(rèn)展開使用范圍和業(yè)務(wù)說(shuō)明其他業(yè)務(wù)介紹點(diǎn)擊后顯示4.其他相關(guān)業(yè)務(wù)主要展現(xiàn)相關(guān)的其他業(yè)務(wù)，除本業(yè)務(wù)外的其他五個(gè)由一級(jí)承載的業(yè)務(wù)辦理5.返回必須提供：返回首頁(yè)和業(yè)務(wù)辦理的三級(jí)分類頁(yè)的一級(jí)必須提供返回分類頁(yè)的：一級(jí)門戶的分類頁(yè)6.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（十四）詳情頁(yè)-充值類頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前充值交

25、費(fèi)頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)充值交費(fèi)的一級(jí)2.用戶輸入?yún)^(qū)用戶輸入的信息必須分類，如號(hào)碼，繳費(fèi)金額必須提供分類標(biāo)題提供“提交”按鈕，點(diǎn)擊進(jìn)入支付頁(yè)面點(diǎn)擊為他人充值時(shí)，如果沒有輸入號(hào)碼就點(diǎn)擊充值按鍵，會(huì)有提示信息：“請(qǐng)輸入 11 位數(shù)字組成的待繳費(fèi)號(hào)碼!”3.其他相關(guān)業(yè)務(wù)主要展現(xiàn)一級(jí)承載的其他查詢業(yè)務(wù)4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（十五）詳情頁(yè)-套餐訂購(gòu)頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前套餐頁(yè)面不可點(diǎn)擊第一，第二、第三層級(jí)必須是：首頁(yè)業(yè)務(wù)辦理套餐的一級(jí)2.業(yè)務(wù)信息必須顯示：業(yè)務(wù)圖標(biāo)，業(yè)務(wù)名稱，業(yè)務(wù)亮點(diǎn)文字套餐分類用單選框?qū)崿F(xiàn)，用戶可以點(diǎn)選后訂購(gòu)每個(gè)分類提供查看

26、詳情的，點(diǎn)擊進(jìn)入【詳情頁(yè)-套餐訂購(gòu)查看詳情頁(yè)面】頁(yè)面示例（2.1）介紹，如，業(yè)務(wù)說(shuō)明，業(yè)務(wù)資費(fèi)介紹點(diǎn)擊后顯示。要根據(jù)本查詢業(yè)務(wù)歸屬于一級(jí)還是省級(jí)而定。如果是一級(jí)，提供一級(jí)2.2），如果是省級(jí)業(yè)務(wù)提供省級(jí)2.3）其中在未選擇詳細(xì)套餐就點(diǎn)擊辦理按扭后，會(huì)有提示信息：“請(qǐng)選擇您要辦理的業(yè)務(wù)”3.返回必須提供：返回首頁(yè)和業(yè)務(wù)辦理的三級(jí)分類頁(yè)的一級(jí)必須提供返回分類頁(yè)的：一級(jí)門戶的分類頁(yè)4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（十六）詳情頁(yè)-套餐訂購(gòu)查看詳情頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前套餐頁(yè)面不可點(diǎn)擊第一，第二、第三層級(jí)必須是：首頁(yè)業(yè)務(wù)查詢套餐的一級(jí)2.業(yè)務(wù)信息必須顯示：業(yè)務(wù)圖標(biāo)，業(yè)

27、務(wù)名稱，業(yè)務(wù)亮點(diǎn)文字（2.1）套餐費(fèi)用詳情顯示，建議分類別顯示，讓用戶一目了然提供辦理功能按鈕（2.2）其他套餐分類，每個(gè)分類提供查看詳情的。要根據(jù)套餐所屬分類歸屬于一級(jí)還是省級(jí)而定。如果是一級(jí)，提供一級(jí)（2.3），如果是省級(jí)業(yè)務(wù)提供省級(jí)（2.4）3.返回必須提供：返回首頁(yè)的一級(jí)必須提供返回分類頁(yè)的：一級(jí)門戶的分類頁(yè)4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（十七）詳情頁(yè)-套餐退訂頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前立即辦理頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)業(yè)務(wù)辦理的一級(jí)2.業(yè)務(wù)信息必須顯示：業(yè)務(wù)圖標(biāo)，業(yè)務(wù)名稱，業(yè)務(wù)亮點(diǎn)文字當(dāng)前套餐信息顯示提供辦理功能按鈕介紹，如，業(yè)務(wù)說(shuō)明，業(yè)

28、務(wù)資費(fèi)介紹點(diǎn)擊后顯示。要根據(jù)本查詢業(yè)務(wù)歸屬于一級(jí)還是省級(jí)而定。如果是一級(jí)，提供一級(jí)內(nèi)容信息（2.1），如果是省級(jí)業(yè)務(wù)提供省級(jí)內(nèi)容信息（2.2）3.返回必須提供：返回首頁(yè)和業(yè)務(wù)辦理的三級(jí)分類頁(yè)的一級(jí)必須提供返回分類頁(yè)的：一級(jí)門戶的分類頁(yè)4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（十八）詳情頁(yè)-活動(dòng)頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前活動(dòng)詳細(xì)頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)活動(dòng)的一級(jí)；第三層級(jí)是活動(dòng)的名稱，可以是一級(jí)門戶的活動(dòng)名稱（1.1），也可以是省級(jí)門戶的活動(dòng)（1.2）2.活動(dòng)信息顯示活動(dòng)的歸類，如特色活動(dòng)，積分活動(dòng)，活動(dòng)等等。顯示活動(dòng)標(biāo)題顯示顯示活動(dòng)內(nèi)容介紹3.活動(dòng)如本活動(dòng)

29、有(如客戶端等)需要展示要根據(jù)本查詢業(yè)務(wù)歸屬于一級(jí)還是省級(jí)而定。如果是一級(jí)，提供一級(jí)相關(guān)業(yè)務(wù)（3.1），如果是省級(jí)業(yè)務(wù)查詢提供省級(jí)相關(guān)業(yè)務(wù)（3.2）4.返回必須提供：返回首頁(yè)的一級(jí)必須提供返回分類頁(yè)的：一級(jí)門戶的分類頁(yè)5.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（十九）提示頁(yè)-確認(rèn)頁(yè)面適用場(chǎng)景：用戶點(diǎn)擊業(yè)務(wù)辦理或開通后，二次確認(rèn)時(shí)顯示的頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前隨 e 行無(wú)線寬帶頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)業(yè)務(wù)辦理的一級(jí)；第三層級(jí)是業(yè)務(wù)名稱，可以是一級(jí)門戶的業(yè)務(wù)名稱（1.1），也可以是省級(jí)門戶的業(yè)務(wù)名稱（1.2）2.提示信息必須有標(biāo)題，如，確認(rèn)，成功，失敗等提示文

30、字顯示按鈕區(qū)域，包括確認(rèn)按鈕，返回按鈕3.返回必須提供：返回首頁(yè)和業(yè)務(wù)辦理的三級(jí)分類頁(yè)的一級(jí)必須提供返回該項(xiàng)業(yè)務(wù)的詳細(xì)頁(yè)：可以是一級(jí)門戶的業(yè)務(wù)名稱（3.1），也可以是省級(jí)門戶的業(yè)務(wù)名稱（3.2）4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（二十）提示頁(yè)-成功頁(yè)面適用場(chǎng)景：用戶在WAP 上業(yè)務(wù)辦理成功后反饋給用戶的頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前訂購(gòu)頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)業(yè)務(wù)辦理的一級(jí)；第三層級(jí)是業(yè)務(wù)名稱，可以是一級(jí)門戶的業(yè)務(wù)名稱（1.1），也可以是省級(jí)門戶的業(yè)務(wù)名稱（1.2）2.提示信息必須有標(biāo)題，如，確認(rèn)，成功，失敗等提示文字顯示其他顯示，如地址等3.返回必須提

31、供：返回首頁(yè)和業(yè)務(wù)辦理的三級(jí)分類頁(yè)的一級(jí)必須提供返回該項(xiàng)業(yè)務(wù)的詳細(xì)頁(yè)：可以是一級(jí)門戶的業(yè)務(wù)名稱（3.1），也可以是省級(jí)門戶的業(yè)務(wù)名稱（3.2）4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（二十一） 提示頁(yè)-失敗頁(yè)面適用場(chǎng)景：用戶在WAP 上業(yè)務(wù)辦理失敗后反饋給用戶的頁(yè)面1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前訂購(gòu)頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)業(yè)務(wù)辦理的一級(jí)2.提示信息必須有標(biāo)題，如，確認(rèn)，成功，失敗等提示文字顯示備注說(shuō)明信息3.返回必須提供：返回首頁(yè)和業(yè)務(wù)辦理的三級(jí)分類頁(yè)的一級(jí)必須提供返回該項(xiàng)業(yè)務(wù)的詳細(xì)頁(yè)：可以是一級(jí)門戶的業(yè)務(wù)名稱（3.1），也可以是省級(jí)門戶的業(yè)務(wù)名稱（3.2）4.說(shuō)

32、明區(qū)域每個(gè)頁(yè)面底部必須顯示（二十二） 提示頁(yè)-報(bào)錯(cuò)頁(yè)面適用場(chǎng)景：系統(tǒng)繁忙，連接異常時(shí)接口返回?cái)?shù)據(jù)有錯(cuò)連接超時(shí)1.面包屑導(dǎo)航區(qū)提供用戶頁(yè)面的層級(jí)路徑且可以返回，當(dāng)前報(bào)錯(cuò)頁(yè)面不可點(diǎn)擊第一，第二層級(jí)必須是：首頁(yè)（如業(yè)務(wù)查詢、業(yè)務(wù)辦理、積分服務(wù)等的二級(jí)頻道頁(yè)面）的一級(jí)2.提示信息必須有標(biāo)題，如，確認(rèn)，成功，失敗等提示文字顯示3.返回必須提供：返回首頁(yè)的一級(jí)必須提供返回該項(xiàng)業(yè)務(wù)的詳細(xì)頁(yè)：可以是一級(jí)門戶的業(yè)務(wù)名稱（3.1），也可以是省級(jí)門戶的業(yè)務(wù)名稱（3.2）4.說(shuō)明區(qū)域每個(gè)頁(yè)面底部必須顯示（二十三） 提示文字要求1）業(yè)務(wù)辦理相關(guān)提示：尊敬的客戶，您正在訂購(gòu)的業(yè)務(wù)是：，“確認(rèn)”按鈕確認(rèn)開通尊敬的客戶，您已

33、成功辦理業(yè)務(wù)，感謝您的使用尊敬的客戶，您已開通業(yè)務(wù)，無(wú)需重復(fù)申請(qǐng)。感謝您的使用尊敬的客戶，您已取消業(yè)務(wù)，感謝您的使用2）查詢相關(guān)提示：尊敬的客戶，每月的 1-3 日為系統(tǒng)出帳期，建議您在每月 4 日后進(jìn)行查詢查詢功能類提示：查詢結(jié)果參考，請(qǐng)以當(dāng)?shù)匾苿?dòng)公司出帳賬單為準(zhǔn)3）服務(wù)錯(cuò)誤提示：網(wǎng)絡(luò)異常，請(qǐng)稍候再試系統(tǒng)忙，請(qǐng)稍候再試當(dāng)交換中心無(wú)法根據(jù)請(qǐng)求報(bào)文找到方交換節(jié)點(diǎn)，對(duì)神州行用戶服務(wù)亦返回此應(yīng)答碼。所有交易。輸出 錯(cuò)誤提示：您機(jī)號(hào)碼不支持此功能4）服務(wù)提示：疑問(wèn)，請(qǐng)當(dāng)?shù)?10086具體資費(fèi)以當(dāng)?shù)匾苿?dòng)公司為準(zhǔn)溫馨提示：點(diǎn)擊“立即繳費(fèi)”按鈕后，您可以選擇支付賬戶繳費(fèi)或者繳費(fèi)登錄框上顯示“溫馨提示：您目前

34、選用的是非 )3=6接入方式，可能會(huì)產(chǎn)生流量費(fèi)用，請(qǐng)您確認(rèn)后使用”頁(yè)面流程頁(yè)面流程規(guī)范對(duì) =6 門戶的典型業(yè)務(wù)的頁(yè)面流程進(jìn)行了規(guī)范，本章節(jié)主要通過(guò)流程圖來(lái)進(jìn)行說(shuō)明，并對(duì)流程圖進(jìn)行文字解釋。 一 相關(guān)業(yè)務(wù)權(quán)限說(shuō)明用戶可以通過(guò)ISGV 和ISTKZ 兩種接入點(diǎn)方式進(jìn)行：通過(guò) ISGV 方式的用戶，可以獲得用戶號(hào)碼，并且手機(jī)號(hào)碼會(huì)在首頁(yè)進(jìn)行展示。用戶可以在業(yè)務(wù)辦理頁(yè)面查看和辦理相關(guān)的業(yè)務(wù)信息，并且可以在業(yè)務(wù)查詢頁(yè)面查詢自己號(hào)碼的話費(fèi)、流量、賬單等信息。通過(guò) ISTKZ 方式的用戶，只能查看相關(guān)的業(yè)務(wù)，不可以進(jìn)行辦理，也不能查看用戶話費(fèi)、流量、賬單等信息。具體請(qǐng)參見以下的業(yè)務(wù)查詢和業(yè)務(wù)辦理流程。 二

35、業(yè)務(wù)查詢流程通過(guò) ISGV 方式的用戶，可以在業(yè)務(wù)查詢相關(guān)頁(yè)面，對(duì)本人的話費(fèi)、流量、賬單等信息進(jìn)行查詢。通過(guò) ISTKZ 方式的用戶，不可以進(jìn)行業(yè)務(wù)查詢操作，頁(yè)面會(huì)提示用戶更換 cmwap 方式進(jìn)行。(三)業(yè)務(wù)辦理流程通過(guò) cmwap 方式：(四)退訂流程點(diǎn)擊“”進(jìn)入活動(dòng)列表頁(yè)，選擇省活動(dòng)標(biāo)題并點(diǎn)擊進(jìn)入活動(dòng)介紹頁(yè)，活動(dòng)，點(diǎn)擊進(jìn)入省活動(dòng)詳情頁(yè)在查詢、辦理區(qū)域（見頁(yè)面框架）點(diǎn)擊，進(jìn)入省級(jí)業(yè)務(wù)詳情頁(yè)面在查詢、辦理區(qū)域（見頁(yè)面框架）點(diǎn)擊“標(biāo)題”，進(jìn)入二級(jí)頁(yè)面，選擇省級(jí)服務(wù)，進(jìn)入省級(jí)業(yè)務(wù)詳情頁(yè)面頁(yè)面實(shí)現(xiàn)頁(yè)面實(shí)現(xiàn)主要針對(duì)程序開發(fā)中的頁(yè)面要求給出說(shuō)明。包括兼容性說(shuō)明以及頁(yè)面制作的基。 一 兼容性說(shuō)明中國(guó)移動(dòng)

36、 =6 門戶在以下系統(tǒng)環(huán)境瀏覽 屏幕寬度為適應(yīng)更大范圍用戶，中國(guó)移動(dòng) =6 門戶所有頁(yè)面頁(yè)寬設(shè)定為 ，確保用戶在 吋系列、 吋系列、 系列、 吋系列、 吋系列屏寬顯示中的正常瀏覽。操作系統(tǒng)瀏覽器分辨率色彩MTK()SymbianWind ows MobileAndroidWindowsCE Symbian OSOSIE Mobile opera mobilesafari android browserQVGA= 320*240.262144 色(即 26 萬(wàn)色，2 的 18次方)目前，屏幕的物理尺寸是多種多樣的，并沒有相應(yīng)的技術(shù)規(guī)范和市場(chǎng)標(biāo)準(zhǔn)。雖然屏幕越大越好，但是受制于便于攜帶、便于掌握等多種，只能在幾種主流的屏幕物理尺寸之間進(jìn)行取舍選擇。屏幕的物理尺寸主要包括：2.4 吋系列、2.8 吋系列、3.0系列、3.2 吋系列、3.5 吋系列、4 吋和 5 吋系列。目前，QVGA 是屏幕上一種最普遍的顯示分辨率標(biāo)準(zhǔn)。為了能夠?qū)崿F(xiàn)“用戶界面的兼容性”和“上網(wǎng)的標(biāo)準(zhǔn)化”，在屏幕上應(yīng)該采用CQVGA 顯示分辨率標(biāo)準(zhǔn)。 為了能夠在屏幕上更好的瀏覽web 網(wǎng)頁(yè)，應(yīng)該采用 W2VGA 顯示分辨率。瀏覽器適配由于瀏覽