1.廣州網(wǎng)頁(yè)設(shè)計(jì)的目的是什么？我們?yōu)槭裁匆O(shè)計(jì)網(wǎng)頁(yè)？

　　在設(shè)計(jì)網(wǎng)頁(yè)之前，最重要的是弄清楚這個(gè)設(shè)計(jì)的目的是什么。網(wǎng)頁(yè)的設(shè)計(jì)不僅僅是為了好看。如果只是為了好看，可以直接上高清大圖。網(wǎng)頁(yè)的設(shè)計(jì)絕不僅僅是模仿，別人的設(shè)計(jì)不一定是對(duì)自己最好的。因此，只有明確設(shè)計(jì)網(wǎng)頁(yè)的目的，我們才能有一個(gè)明確的目標(biāo)。

　　下面將總結(jié)設(shè)計(jì)網(wǎng)頁(yè)的幾個(gè)目的。我們明白了設(shè)計(jì)網(wǎng)站的目的之后，就可以進(jìn)行部署、規(guī)劃、原型化，交給UI設(shè)計(jì)，然后進(jìn)行網(wǎng)站的重構(gòu)和部署，一步一步的完成我們需要的網(wǎng)站。

　　2.以網(wǎng)頁(yè)設(shè)計(jì)為目的的——網(wǎng)頁(yè)是產(chǎn)品的重要入口

　　這是最常見(jiàn)的。網(wǎng)站是我們的產(chǎn)品，或者訪問(wèn)網(wǎng)站意味著用戶正在使用我們的產(chǎn)品。

　　比如：airbnb，淘寶，騰訊視頻，各大門(mén)戶。用戶訪問(wèn)airbnb時(shí)，想查詢住宿情況；用戶訪問(wèn)淘寶，想購(gòu)物；用戶訪問(wèn)騰訊視頻是想看視頻，用戶訪問(wèn)門(mén)戶網(wǎng)站是想看新聞。

　　Airbnb:用戶直接進(jìn)入業(yè)務(wù)流程

　　對(duì)于這種目的的頁(yè)面設(shè)計(jì)沒(méi)有一般的原則，也不需要按照任何方法進(jìn)行設(shè)計(jì)。在這種情況下，我們需要做的是將網(wǎng)頁(yè)設(shè)計(jì)與業(yè)務(wù)邏輯完全結(jié)合起來(lái)，讓網(wǎng)頁(yè)設(shè)計(jì)服務(wù)于業(yè)務(wù)流程，為用戶提供最直接、最方便、最流暢的產(chǎn)品體驗(yàn)。

　　3.網(wǎng)頁(yè)設(shè)計(jì)的目的是——推廣企業(yè)品牌

　　有時(shí)候，網(wǎng)頁(yè)不是我們展示產(chǎn)品的方式。尤其是大公司，產(chǎn)品種類(lèi)繁多，各有網(wǎng)站。而貴公司的網(wǎng)站，這是不需要推廣產(chǎn)品或者開(kāi)展推廣活動(dòng)的。這個(gè)時(shí)候用官網(wǎng)做品牌推廣最合適。所以在頁(yè)面設(shè)計(jì)的過(guò)程中，要充分了解公司的定位和追求，把公司的思路和想法融入到網(wǎng)頁(yè)設(shè)計(jì)中。

　　以騰訊官網(wǎng)為例。在官網(wǎng)首頁(yè)的第一屏，我們可以看到一個(gè)非常醒目的表情：“連接”。我們知道，騰訊的基礎(chǔ)是連接，QQ和微信連接了整個(gè)社交網(wǎng)絡(luò)，每月活躍用戶8-9億，為騰訊建立了強(qiáng)大的連接網(wǎng)絡(luò)。騰訊所有的產(chǎn)品和服務(wù)只有兩個(gè)關(guān)鍵詞，即“連接”和“內(nèi)容”。

　　騰訊官網(wǎng)首頁(yè)和第一屏：“連接”

　　4.——以網(wǎng)頁(yè)設(shè)計(jì)為目的的促銷(xiāo)產(chǎn)品

　　對(duì)于我們自己的互聯(lián)網(wǎng)產(chǎn)品，產(chǎn)品解決了哪些痛點(diǎn)，與競(jìng)爭(zhēng)產(chǎn)品相比有什么優(yōu)勢(shì)，我們的產(chǎn)品有什么特點(diǎn)？通過(guò)網(wǎng)頁(yè)告訴用戶才是最合適的。

　　那么為了這個(gè)目的，我們應(yīng)該如何設(shè)計(jì)一個(gè)網(wǎng)頁(yè)呢？一般來(lái)說(shuō)，這樣的網(wǎng)頁(yè)將采用模塊化的方法。這些模塊包括：產(chǎn)品特點(diǎn)、產(chǎn)品優(yōu)勢(shì)、產(chǎn)品定價(jià)、產(chǎn)品獲取方式、產(chǎn)品使用方式、產(chǎn)品用戶、產(chǎn)品合作經(jīng)典案例、合作客戶評(píng)價(jià)。從以上模塊中，產(chǎn)品經(jīng)理可以選擇他的產(chǎn)品最想突出的4 ~ 5個(gè)模塊，仔細(xì)設(shè)計(jì)每個(gè)模塊的內(nèi)容，將模塊組合在一起。

