歡迎來(lái)到合肥浪訊網(wǎng)絡(luò)科技有限公司官網(wǎng)
  咨詢服務(wù)熱線:400-099-8848

2015年,網(wǎng)站設(shè)計(jì)十大趨勢(shì)

發(fā)布時(shí)間:2015-01-05 文章來(lái)源:  瀏覽次數(shù):2708

每年,網(wǎng)站設(shè)計(jì)都在快速提高,天天幾乎都有新的設(shè)計(jì)泛起。我可以想象得到,2015年將泛起最好的網(wǎng)站,包括2014年已經(jīng)猜測(cè)到的很多趨勢(shì)。跟著這些趨勢(shì)在2015年左右實(shí)現(xiàn),現(xiàn)在該是時(shí)候讓我們猜測(cè)2015年可能泛起的新趨勢(shì)了。每個(gè)人都在反思2014年,并瞻望2015年,下面就讓我們看看2015年可能泛起的網(wǎng)站設(shè)計(jì)趨勢(shì)。




▲動(dòng)彈翻頁(yè)更流行


 


今天泛起的大多數(shù)新網(wǎng)站傾向于更長(zhǎng)的頁(yè)面,并通過(guò)動(dòng)彈方式翻頁(yè)。跟著移動(dòng)設(shè)備越來(lái)越受歡迎,以動(dòng)彈方式瀏覽顯示器上的內(nèi)容變得越來(lái)越常見(jiàn),正代替點(diǎn)擊方式,特別是在設(shè)備的主頁(yè)面上。對(duì)于用戶來(lái)說(shuō),以動(dòng)彈翻頁(yè)的方式獲得信息顯然比不斷地點(diǎn)擊按鈕更簡(jiǎn)樸。


主頁(yè)并非動(dòng)彈翻頁(yè)越來(lái)越流行的獨(dú)一地方。跟著超長(zhǎng)動(dòng)彈網(wǎng)站(即一頁(yè)式網(wǎng)站)日益變得熱點(diǎn),動(dòng)彈帶來(lái)的好處也更多,除主頁(yè)面外的其他很多地方也開(kāi)始泛起這種模式,好比有關(guān)網(wǎng)頁(yè)以及產(chǎn)品網(wǎng)頁(yè)等,它們都已成為展示各種內(nèi)容的簡(jiǎn)樸顯示方式。好比,蘋果iPhone 6的動(dòng)彈翻頁(yè)方式已經(jīng)擴(kuò)展到很多地方,可以展示該產(chǎn)品各種特點(diǎn)和機(jī)能。此外,iPhone 6網(wǎng)站也增加了一些流暢的動(dòng)畫,讓動(dòng)彈體驗(yàn)在視覺(jué)上變得更具吸引力。


 



▲講故事+互動(dòng)


 


對(duì)于網(wǎng)站來(lái)說(shuō),擁有令人感到驚異的內(nèi)容老長(zhǎng)短常樞紐,而利用這些內(nèi)容講故事更是一大上風(fēng)。2015年的網(wǎng)站設(shè)計(jì)很可能聚焦于如作甚用戶講故事。好比,Space Needle(美國(guó)西雅圖地標(biāo)建筑太空針?biāo)┑木W(wǎng)站非常漂亮,可以通過(guò)使用講故事的方式先容Space Needle的有關(guān)事實(shí),并以動(dòng)彈翻頁(yè)的設(shè)計(jì)予以支持。Space Needle也證實(shí)2015年的另一種趨勢(shì)——互動(dòng)。網(wǎng)站設(shè)計(jì)正添加更多互動(dòng)和動(dòng)畫元素,以獨(dú)特和有吸引力的方式匡助先容內(nèi)容。在網(wǎng)站設(shè)計(jì)中加入互動(dòng)與動(dòng)畫,可認(rèn)為你的網(wǎng)站帶來(lái)令人驚奇的因素。好比,Impossible Bureau網(wǎng)站的互動(dòng)性就很強(qiáng),可以對(duì)你的動(dòng)彈和懸停做出回應(yīng)。


 



▲大標(biāo)題背景圖像缺失


 


