網(wǎng)站設(shè)計(jì)中的角落導(dǎo)航應(yīng)用
角落導(dǎo)航已經(jīng)出現(xiàn)一段時(shí)間了,在網(wǎng)站設(shè)計(jì)中這是一個(gè)不錯(cuò)的設(shè)計(jì)趨勢(shì),已出現(xiàn)的流行周邊導(dǎo)航。然而,與它的傳統(tǒng)導(dǎo)航不同的是,它看起來不那么龐大,它更優(yōu)雅,給了內(nèi)容更多的空間。
它非常適合今天的主畫面,用來提升良好的第一印象。它占據(jù)了個(gè)角落區(qū)域,最大限度地降低了其它內(nèi)容產(chǎn)生沖突的風(fēng)險(xiǎn)。盡管如此,它還是為用戶提供了一個(gè)快速導(dǎo)航的方法,讓他們可以方便離開或繼續(xù)探索網(wǎng)站的內(nèi)部世界。
這個(gè)解決方案非常靈活,它沒有任何限制或偏好,它有各種款式和組合的設(shè)計(jì)。您可以混合和匹配多個(gè)完整的導(dǎo)航組件,巧妙地在屏幕上分布它們,我們來看看這些美妙的作品來獲得靈感吧。
Alpha Blue Ocean
正如適合所有的現(xiàn)代主畫面,Alpha Blue Ocean的歡迎畫面也包括一個(gè)動(dòng)態(tài)的部分,雖然導(dǎo)航在這里應(yīng)該是次要的角色,但是它由于大量的白色空間和白色與深藍(lán)色背景之間的完美對(duì)比而脫穎而出,讓它非常的引人注目。
注意,乍一看,它似乎只占據(jù)角落。然而,由于文字和象形文字的微妙外觀,他們?cè)O(shè)法占據(jù)左右兩邊,并沒有壓倒用戶。因此,左側(cè)顯示主頁導(dǎo)航,而右側(cè)包含標(biāo)識(shí)、漢堡導(dǎo)航和社交媒體包。
Playermaker
組織進(jìn)攻的隊(duì)員們也利用邊路的優(yōu)勢(shì),他們已經(jīng)為他們令人印象深刻的照片背景贏得了一些額外的空間。在這里,第一個(gè)屏幕固有的所有元素,如call-to-action、logotype、streamlined導(dǎo)航和到社交媒體配置文件的鏈接,都位于四個(gè)不同的角落。
注意傳統(tǒng)的五項(xiàng)導(dǎo)航的位置,它位于屏幕的左下角。這感覺很不尋常,但鼓舞人心,令人耳目一新。這個(gè)解決方案在不做任何特別的事情的情況下,給了整個(gè)美學(xué)一個(gè)小小的轉(zhuǎn)變,整潔和智能。
Neundlinger
和前面的兩個(gè)例子很像,Neundlinger也使用了角型導(dǎo)航,使主屏幕看起來不那么普通。在這里你可以看到一個(gè)時(shí)髦的垂直節(jié)奏,巧妙地應(yīng)用到左邊的菜單。
滑塊的控制器在陽光下以合適的角度占據(jù)它們的位置,注意,與標(biāo)識(shí)類型匹配的所有導(dǎo)航元素形成一個(gè)區(qū)域。或者,更準(zhǔn)確地說,一個(gè)框架。后者在視覺上邊緣的滑塊,并給它一個(gè)更大的焦點(diǎn)。在這里,角落導(dǎo)航完美地融入了方框風(fēng)格的美學(xué)。
Hot2Be
Hot2Be背后的團(tuán)隊(duì)在沒有做出任何犧牲的情況下改進(jìn)了整個(gè)導(dǎo)航布局,他們使用空白的角落來顯示一些額外的鏈接,他們發(fā)現(xiàn)這些鏈接對(duì)他們的用戶很有用。因此,左下角容納了社交媒體圖標(biāo),而右下角容納了音樂播放器控件,使訪客的存在令人愉快和舒適。
標(biāo)識(shí)符和語言切換器位于它們應(yīng)該的位置,雖然屏幕的上半部分比下半部分感覺更厚重,但還是有一定的和諧感。在這里,導(dǎo)航有效地覆蓋了所有重要的逃生路線,仍然看起來很時(shí)尚。最重要的是,它是不顯眼的。
Wolf and Whale
Wolf and Whale是一個(gè)例子,角落導(dǎo)航與周邊導(dǎo)航的邊界,產(chǎn)生了相當(dāng)令人印象深刻的結(jié)果。它不僅占據(jù)了角落,也占據(jù)了左右兩邊的一些空間,感覺寬敞而自然。
在這里你可以感受到組織的和諧和秩序,似乎每件事都在正確的位置。設(shè)計(jì)干凈、整潔、智能,導(dǎo)航也是如此。它的整潔和光滑使它非常合身,同時(shí),注意那些巧妙放置的焦點(diǎn)。閱讀路徑以"設(shè)計(jì)"開始,然后通過作品的反向鏈接,并以右下角的"調(diào)用-操作"按鈕結(jié)束。
Neal Ymar
Neal Ymar官方網(wǎng)站背后的團(tuán)隊(duì)主要依靠復(fù)雜的四四方方的結(jié)構(gòu),解決方案當(dāng)然是有回報(bào)的。主畫面看起來棒極了。雖然只有原始的正方形和長(zhǎng)方形,但它給人的感覺是精致而精致的。
轉(zhuǎn)角導(dǎo)航和它配合得很好,它結(jié)束了《明星伙伴》,使主題看起來更加完整。有了這一切,它設(shè)法為自己說話,給它的所有元素一種重要的感覺。
Oropress
Oropress是一個(gè)極簡(jiǎn)主義思想的絕佳例子,主畫面非常寬敞、整潔、干凈。團(tuán)隊(duì)只選擇了整體元素。然而,一切并非初看上去那么原始;位于頁面中心的基于視差的標(biāo)語就是一個(gè)證明。
在這里,極簡(jiǎn)主義被提升到了一個(gè)新的高度,扮演了一個(gè)奢侈的角色。僅覆蓋必要的項(xiàng)目,僅占據(jù)三個(gè)角度而不是四個(gè)角度,角落導(dǎo)航符合網(wǎng)站的理念,為整體美學(xué)做出貢獻(xiàn)。
Romain Avalle
Romain Avalle的個(gè)人投資組合是另一個(gè)為業(yè)主帶來利益的最小化方法的例子,與前面的示例非常相似,它也是基于經(jīng)典的黑白配色方案構(gòu)建的,并使用了大量的空白。
在這里,藝術(shù)家名字的首字母作為娛樂元素,給人留下深刻的印象。角落導(dǎo)航只包括兩個(gè)反向鏈接,指向作品的部分和一個(gè)聯(lián)系人頁面,以及一個(gè)徽標(biāo)。它毫無疑問地融合在一起,它似乎是唯一正確的解決方案,因?yàn)樗行У刂С种黝}和加強(qiáng)項(xiàng)目的基調(diào)。
The Corner Office
角落導(dǎo)航在很多情況下都很有用,無論是傳統(tǒng)的網(wǎng)站結(jié)構(gòu)還是現(xiàn)代的網(wǎng)站設(shè)計(jì),都可以很容易地找到改善這種情況的方法,并為一般的體驗(yàn)做出貢獻(xiàn)。
由于其低調(diào)、整潔和優(yōu)雅的外觀,它成為那些主畫面域填充復(fù)雜概念的網(wǎng)站的理想合作伙伴,這些概念的目的是讓一切都與自己有關(guān)。在這樣的環(huán)境下,角落導(dǎo)航自然靠邊站了。然而,它仍然為在線訪問者提供了有用的鏈接和必要的門戶。
想了解更多網(wǎng)站技術(shù)的內(nèi)容,請(qǐng)?jiān)L問:網(wǎng)站技術(shù)