首頁(yè)

網(wǎng)站如何提速:圖片優(yōu)化網(wǎng)站推薦

藍(lán)藍(lán)設(shè)計(jì)的小編

頁(yè)面的加載時(shí)間是每一個(gè)UI設(shè)計(jì)師都擔(dān)心的數(shù)據(jù),或者至少是每個(gè)界面設(shè)計(jì)師都應(yīng)該擔(dān)心的問(wèn)題。圖片的大小肯定是一個(gè)需要留意的問(wèn)題。這就是藍(lán)藍(lán)設(shè)計(jì)為什么在這里寫(xiě)了幾個(gè)有助于優(yōu)化頁(yè)面中的圖片的小技巧,這些小技巧將有助于大家解決這個(gè)問(wèn)題,這些小技巧也可以在你需要優(yōu)化圖片的時(shí)候提供很多幫助。對(duì)你的網(wǎng)站設(shè)計(jì)有所幫助!

TinyPNG
TinyPNG是使用智能有損壓縮技術(shù),來(lái)減小png圖片的大小。

如何給你的網(wǎng)站增加品牌價(jià)值?

藍(lán)藍(lán)設(shè)計(jì)的小編

的品牌在大型的企業(yè)集團(tuán)公司中價(jià)值數(shù)十億美元。每個(gè)公司都應(yīng)該努力創(chuàng)造一個(gè)品牌。由于建立網(wǎng)站通常是建立品牌的第一步,這里有幾種方法可以使你的網(wǎng)站給你的品牌增加價(jià)值。

簡(jiǎn)潔幾乎總會(huì)出現(xiàn)在成功的故事中:這就是我們?nèi)祟?lèi)的樣子。我們可能會(huì)覺(jué)得有一些復(fù)雜,簡(jiǎn)單可以緩和一些事情。也是一種把事情完成的方式。嘗試一些復(fù)雜的事情會(huì)降低你的成功率。保持你的網(wǎng)頁(yè)設(shè)計(jì)簡(jiǎn)單。如果你是一個(gè)小企業(yè),那么你只需要一對(duì)夫婦的做的網(wǎng)頁(yè)和博客(也可能是精心布置店面)。你不會(huì)需要大量的內(nèi)容。你當(dāng)然不需要閃光燈。你會(huì)得到你想要的,不是嗎?下面藍(lán)藍(lán)設(shè)計(jì)和朋友們分享一下如何給你的網(wǎng)站設(shè)計(jì)增加品牌價(jià)值的方法,希望對(duì)大家的網(wǎng)站界面設(shè)計(jì)有所幫助!

網(wǎng)站是為別人而做,不是為了你

暢游VC-優(yōu)設(shè)截圖

如何避免犯哪些網(wǎng)頁(yè)設(shè)計(jì)最常見(jiàn)的可用性錯(cuò)誤

藍(lán)藍(lán)設(shè)計(jì)的小編

在過(guò)去十年中高品質(zhì)的網(wǎng)頁(yè)可用性一直是業(yè)內(nèi)討論的核心,因?yàn)樗鼘?duì)用戶來(lái)說(shuō)越來(lái)越重要。好的可用性也可以幫助建立品牌知名度,從而提升用戶對(duì)一個(gè)網(wǎng)站設(shè)計(jì)或者是一家公司的評(píng)價(jià)。今天人們依然高度關(guān)注可用性,是因?yàn)榇蟠笮⌒〉墓疽呀?jīng)證明了好的可用性策略是多么重要。

在過(guò)去幾年中,良好的可用性成為那些成功的初創(chuàng)公司的核心。多數(shù)情況下,簡(jiǎn)單的想法最具創(chuàng)造性,可用性主要是指:使一個(gè)功能或者產(chǎn)品易于使用,但同時(shí)也要保持產(chǎn)品質(zhì)量維持在高水平上。

如今,很多文章會(huì)談到普遍意義。在對(duì)該話題年復(fù)一年的討論之后,似乎UI設(shè)計(jì)者們?nèi)匀缓茈y去理解它??捎眯栽缫巡辉偈且粋€(gè)玩笑,下面藍(lán)藍(lán)設(shè)計(jì)這些建議應(yīng)當(dāng)被打印出來(lái)并粘到你桌子對(duì)面的墻上。

鏈接的顏色