過(guò)去幾年中,網(wǎng)站設(shè)計(jì)中十分流行大標(biāo)題背景圖像,上面常常有文字說(shuō)明,這也是大多數(shù)訪客瀏覽網(wǎng)站時(shí)首先看到的東西。而在大標(biāo)題背景圖像如斯流行的情況下,你的網(wǎng)站如何能脫穎而出呢?采取相反措施。近來(lái)泛起的一些網(wǎng)站逆勢(shì)而行,即沒(méi)有大標(biāo)題背景圖像。我猜,他們這樣做不僅僅是不愿意追隨潮流,而且也在尋求進(jìn)步網(wǎng)站的機(jī)能與速度。New Wave Company的網(wǎng)站就體現(xiàn)出這些特點(diǎn)。它使用大標(biāo)題歡迎訪客,大字體集中在網(wǎng)頁(yè)中央,但標(biāo)題后面沒(méi)有大背景圖片。這是一種高雅的做法,效果并不次于其他使用大背景圖像的流行網(wǎng)站設(shè)計(jì)。


 



▲剔除非必要設(shè)計(jì)元素


 


有一種設(shè)計(jì)觀念以為,當(dāng)所有非必要元素都被剔除后,網(wǎng)站設(shè)計(jì)才算完成。2015年,我以為我們能夠看到這種觀念更好地體現(xiàn)出來(lái),由于更多網(wǎng)站都在試圖通過(guò)剔除非必要設(shè)計(jì)元素實(shí)現(xiàn)網(wǎng)站設(shè)計(jì)的簡(jiǎn)化。New Wave Company網(wǎng)站中剔除大背景圖像的做法就是最好例證之一。另一個(gè)剔除非必要設(shè)計(jì)元素確保網(wǎng)站簡(jiǎn)潔的最佳例證是Rareview Digital Agency網(wǎng)站,它也沒(méi)有使用大背景圖像標(biāo)題問(wèn)候訪客。設(shè)計(jì)師們實(shí)際上已經(jīng)消除了很多當(dāng)前網(wǎng)站上流行的設(shè)計(jì)元素,好比背景顏色、眾多圖片以及復(fù)雜布局等。相反,他們選擇更清楚、簡(jiǎn)潔的網(wǎng)站設(shè)計(jì),在注重設(shè)計(jì)、圖片以及顏色確當(dāng)前網(wǎng)站中,這些設(shè)計(jì)不禁令人面前一亮。


 



▲固定寬度的中央網(wǎng)站布局


 


過(guò)去幾年中,大多數(shù)網(wǎng)站都使用了以寬度為中央的網(wǎng)站布局,它可以讓圖片或視覺(jué)延伸部門在整個(gè)瀏覽器視口中全部展現(xiàn)出來(lái)。在這種趨勢(shì)熱點(diǎn)前,大多數(shù)網(wǎng)站都是固定寬度的,內(nèi)容處于網(wǎng)頁(yè)中央,你可以看到網(wǎng)站兩側(cè)的終結(jié)部門。固定寬度趨勢(shì)好像正以更現(xiàn)代的方式回歸,只是網(wǎng)站及其內(nèi)容部門不再處于視口的邊側(cè),有些網(wǎng)站選擇最大寬度,以確保它們的內(nèi)容處于視口中央。Michele Mazzucco的網(wǎng)站就是如斯。 


 



▲專業(yè)高質(zhì)量自定義攝影


 


圖庫(kù)照片依然在設(shè)計(jì)中據(jù)有一席之地,但是對(duì)于大多數(shù)最新泛起的網(wǎng)站來(lái)說(shuō),圖庫(kù)照片開(kāi)始采取高質(zhì)量的專業(yè)攝影照片,它們通常是唯一無(wú)二的,專為網(wǎng)站自定義拍攝的。使用自定義攝影比僅選區(qū)圖庫(kù)照片在設(shè)計(jì)方面取得了更大提高,它讓你的網(wǎng)站唯一無(wú)二,其他網(wǎng)站無(wú)法使用同樣的照片。好比,Grain and Mortar網(wǎng)站的自定義照片使用了該網(wǎng)站的大標(biāo)題,這展現(xiàn)出個(gè)性化效果,由于照片上的人和辦公場(chǎng)景都是在Grain and Mortar真實(shí)存在的,究竟沒(méi)有假辦公空間的圖庫(kù)照片!


 



▲彈出/滑出應(yīng)用式菜單


 


