監(jiān)理公司管理系統(tǒng) | 工程企業(yè)管理系統(tǒng) | OA系統(tǒng) | ERP系統(tǒng) | 造價(jià)咨詢(xún)管理系統(tǒng) | 工程設(shè)計(jì)管理系統(tǒng) | 簽約案例 | 購(gòu)買(mǎi)價(jià)格 | 在線(xiàn)試用 | 手機(jī)APP | 產(chǎn)品資料
X 關(guān)閉

如何設(shè)計(jì)網(wǎng)站首頁(yè)？？設(shè)計(jì)需知。

申請(qǐng)免費(fèi)試用、咨詢(xún)電話(huà)：400-8352-114

 

楊科宇曾發(fā)表過(guò)一篇文章《淺析網(wǎng)頁(yè)界面設(shè)計(jì)——首頁(yè)設(shè)計(jì)》，文中為我們分享了如何進(jìn)行首頁(yè)的界面設(shè)計(jì)?，F(xiàn)轉(zhuǎn)載于此，供大家借鑒學(xué)習(xí)。全文如下：

首頁(yè)設(shè)計(jì)，需開(kāi)宗明義突出主題

開(kāi)宗明義，無(wú)論是對(duì)于一篇文章、一場(chǎng)會(huì)議或一部專(zhuān)題片，還是對(duì)于一個(gè)網(wǎng)站來(lái)說(shuō)，都是必不可少的。那么能為一個(gè)網(wǎng)站開(kāi)宗明義的地方（標(biāo)簽）就是Title（標(biāo)題）和Description（描述、副標(biāo)題），而能夠?yàn)門(mén)itle和Description提供進(jìn)一步詮釋的就是網(wǎng)站的首頁(yè)。

展示哪些信息

頁(yè)面的重要性是建立在它所呈現(xiàn)信息的基礎(chǔ)之上，反過(guò)來(lái)說(shuō)，頁(yè)面要向用戶(hù)展示哪些信息是決定其重要與否的首要指標(biāo)。在網(wǎng)站頁(yè)面中，網(wǎng)站標(biāo)題、副標(biāo)題、菜單（狹義上的導(dǎo)航，請(qǐng)參看《WEB導(dǎo)航設(shè)計(jì)》）、用戶(hù)登錄信息、關(guān)于、版權(quán)信息這幾項(xiàng)是網(wǎng)站的基礎(chǔ)信息，是一個(gè)網(wǎng)站身份的象征，承載著向用戶(hù)表明網(wǎng)站立場(chǎng)、提供何種產(chǎn)品或勞務(wù)、網(wǎng)站自我介紹、如何聯(lián)系網(wǎng)站的重要使命，在設(shè)計(jì)頁(yè)面時(shí)，這些信息必不可少。

而網(wǎng)站的首頁(yè)，除了需要顯示以上這些基礎(chǔ)信息之外，最重要的是還承擔(dān)著網(wǎng)站轉(zhuǎn)化率的重任，這也是所有類(lèi)型的網(wǎng)站首頁(yè)的最重要任務(wù)。如何讓網(wǎng)站首頁(yè)完成這項(xiàng)重要的任務(wù)呢？我的理解是把網(wǎng)站所提供的產(chǎn)品或勞務(wù)通過(guò)版式設(shè)計(jì)、文案設(shè)計(jì)、色彩設(shè)計(jì)之后，展示在首頁(yè)適當(dāng)?shù)奈恢?，并使其不受其它信息元素干擾，甚至使其它元素為它（產(chǎn)品或勞務(wù)）服務(wù)。

突出主題思想

知道了首頁(yè)需要展示哪些信息，知道了信息之間的權(quán)重，如何把信息呈現(xiàn)得更符合信息本身，卻不是一件容易的事，需要時(shí)間的磨練與經(jīng)驗(yàn)的積累。就設(shè)計(jì)本身而言，是一件感性的事，不像數(shù)學(xué)公式，它缺乏嚴(yán)謹(jǐn)?shù)睦碚撟鰹橹笇?dǎo)，所以在工作中，經(jīng)常出現(xiàn)與Boss、同事意見(jiàn)相左的情況。我個(gè)人的經(jīng)驗(yàn)是在非重要信息的設(shè)計(jì)上使其具有普適性，在重要信息的設(shè)計(jì)上突出設(shè)計(jì)的主題思想，在與Boss、同事討論時(shí)，盡量把討論的重點(diǎn)放在主題思想的呈現(xiàn)方式與其對(duì)轉(zhuǎn)化率（或市場(chǎng)目標(biāo)）的作用之上。你可以說(shuō)這是功利的設(shè)計(jì)，沒(méi)錯(cuò)，所有的設(shè)計(jì)都是以商業(yè)利潤(rùn)為最終目的。