我經(jīng)常發(fā)現(xiàn)自己在瀏覽網(wǎng)頁(yè)時(shí),有些頁(yè)面上的鏈接沒(méi)有以某種形式高亮顯示。這是我見(jiàn)過(guò)的最愚蠢的錯(cuò)誤。我愿意訪問(wèn)那些鏈接使用默認(rèn)藍(lán)色的頁(yè)面,而不是鏈接和 普通文字一個(gè)顏色的頁(yè)面。用戶需要知道如何在頁(yè)面之間導(dǎo)航、在哪兒能點(diǎn)擊鏈接。你不能指望他們把鼠標(biāo)一行行的掠過(guò)所有文字去找鏈接,直到發(fā)現(xiàn)鼠標(biāo)箭頭變成 “小手兒”。

網(wǎng)頁(yè)設(shè)計(jì)中那些不容忽視的細(xì)節(jié)

藍(lán)藍(lán)設(shè)計(jì)的小編

你有沒(méi)有經(jīng)歷過(guò)看到一個(gè)頁(yè)面的時(shí)候馬上就被它的界面設(shè)計(jì)吸引并且留下了深刻的印象呢?然后你進(jìn)一步細(xì)看這個(gè)頁(yè)面發(fā)現(xiàn)真正使這個(gè)頁(yè)面變得神奇的是一些小細(xì)節(jié),在藍(lán)藍(lán)設(shè)計(jì)這篇文章中我們將看到幾種把細(xì)節(jié)設(shè)計(jì)做到完美的頁(yè)面。

完美的像素線

Image Spark UI設(shè)計(jì)師用一個(gè)像素的線條來(lái)分割頂部導(dǎo)航,搜索輸入框,導(dǎo)航底欄。任何時(shí)候一個(gè)較淺的顏色緊挨著一個(gè)較深的顏色會(huì)使人出現(xiàn)有一個(gè)凸起的邊緣的錯(cuò)覺(jué)。請(qǐng)注意這種線條只能比背景色稍微淺一點(diǎn)點(diǎn)。如果使用一條白線那將失去這種效果。

熱門(mén)網(wǎng)頁(yè)和手機(jī)APP設(shè)計(jì)欣賞

藍(lán)藍(lán)設(shè)計(jì)的小編

一周又過(guò)去了,藍(lán)藍(lán)設(shè)計(jì)這里收錄了最近國(guó)外精彩的網(wǎng)頁(yè)設(shè)計(jì)手機(jī)App設(shè)計(jì),不多說(shuō)了,來(lái)享受這些精彩的界面設(shè)計(jì)創(chuàng)意之作吧!
 

JOBS: Le Film

atdesign_01

如何培養(yǎng)良好的設(shè)計(jì)習(xí)慣:把握細(xì)節(jié)

藍(lán)藍(lán)設(shè)計(jì)的小編

我們都知道,好的界面設(shè)計(jì)需要UI設(shè)計(jì)師技巧高超、創(chuàng)意與眾不同。在任何設(shè)計(jì)中,設(shè)計(jì)技巧,也就是設(shè)計(jì)基本功是排在第一位的,然而還有很多其他技巧性的東西也不容忽視,比如說(shuō)細(xì)節(jié)。對(duì)于設(shè)計(jì)師來(lái)說(shuō),細(xì)節(jié)太致命了,設(shè)計(jì)師必須高度關(guān)注細(xì)節(jié),仔細(xì)推敲,盡可能的追求完美。
 
在這里,”對(duì)細(xì)節(jié)的把握”(關(guān)注細(xì)節(jié))也是設(shè)計(jì)上的一種能力和技巧。盡管不是每個(gè)用戶都是一絲不茍、認(rèn)真檢查設(shè)計(jì)中的細(xì)節(jié),但UI設(shè)計(jì)師必須認(rèn)真對(duì)待每一個(gè)環(huán)節(jié)。無(wú)論是前期準(zhǔn)備,還是界面設(shè)計(jì)流程,以及后期的客戶交流,這些方面都要高度留心細(xì)節(jié)。有心的設(shè)計(jì)師會(huì)留意客戶說(shuō)的每一句話,會(huì)分析出客戶真正的需求,會(huì)從中找到指引和線索,這樣在設(shè)計(jì)時(shí),就很少出錯(cuò)。因此,細(xì)節(jié)不僅僅是在設(shè)計(jì)上的,要面面俱到。

一、何為”關(guān)注細(xì)節(jié)的設(shè)計(jì)技巧”?

5

如何提高網(wǎng)站瀏覽體驗(yàn)

藍(lán)藍(lán)設(shè)計(jì)的小編

你瀏覽一款網(wǎng)站時(shí),一般會(huì)迅速的對(duì)網(wǎng)站設(shè)計(jì)的外觀和使用感受做個(gè)評(píng)判,整體的界面設(shè)計(jì)風(fēng)格是第一印象,能否引導(dǎo)用戶繼續(xù)閱讀取決于此。

