在人與人的交往中，第一印象很重要。雖然第一印象并不一定正確，但卻是鮮明、牢固的，直接影響著雙方以后溝通交流的過程。網(wǎng)頁設(shè)計(jì)中也是一樣，而首屏就是網(wǎng)站留給訪客的第一印象，漂亮精致的首屏設(shè)計(jì)能讓用戶停留更長(zhǎng)時(shí)間，讓他們有意愿更深層次的了解網(wǎng)站內(nèi)容，這有助于提高用戶轉(zhuǎn)化率，增加產(chǎn)品銷量;而糟糕的首屏設(shè)計(jì)則會(huì)讓有用的信息大打折扣，讓有趣的內(nèi)容索然無味，訪客甚至?xí)虼酥苯臃艞墳g覽。首屏設(shè)計(jì)的重要性不言而喻，那么在今天這個(gè)競(jìng)爭(zhēng)激烈的網(wǎng)絡(luò)世界中，怎樣才能充分發(fā)揮首屏設(shè)計(jì)的積極作用呢?今天小飛就帶大家了解一下網(wǎng)站的首屏設(shè)計(jì)，首屏設(shè)計(jì)中可以包括哪些元素。
為什么首屏設(shè)計(jì)很重要?
為什么首屏設(shè)計(jì)對(duì)于網(wǎng)頁很重要?除了上面我們提及的一些優(yōu)點(diǎn)以外，這還要從用戶的瀏覽模式來分析。Nielsen Norman團(tuán)隊(duì)重點(diǎn)研究分析用戶行為以及用戶與網(wǎng)站內(nèi)容互動(dòng)的實(shí)現(xiàn)途徑，在不斷的探究之后得出了一些結(jié)論：當(dāng)人們?cè)L問某個(gè)網(wǎng)站時(shí)，尤其是初次訪問時(shí)，他們通常不會(huì)仔細(xì)瀏覽所有內(nèi)容，而是會(huì)快速的掃視，看是否有值得關(guān)注的點(diǎn)。如果存在感興趣的內(nèi)容，他們才會(huì)繼續(xù)留在這個(gè)網(wǎng)站。
其實(shí)無論用戶遵循哪種瀏覽模式，他們通常都會(huì)優(yōu)先掃視頁面頂部的水平區(qū)域。因此在頁面頂部顯示關(guān)鍵的信息最能同時(shí)滿足網(wǎng)站和用戶雙方的訴求：網(wǎng)站可以充分激發(fā)用戶的興趣、維系顧客;而訪客能夠快速獲取重要信息，決定是否繼續(xù)瀏覽。這就是為什么UI和UX設(shè)計(jì)師甚至內(nèi)容策略專家和營(yíng)銷專家都認(rèn)為首屏設(shè)計(jì)十分重要。人們往往會(huì)在短短的幾秒鐘內(nèi)形成對(duì)一個(gè)網(wǎng)站的整體認(rèn)知，第二印象這種東西是不存在的。一個(gè)網(wǎng)站在首屏上必須足夠搶眼才行，不然很容易走向失敗。
一個(gè)網(wǎng)站的首屏可以包含哪些元素?
既然網(wǎng)站的首屏如此重要，那么怎樣才能做好首屏設(shè)計(jì)呢?在介紹首屏設(shè)計(jì)方法和一些實(shí)例之前，小飛先帶大家了解一下首屏中可以包含哪些有意義的布局元素：
基本的品牌標(biāo)識(shí)：Logo、品牌名稱、Slogan、吉祥物、企業(yè)圖片或色彩等
產(chǎn)品或服務(wù)的主題文案
導(dǎo)航菜單選項(xiàng)
重要的社交媒體鏈接
基本聯(lián)系信息(電話、郵箱等)
多語言切換按鈕
搜索框
訂閱按鈕
產(chǎn)品APP 下載或試用版本的鏈接等
雖然小飛列舉了很多可以在首屏中使用的元素，但這并不意味著你應(yīng)該將這些元素全部應(yīng)用在首屏設(shè)計(jì)中。過猶不及，如果你在首屏中呈現(xiàn)過多元素，很容易會(huì)給訪客帶來信息負(fù)載，太多的元素也會(huì)分散用戶的注意力，使他們難以集中注意力關(guān)注網(wǎng)站中最重要的元素。因此，網(wǎng)站的首屏設(shè)計(jì)需要設(shè)計(jì)師和營(yíng)銷人員通力合作，哪些需要選用，哪些應(yīng)該刪除，做出戰(zhàn)略性的合理的安排。也許你覺得這樣的說法還是太過于空洞了，那就看看下面這兩個(gè)栗子，這兩個(gè)不同類型的網(wǎng)站在首屏上使用了不同的設(shè)計(jì)策略，快來找些靈感吧!
Bjorn是一個(gè)室內(nèi)設(shè)計(jì)網(wǎng)站。首屏的頂欄由Logo和導(dǎo)航菜單(Product、Studio、Press、Shop)組成，而其中shop這個(gè)菜單項(xiàng)則制作成了CTA按鈕，更容易引起用戶點(diǎn)擊的興趣。而且就算主頁面不斷滑動(dòng)，頂欄都會(huì)一直出現(xiàn)在網(wǎng)頁頂部，方便訪客進(jìn)行跳轉(zhuǎn)。除此以外，網(wǎng)站的首屏中還有大段的文本，不過設(shè)計(jì)師充分利用了留白，將Logo、導(dǎo)航和文案很好的區(qū)分開來，讓整個(gè)頁面顯得整潔、大方。
Event Agency網(wǎng)站是另外一個(gè)范例，它在首屏使用的設(shè)計(jì)方法要更加特別一點(diǎn)。這個(gè)網(wǎng)站的首屏主要是圍繞著Logo和品牌名稱設(shè)計(jì)，布局左右平衡，各有兩個(gè)菜單項(xiàng)供訪客快速瀏覽自己感興趣的內(nèi)容。更引人注目的還要數(shù)星河的背景圖片和超大字體文本的配合，在第一時(shí)間帶來了令人震撼的視覺效果。
全國(guó)熱線：0512-65622224 
咨詢我們
蘇公網(wǎng)安備32050602013336
公司新聞
微信/小程序
建站知識(shí)
網(wǎng)站優(yōu)化
app開發(fā)知識(shí)
當(dāng)前位置：