如何突出

在版式設(shè)計(jì)上，要求把信息分門(mén)別類(lèi)，讓用戶(hù)在掃描（只為掃描而設(shè)計(jì)，請(qǐng)參考《Don’t Make Me Think》）頁(yè)面時(shí)保證視覺(jué)流的流暢性，在短時(shí)間內(nèi)（3-5秒）發(fā)現(xiàn)首頁(yè)包函哪些區(qū)域（如菜單、廣告、注冊(cè)、個(gè)人信息、鏈接、按鈕等），方便用戶(hù)在第一時(shí)間內(nèi)做出選擇。在設(shè)計(jì)過(guò)程中，建議嚴(yán)格遵循四個(gè)排版的原則，即：對(duì)比、對(duì)齊、重復(fù)和親密性（請(qǐng)參看《寫(xiě)給大家看的設(shè)計(jì)書(shū)》)。如yahoo.com、renren.com、cnet.com的首頁(yè)設(shè)計(jì)。

在文案設(shè)計(jì)上，副標(biāo)題的文案設(shè)計(jì)，要求文案簡(jiǎn)潔明了、開(kāi)宗明義，語(yǔ)言、句式的表達(dá)需符合網(wǎng)站的整體調(diào)性。如人人網(wǎng)的“因?yàn)檎鎸?shí)，所以精彩”，阿里巴巴的“全求最大的采購(gòu)批發(fā)市場(chǎng)”，babytree.com的“愛(ài)、交流、成長(zhǎng)”等等。在產(chǎn)品或勞務(wù)宣傳的文案設(shè)計(jì)上，要求簡(jiǎn)短、易懂、描述要完整，語(yǔ)言要情感豐富，具有扇動(dòng)性，吸引用戶(hù)注意力，最終促使用戶(hù)付出行動(dòng)，這就達(dá)到了目的（轉(zhuǎn)化率或點(diǎn)擊率）。顯示的要素通常包括誰(shuí)/什么、有多少、何時(shí)、何地、如何做、為什么這六大要素（請(qǐng)參看《餐巾紙的背面》）。如人人網(wǎng)、開(kāi)心網(wǎng)首頁(yè)的主題表現(xiàn)形式。這些應(yīng)該是文案設(shè)計(jì)的工作，但現(xiàn)狀是Boss不會(huì)專(zhuān)門(mén)聘用Copywriter，網(wǎng)頁(yè)中的文案一般都是由交互設(shè)計(jì)師來(lái)完成，而小公司是由美工來(lái)完成。所以，了解一些文案設(shè)計(jì)知識(shí)是很有必要的。

在色彩的設(shè)計(jì)上，即要符合網(wǎng)站整體特征，又要適合所渲染信息的特征。一般采用同色系或相鄰色系對(duì)網(wǎng)站基礎(chǔ)信息進(jìn)行渲染，對(duì)于突現(xiàn)主題的信息采用基礎(chǔ)信息色彩的補(bǔ)色或?qū)Ρ壬M(jìn)行渲染，從視覺(jué)上體現(xiàn)信息的權(quán)重與邏輯關(guān)系，達(dá)到突出重要、弱化次要地目的。

這是什么