金玉其外敗絮其中必然無(wú)法長(zhǎng)久,功能性也是重要考量。推薦您也好好學(xué)習(xí)《網(wǎng)站用戶體驗(yàn)的76個(gè)要點(diǎn)》
好的用戶體驗(yàn)不僅僅關(guān)乎到功能性和設(shè)計(jì)美學(xué),還需要考慮很多因素,和藍(lán)藍(lán)設(shè)計(jì)一起來(lái)看一下吧。

一致性

最重要的交互元素一定要友好,并且風(fēng)格一致。

盡管在設(shè)計(jì)一款網(wǎng)站時(shí),我們可以融入很多創(chuàng)新點(diǎn)和美學(xué)風(fēng)格,但是一些經(jīng)常使用、且重要的元素,風(fēng)格一定要一致,比如按鈕、鏈接、導(dǎo)航欄、表單等等。我建議可以多瀏覽一些電商網(wǎng)站,他們?cè)谶@一點(diǎn)上做的就很棒,他們通常有很多的產(chǎn)品頁(yè)面,但是整體體驗(yàn)卻相差不大,我們可以看看優(yōu)衣庫(kù)的網(wǎng)站。

Consistency is one of the most important aspects in web design.

網(wǎng)頁(yè)設(shè)計(jì)中紋理的運(yùn)用技巧

藍(lán)藍(lán)設(shè)計(jì)的小編

texture界面設(shè)計(jì)中應(yīng)用已經(jīng)越發(fā)完善了。它將形成一種趨勢(shì),簡(jiǎn)單而有效的為web頁(yè)面設(shè)計(jì)添加幾分深度感。 充分發(fā)揮texture的威力是一份偉大的職責(zé)。它不僅能夠很好增強(qiáng)web設(shè)計(jì)的表現(xiàn)效果,對(duì)于設(shè)計(jì)師來(lái)說(shuō)還是一個(gè)質(zhì)量上乘的好工具。它的美妙作用是可以引導(dǎo)瀏覽者的視線,強(qiáng)調(diào)關(guān)鍵元素的重要性。

然而,長(zhǎng)期以往texture似乎總和臟亂或者低劣UI設(shè)計(jì)為伍,它的濫用處處可見(jiàn),像樂(lè)隊(duì)的website等,對(duì)于設(shè)計(jì)師來(lái)說(shuō),它遺留下來(lái)的滋味可不怎么樣!。 也正是由于以前的濫用,texture的優(yōu)勢(shì)長(zhǎng)期被人們所忽略。texture可以讓web設(shè)計(jì)更具整體感,但是前提是不要讓它滿屏皆是。

Texture(紋理)VS. Patterns(圖案)

在我們深入了解texture之前,先弄懂texturepattern之間的區(qū)別。這兩個(gè)詞經(jīng)常被誤認(rèn)為同義的。pattern通常是小的、重復(fù)的圖片元素,而texture更趨向于大一點(diǎn)的不重復(fù)的圖片。你可以想象兩個(gè)集合,左邊是pattern,右邊是texture,這兩個(gè)集合有一部分交集,也就是說(shuō)在某些時(shí)候texture也是pattern。去tileabl這個(gè)網(wǎng)站逛一圈,也許你會(huì)有更清晰的印象。

設(shè)計(jì)師必備的頂尖用戶界面紋理

藍(lán)藍(lán)設(shè)計(jì)的小編

今天藍(lán)藍(lán)設(shè)計(jì)送上一套非比尋常的紋理,可以見(jiàn)配圖,這些都是頂尖UI設(shè)計(jì)師經(jīng)常在界面設(shè)計(jì)中用到的紋理。特別適用于安卓蘋(píng)果的無(wú)線端應(yīng)用,圖片都很大,(2560×1440)高清無(wú)碼,涵蓋了當(dāng)前國(guó)際范中的所有流行紋理:從面料到金屬。

uiTexturesThumb

紋理應(yīng)該怎樣用到網(wǎng)頁(yè)中?

藍(lán)藍(lán)設(shè)計(jì)的小編

有很多學(xué)習(xí)UI設(shè)計(jì)的同學(xué)下載了紋理后知道如何平鋪使用,并且都分類(lèi)羅列一目了然,可是在制作網(wǎng)站的時(shí)候卻不知道怎么用,總感覺(jué)利用不起來(lái)。

那么今天藍(lán)藍(lán)設(shè)計(jì)薦30個(gè)運(yùn)用紋理界面設(shè)計(jì)出眾的網(wǎng)站設(shè)計(jì),希望對(duì)你有一定的啟發(fā):)

Hollister Co.

Textured website design example: Hollister Co.

日歷

鏈接

個(gè)人資料

存檔