　　以最濕網(wǎng)站的一個(gè)產(chǎn)品頁(yè)面(遠(yuǎn)程調(diào)試)為例。在第一個(gè)屏幕上，我們可以看到橫幅突出了產(chǎn)品名稱和產(chǎn)品描述，并在引導(dǎo)用戶時(shí)配備了一個(gè)大按鈕。接下來(lái)是產(chǎn)品功能描述，是產(chǎn)品介紹頁(yè)面必不可少的模塊。其他模塊的介紹和選擇，請(qǐng)參考后面“實(shí)踐經(jīng)驗(yàn)6”中的圖片。

　　最濕：經(jīng)典產(chǎn)品介紹頁(yè)

　　5.——用于網(wǎng)頁(yè)設(shè)計(jì)的演示數(shù)據(jù)

　　這樣的頁(yè)面是專(zhuān)業(yè)頁(yè)面。

　　專(zhuān)業(yè)頁(yè)面經(jīng)常顯示與業(yè)務(wù)密切相關(guān)的各種數(shù)據(jù)，如DAU、MAU、Crash  rate、ANR報(bào)告等數(shù)據(jù)信息。這些信息需要由負(fù)責(zé)數(shù)據(jù)分析的專(zhuān)業(yè)技術(shù)人員或產(chǎn)品經(jīng)理查看。因此，在設(shè)計(jì)這樣的頁(yè)面時(shí)，應(yīng)該以規(guī)范、整潔、易讀的形式呈現(xiàn)給用戶。

　　需要注意的是，這類(lèi)頁(yè)面不僅需要提供顯示功能，還需要提供查詢功能。由于數(shù)據(jù)量大，往往直接顯示關(guān)鍵數(shù)據(jù)或樣本數(shù)據(jù)，可能需要用戶自己搜索查看的內(nèi)容更多。

　　Bugly:經(jīng)典數(shù)據(jù)顯示頁(yè)面

　　Bugly是騰訊推出的崩潰捕捉和顯示產(chǎn)品。頁(yè)面設(shè)計(jì)是典型的數(shù)據(jù)顯示類(lèi)型。從上圖數(shù)據(jù)顯示的頁(yè)面中，我們可以清楚地看到，頁(yè)面設(shè)計(jì)采用了扁平化、模塊化的布局，使得整個(gè)頁(yè)面的布局規(guī)則清晰。另外，在左側(cè)、上側(cè)和中上部，采用TAB切換顯示方式，使得數(shù)據(jù)顯示更有條理。

　　6.——，網(wǎng)頁(yè)設(shè)計(jì)的目的，引導(dǎo)用戶下載app

　　當(dāng)我們的產(chǎn)品是移動(dòng)產(chǎn)品時(shí)，apk類(lèi)型的安卓或iOS移動(dòng)應(yīng)用。引導(dǎo)用戶下載我們的產(chǎn)品是大多數(shù)產(chǎn)品經(jīng)理的KPI。這時(shí)候自然要充分利用我們的網(wǎng)站來(lái)引導(dǎo)用戶下載我們的手機(jī)產(chǎn)品。

　　優(yōu)步：右下角醒目的“下載APP”

　　對(duì)于這類(lèi)經(jīng)典案例，我們來(lái)看看優(yōu)步官網(wǎng)。優(yōu)步的產(chǎn)品形式是移動(dòng)客戶端。所以優(yōu)步官網(wǎng)是用來(lái)引導(dǎo)用戶下載客戶端的，可以說(shuō)是完美的。所以在官網(wǎng)首頁(yè)的第一屏，設(shè)計(jì)師在Banner上放了一個(gè)大提示，引導(dǎo)用戶下載客戶端。

　　7.以網(wǎng)頁(yè)設(shè)計(jì)為目的的——商業(yè)推廣急需賺錢(qián)

　　有時(shí)，當(dāng)產(chǎn)品已經(jīng)建立時(shí)，收入流成為產(chǎn)品經(jīng)理的重要關(guān)鍵績(jī)效指標(biāo)。官網(wǎng)作為用戶接觸我們產(chǎn)品最直接的方式，可以配合運(yùn)營(yíng)推廣活動(dòng)，吸引用戶購(gòu)買(mǎi)產(chǎn)品。此時(shí)，在網(wǎng)頁(yè)設(shè)計(jì)過(guò)程中，如何將營(yíng)銷(xiāo)內(nèi)容展示在顯眼的位置，讓用戶更容易購(gòu)買(mǎi)產(chǎn)品，是我們的設(shè)計(jì)重點(diǎn)。

　　騰訊云：首頁(yè)橫幅內(nèi)容，典型營(yíng)銷(xiāo)推廣

　　以騰訊云為例：騰訊云作為國(guó)內(nèi)提供云產(chǎn)品的幾家實(shí)力雄厚的公司之一，在與阿里巴巴云、華為云等產(chǎn)品正常業(yè)務(wù)時(shí)，需要提升份額。所以官網(wǎng)作為用戶最容易進(jìn)入的入口，直接展示了大量的營(yíng)銷(xiāo)內(nèi)容，也體現(xiàn)了其助推收益的目的。