西瓜、Thindpad、iPhone、百事可樂(lè)、著名作家、二戰(zhàn)。當(dāng)你看到這些名詞時(shí)，腦海里不由的浮現(xiàn)出它們的特征。比如你看到“著名作家”時(shí)，可能想到了魯迅，而英國(guó)人看到“著名作家”時(shí)，很可能想到的是莎士比亞；再比如看到“二戰(zhàn)”這個(gè)名詞，你可能想到了“狗日的”，而猶太人想到的可能是“希特勒”。這與用戶(hù)的知識(shí)背景有很大的關(guān)系。在進(jìn)行網(wǎng)站頁(yè)面設(shè)計(jì)時(shí)，用戶(hù)知識(shí)背景也必須考慮其中，我曾見(jiàn)過(guò)一領(lǐng)導(dǎo)在與同事們討論頁(yè)面設(shè)計(jì)時(shí)，在白板上畫(huà)分類(lèi)列表，一直是把它畫(huà)在左側(cè)，并以列表式呈現(xiàn)。這個(gè)現(xiàn)象足以說(shuō)明，他所接觸到的分類(lèi)列表可能多數(shù)呈現(xiàn)在頁(yè)面左側(cè)，所以他無(wú)意識(shí)的也認(rèn)為分類(lèi)列表應(yīng)該在左側(cè)，換句話(huà)說(shuō)，放在右側(cè)或其它地方，就不是分類(lèi)列表了?；蛟S我定義得有些極端，但這個(gè)現(xiàn)象確實(shí)能反應(yīng)出知識(shí)背景對(duì)用戶(hù)習(xí)慣的影響是不可估量的。

所以，在設(shè)計(jì)時(shí)，網(wǎng)頁(yè)界面應(yīng)該設(shè)計(jì)得要像網(wǎng)頁(yè)界面，軟件界面設(shè)計(jì)得要像軟件界面，游戲界面設(shè)計(jì)得要像游戲界面，廣告設(shè)計(jì)的要像廣告。千萬(wàn)不要為了得到視覺(jué)上的創(chuàng)新，把界面設(shè)計(jì)成了四不像?；蛟S這種觀點(diǎn)顯得過(guò)于保守，但有利于把風(fēng)險(xiǎn)降到最低。其實(shí)網(wǎng)站最吸引用戶(hù)的地方是內(nèi)容的質(zhì)量，而并不是花哨、絢麗的視覺(jué)設(shè)計(jì)。視覺(jué)設(shè)計(jì)的主要目的在于采用合適的視覺(jué)元素表現(xiàn)出內(nèi)容的權(quán)重與邏輯，屬于配角。在小品《我是主角》中，也很明確的突出了配角與主角應(yīng)該各自扮演好自已的角色，作為配角的視覺(jué)設(shè)計(jì)不能搶了主角（內(nèi)容）的戲。

不要紙上談兵

趙括紙上談兵害人害已。理論是可以通過(guò)學(xué)習(xí)得到，而經(jīng)驗(yàn)只能在實(shí)踐中獲取。眼下最近正參與一個(gè)項(xiàng)目的策劃，打算以它為標(biāo)本，對(duì)網(wǎng)頁(yè)界面設(shè)計(jì)相關(guān)的事項(xiàng)做進(jìn)一步的討論。




發(fā)布：2007-04-16 17:22    編輯：泛普軟件 · xiaona    [打印此頁(yè)]    [關(guān)閉]

泛普入庫(kù)出庫(kù)管理軟件其他應(yīng)用

藥品進(jìn)銷(xiāo)存管理系統(tǒng) 醫(yī)藥進(jìn)銷(xiāo)存 超市進(jìn)銷(xiāo)存管理系統(tǒng) 服裝進(jìn)銷(xiāo)存軟件 倉(cāng)庫(kù)進(jìn)銷(xiāo)存管理軟件 進(jìn)銷(xiāo)存財(cái)務(wù)軟件 傻瓜進(jìn)銷(xiāo)存 萬(wàn)能進(jìn)銷(xiāo)存軟件 進(jìn)銷(xiāo)存網(wǎng)絡(luò)版 進(jìn)銷(xiāo)存管理系統(tǒng) 進(jìn)銷(xiāo)存系統(tǒng) 服裝庫(kù)存管理軟件 條碼倉(cāng)庫(kù)管理軟件 庫(kù)存管理軟件 倉(cāng)庫(kù)管理軟件 庫(kù)房管理軟件 出入庫(kù)管理軟件 倉(cāng)儲(chǔ)管理系統(tǒng) 倉(cāng)庫(kù)管理系統(tǒng) 庫(kù)存管理系統(tǒng) 入庫(kù)出庫(kù)管理軟件 進(jìn)銷(xiāo)存軟件排名 倉(cāng)庫(kù)管理軟件哪個(gè)好