響應(yīng)式網(wǎng)站設(shè)計(jì)已經(jīng)流行了一段時(shí)間,可是直到近來(lái),大多數(shù)網(wǎng)站設(shè)計(jì)重點(diǎn)都放在令網(wǎng)站在桌面設(shè)備上看起來(lái)更好,而在手機(jī)或平板設(shè)備上看得過(guò)去即可。不管何種設(shè)備,響應(yīng)式網(wǎng)站設(shè)計(jì)正邁向更好體驗(yàn)。我們正看到這種設(shè)計(jì)元素向移動(dòng)設(shè)備上轉(zhuǎn)移,并在更廣泛地使用。好比24ways與Rawnet都展示了這種觀念,將類似應(yīng)用和響應(yīng)式菜單添加到整個(gè)網(wǎng)站中,而不僅僅有更小視口的設(shè)備上。在這種情況下,這兩家網(wǎng)站選擇靠左或靠右的垂直菜單,而不是位于頂部的水平菜單,使用起來(lái)更像彈出/滑出應(yīng)用式菜單,這種技術(shù)答應(yīng)網(wǎng)站應(yīng)用與響應(yīng)式設(shè)計(jì)泛起在更小的視口上。



▲躲藏主菜單


 


這與上面討論過(guò)的彈出/滑出應(yīng)用式菜單很像,我期待更多網(wǎng)站可能向首次訪問(wèn)網(wǎng)站的訪客躲藏主菜單。只有當(dāng)訪客預(yù)備移動(dòng)和點(diǎn)擊相應(yīng)圖標(biāo)后,這些躲藏菜單才會(huì)顯示出來(lái)。這種響應(yīng)式設(shè)計(jì)技術(shù)正開(kāi)始泛起在網(wǎng)站設(shè)計(jì)中,而非僅僅小的視口中。Brian Hoff Design的新網(wǎng)站就是最好的例子。他使用網(wǎng)站右上角的漢堡圖標(biāo)躲藏導(dǎo)航功能,直到訪客點(diǎn)擊它。過(guò)去2年,這種行為已經(jīng)逐漸被接受,訪客正習(xí)慣在網(wǎng)站應(yīng)用或手機(jī)應(yīng)用上如斯操縱。他將這種模式應(yīng)用到網(wǎng)站上,不管視口多大,都可匡助確保網(wǎng)站簡(jiǎn)介,功能完全。


 



▲非常大的字體


 


2014年,字體在很多網(wǎng)站設(shè)計(jì)中施展重要作用,我未發(fā)現(xiàn)這種趨勢(shì)在短期內(nèi)改變的跡象?墒2015年,我看到網(wǎng)站中的標(biāo)題和字體變得越來(lái)越大?鋸埖卣f(shuō),就連天上的飛機(jī)可能都能看到地面上的字。當(dāng)你訪問(wèn)Tiny Giant的網(wǎng)站時(shí),你會(huì)看到很大的字體。這實(shí)際上是一種聲明,讓你很難錯(cuò)過(guò)。大字體將繼承在2015年的網(wǎng)站設(shè)計(jì)中施展重要作用,成為確保進(jìn)步訪客視覺(jué)層次的方法。訪客首先會(huì)看到最大的字體,由于那會(huì)首先吸引你的留意力。


 



▲機(jī)能與速度


 


很多設(shè)計(jì)趨勢(shì)受需求驅(qū)動(dòng),以促使網(wǎng)站加載速度更快,消耗的寬帶流量更少。這篇文章中討論的大多數(shù)趨勢(shì)都可能需要減小網(wǎng)站,為那些手機(jī)、平板設(shè)備或更慢網(wǎng)絡(luò)用戶尋找更快加載方式。網(wǎng)站設(shè)計(jì)師和開(kāi)發(fā)者越來(lái)越強(qiáng)烈地意識(shí)到自己網(wǎng)站的權(quán)重,以及用戶如何與他們互動(dòng)。響應(yīng)式網(wǎng)站設(shè)計(jì)已經(jīng)匡助減輕這些擔(dān)憂。網(wǎng)速過(guò)慢以及設(shè)備類型等因素迫使設(shè)計(jì)師和開(kāi)發(fā)者緊密親密關(guān)注它們的文件和網(wǎng)站大小,網(wǎng)站加載速度在不同網(wǎng)速前提下也不盡相同。無(wú)需驚奇,2015年需要加載速度更快、沒(méi)有滯后感的無(wú)縫網(wǎng)站。

上一條:新站我們?nèi)绾瓮ㄟ^(guò)網(wǎng)站基礎(chǔ)...

下一條:淺析HTML5的上風(fēng)及對(duì)...