2014-02-08 分類(lèi): 網(wǎng)站建設(shè)
編者按:創(chuàng)新互聯(lián)科技提供了不少各種網(wǎng)站和 UI設(shè)計(jì)的風(fēng)格和方式,雖然很多 UI元素的設(shè)計(jì)并不復(fù)雜,但是許多細(xì)節(jié)都值得注意。今天的文章幫你梳理了如今流行的網(wǎng)站大型頁(yè)腳的設(shè)計(jì)技巧和注意事項(xiàng),還是挺實(shí)用的。
雖然網(wǎng)頁(yè)頁(yè)腳的設(shè)計(jì)在整個(gè)頁(yè)面設(shè)計(jì)中并非最引人矚目的部分,在需求中的優(yōu)先級(jí)也不高,也不是整個(gè)網(wǎng)站設(shè)計(jì)的核心,但是它依然是整個(gè)網(wǎng)站不可或缺的部分。
一個(gè)好的網(wǎng)站頁(yè)腳能夠讓用戶(hù)找到有用的信息,更好地互動(dòng)感。想要設(shè)計(jì)一個(gè)功能完善,美觀的網(wǎng)站頁(yè)腳,有什么可供遵循的方法和技巧呢?今天的文章就來(lái)給你答案。
大型頁(yè)腳的設(shè)計(jì)訣竅在于信息的組織。一旦明確了頁(yè)腳需要幫用戶(hù)實(shí)現(xiàn)什么目標(biāo),接下來(lái)的事情就不難了。下面創(chuàng)新互聯(lián)分享7個(gè)技巧。
1. 確定一個(gè)明確的目標(biāo)
在為網(wǎng)站設(shè)計(jì)一個(gè)大型頁(yè)腳的時(shí)候,先要明確用戶(hù)在實(shí)際狀況下如何使用它。
盡管有許多網(wǎng)站將頁(yè)腳當(dāng)作收納不知道怎么處理的鏈接和信息的地方,但是實(shí)際上頁(yè)腳的功能并不是垃圾箱。
和網(wǎng)站其他的部分一樣,設(shè)計(jì)優(yōu)良的頁(yè)腳是有著明確的設(shè)計(jì)目標(biāo)的:
*提供網(wǎng)站地圖,以及最受歡迎的頁(yè)面/鏈接
*提供聯(lián)系方式,或者提交訂閱的表單
*提供社交媒體帳號(hào)鏈接和信息
*提供行為召喚的功能
*提供公司或者店鋪的實(shí)際地址/可視化地圖
*網(wǎng)站和團(tuán)隊(duì)相關(guān)的信息(適合博客類(lèi)網(wǎng)站)
2. 具備響應(yīng)式設(shè)計(jì)
響應(yīng)式設(shè)計(jì)毫無(wú)疑問(wèn)是如今網(wǎng)站應(yīng)當(dāng)具備的基礎(chǔ)素質(zhì),而大型的網(wǎng)站頁(yè)腳同樣也應(yīng)該具備良好的響應(yīng)性,這樣才能確保體驗(yàn)上的一致,并且讓用戶(hù)能夠便捷輕松地與之互動(dòng)。
一個(gè)大型的頁(yè)腳,在桌面端上展示的時(shí)候,信息按列來(lái)分割排布,看起來(lái)是很合理的,但在移動(dòng)端設(shè)備上,就顯得凌亂而復(fù)雜了。尤其是考慮到頁(yè)腳需要隨著頁(yè)面變化而響應(yīng),并且要便于交互。
整個(gè)頁(yè)腳的主要設(shè)計(jì)目標(biāo)是包含并組織大量的元素,而這種形式并不一定拘泥于多欄式布局。
3. 包含用戶(hù)期望的信息
絕大多數(shù)的用戶(hù)對(duì)于網(wǎng)頁(yè)頁(yè)腳中所呈現(xiàn)的信息,是有所期待的,將用戶(hù)期望的信息包含在其中,可以讓它的可用性更強(qiáng)。雖然并非所有的元素都需要包含在網(wǎng)頁(yè)頁(yè)腳當(dāng)中,但是下面所列舉出來(lái)的元素,應(yīng)該覆蓋了絕大多數(shù)的用戶(hù)需求:
* 網(wǎng)站地圖或者拓展導(dǎo)航
*聯(lián)系信息,地址或者地圖
*社交媒體鏈接
*搜索
*在線留言
還有一些其他的小元素或者功能控件可以放到其中,但是用戶(hù)并非需要全部的元素,他們所需要的通常是其中的一部分,絕大多數(shù)是關(guān)于網(wǎng)站本身的一些信息。
* 版權(quán)信息
* 法律信息和隱私條款
* 專(zhuān)業(yè)領(lǐng)域或者所屬組織
4. 組織鏈接
包含大量的、不同的內(nèi)容的網(wǎng)站,應(yīng)該考慮將大量的鏈接按照類(lèi)別來(lái)進(jìn)行分組管理,通過(guò)有組織的鏈接,你可以幫助用戶(hù)找到他們想要的相關(guān)的內(nèi)容。對(duì)于大型的項(xiàng)目而言,這是一種非常常見(jiàn)的技術(shù),對(duì)于用戶(hù)而言,可能會(huì)非常有用。
在上面的稻城亞丁的網(wǎng)頁(yè)中,頁(yè)腳就包含了多層次的頁(yè)腳導(dǎo)航。其中包含了熱門(mén)的分類(lèi)(友情鏈接、子品牌微信二維碼),然后是客戶(hù)服務(wù)的鏈接組(如果你需要額外的服務(wù)),以及相關(guān)的資源,公司的責(zé)任和其他的行為召喚元素。最后,頁(yè)腳中還包含了其他相關(guān)品牌的鏈接,版權(quán)信息和協(xié)議條款。
頁(yè)腳是網(wǎng)站功能的一種補(bǔ)充和完善,尤其是對(duì)于大型的網(wǎng)站項(xiàng)目而言,頁(yè)腳的信息組織是尤其重要的。
5. 維持品牌的調(diào)性
不要事后再考慮頁(yè)腳中的微文案。頁(yè)頭中的品牌設(shè)計(jì)和頁(yè)腳中的品牌調(diào)性是同樣重要的。
風(fēng)格和調(diào)性上,頁(yè)腳同樣是網(wǎng)站的品牌設(shè)計(jì)中不可分割的一部分,在視覺(jué)上沿用網(wǎng)站的配色,在視覺(jué)元素和品牌化上,同樣不能失去應(yīng)有的調(diào)性。只有這樣,用戶(hù)才不會(huì)在瀏覽頁(yè)腳的時(shí)候感到迷惑。
頁(yè)腳的元素和元素之間留有足夠多的空間,確保整體的舒適感。
6. 足夠的留白
緊密的文本是用戶(hù)瀏覽和交互的大敵,保持足夠的呼吸感,不僅能夠確保視覺(jué)上的舒適,而且在功能上也有保障,用戶(hù)交互也更加方便。
空間排版布局的規(guī)則,同樣適用于頁(yè)腳的布局設(shè)計(jì),千萬(wàn)不要覺(jué)得它只是裝飾性的,并不是「能看就行」。
如果頁(yè)腳的設(shè)計(jì)可用性差,就不好了。你可以借助圖標(biāo)等方式來(lái)確定用戶(hù)對(duì)于各個(gè)模塊的點(diǎn)擊率和效果,在此基礎(chǔ)上來(lái)進(jìn)行優(yōu)化。
7. 保持對(duì)比度
需要保有足夠功能性的頁(yè)腳,應(yīng)當(dāng)確保它們能和上方的內(nèi)容之間構(gòu)成對(duì)比,從而形成視覺(jué)上的差異,脫穎而出。頁(yè)腳應(yīng)當(dāng)是整個(gè)設(shè)計(jì)當(dāng)中的一部分,同時(shí)也應(yīng)當(dāng)具備足夠視覺(jué)差異性,便于用戶(hù)理解它的功能和存在。
在視覺(jué)上建立這種對(duì)比,最常用的方法是將頁(yè)腳至于特定的 UI容器當(dāng)中,比如彩色的區(qū)塊或者框當(dāng)中,通過(guò)背景色彩和上方的內(nèi)容進(jìn)行區(qū)別。許多以淺色背景的網(wǎng)站,會(huì)在頁(yè)腳的部位采用深色的背景。
這種額外的視覺(jué)對(duì)比的功能性是很明顯的,用戶(hù)會(huì)在看到頁(yè)腳的時(shí)候因?yàn)椴町惗⒁獾讲⑺伎计涔δ埽亲銐驈?qiáng)大的視覺(jué)線索,并且在整個(gè)設(shè)計(jì)中創(chuàng)造出方向感和可用性。
結(jié)語(yǔ)
雖然越來(lái)越多的設(shè)計(jì)師開(kāi)始設(shè)計(jì)超大型的頁(yè)腳,并且許多設(shè)計(jì)都做得相當(dāng)?shù)捏@艷,但是頁(yè)腳的設(shè)計(jì)應(yīng)當(dāng)是有限制的,至少那些太長(zhǎng)、需要翻頁(yè)的頁(yè)腳就相當(dāng)?shù)牧钊擞憛挕?/p>
雖然頁(yè)腳是承載大量信息,用來(lái)作為用戶(hù)最后獲取信息的地方,但是它也應(yīng)該具備一目了然的特點(diǎn),確保可用性、易用性和舒適性。
網(wǎng)站標(biāo)題:即使是最靠下的網(wǎng)站頁(yè)腳,設(shè)計(jì)上同樣很講究
網(wǎng)頁(yè)路徑:http://m.newbst.com/news35/18835.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供手機(jī)網(wǎng)站建設(shè)、服務(wù)器托管、網(wǎng)站設(shè)計(jì)公司、面包屑導(dǎo)航、用戶(hù)體驗(yàn)、定制開(kāi)發(fā)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容