資源描述:
《如何設(shè)計(jì)簡(jiǎn)潔的網(wǎng)頁(yè)小廣告》由會(huì)員上傳分享,免費(fèi)在線閱讀,更多相關(guān)內(nèi)容在行業(yè)資料-天天文庫(kù)。
1、如何在細(xì)小的空間設(shè)計(jì)出視覺(jué)效果吸此人的廣告?第一步:使用簡(jiǎn)單的照片對(duì)付一些區(qū)域狹窄的空間需要涉及一些特別的要求,第一步,就是采用一張簡(jiǎn)單但又能傳達(dá)很多信息的照片。設(shè)計(jì)知識(shí)資源網(wǎng)一般的廣告總是采用整張圖片加上文字配合,而網(wǎng)頁(yè)上一個(gè)標(biāo)準(zhǔn)的小廣告的尺寸是120×90象素,分辨率為72dpi??臻g確實(shí)很小。你如何在這個(gè)小地方加進(jìn)你想要的東西?象上圖,難道你想讓整個(gè)紐約市都塞進(jìn)這個(gè)小空間里?那只會(huì)讓這些建筑物變成一個(gè)個(gè)斑點(diǎn)而已。當(dāng)我們面對(duì)這些小廣告的版面時(shí),并不應(yīng)該只是將整張圖片簡(jiǎn)單縮小——因?yàn)榭臻g已經(jīng)很小,分辨率又很低。而一般的網(wǎng)頁(yè)上總是充斥著很
2、多混亂的信息,將圖片只是簡(jiǎn)單地縮小,那些細(xì)微的東西完全不會(huì)此起人們的注意。所以我們要思考的是:簡(jiǎn)單、醒目及簡(jiǎn)短。我們并不需要使用整張紐約市的照片才能代表紐約,我們應(yīng)該要運(yùn)用這個(gè)城市的一些象征符號(hào)來(lái)傳達(dá)這種信息,比如:自由女神像,帝國(guó)大廈,當(dāng)然,你還可以自己決定其它的東西。我們要尋找一張具有象征意味的照片,構(gòu)圖要簡(jiǎn)單,顏色要醒目,角度要明顯,對(duì)比要強(qiáng)烈,當(dāng)然,最好是所有這些因素都能夠在一起。第二步:簡(jiǎn)單的版面使用簡(jiǎn)潔的文字,將文字與其它素材簡(jiǎn)單結(jié)合。網(wǎng)上培訓(xùn)課程的登記涉及到很多硬件,但我們并不需要將所有的東西都全部顯露出來(lái),而是……上圖左,
3、使用一張簡(jiǎn)單且常見(jiàn)的象征圖片,將背景設(shè)為黑色,使其與白色的鼠標(biāo)形成強(qiáng)烈對(duì)比,但鼠標(biāo)本身并不能傳達(dá)網(wǎng)上報(bào)名注冊(cè)這一信息,所以……設(shè)計(jì)知識(shí)資源網(wǎng)還要加上文字。只有加上文字,所有的信息才是完整的。大文字同樣采用白色,而大學(xué)名稱采用金黃色,使其讓人知道這是兩個(gè)不同信息。我們說(shuō)排版要盡可能簡(jiǎn)單。留意上圖左圖,文字與鼠標(biāo)高度相同,使兩者成為了一個(gè)整體,而右圖表明,每個(gè)元素之間的間隔距離都是相等的。將剪切工具變成一種設(shè)計(jì)工具通過(guò)對(duì)圖片進(jìn)行恰當(dāng)?shù)募羟校梢钥刂茍D片所傳達(dá)出不同的效果。剪切過(guò)程雖然簡(jiǎn)單,但在剪切時(shí)卻要很多細(xì)節(jié)要考慮。上圖大圖是一張漂亮的原
4、始圖片,通過(guò)你不同的處理方式,可以讓它傳達(dá)不同的信息。如小圖,我們只保留左邊的一半,使到整張圖片變得更加有沖擊力,同時(shí)還留出了空間給文字。當(dāng)然,還有很多種剪切方式:中心構(gòu)圖使整張圖片顯得穩(wěn)定。她的目光直接面對(duì)著你,透著一種優(yōu)雅迷人的氣息。設(shè)計(jì)知識(shí)資源網(wǎng)偏離中心的構(gòu)圖打破了空間的平衡,傳達(dá)了一種略為緊張的氣氛呈角度的構(gòu)圖,這使到圖片中人物的眼神變得更加煽情,使你更加容易注意她。這是一種更強(qiáng)烈的剪切方式,剪切的邊緣去到她的眼睛,而且還呈角度,比上一張更加容易引起人們的注意,張力十足。利用文字來(lái)組織圖片在版面非常狹窄的時(shí)候,文字與圖片必須謹(jǐn)慎配
5、合,避免讓人產(chǎn)生兩者分離的感覺(jué)。事實(shí)上,文字與圖片必須形成同一種信息。記住,字體也是一種圖形,所以你可以充分利用字體的樣式、形狀、粗細(xì)及顏色來(lái)補(bǔ)充和加強(qiáng)圖片的力量。一張全景圖注定不會(huì)簡(jiǎn)單,文字“EICapitan”與這座作為焦點(diǎn)的花崗巖山峰分開(kāi)。當(dāng)然,我們可以通過(guò)剪切來(lái)作進(jìn)一步的處理,但有一個(gè)問(wèn)題,這座山峰的美麗正是要有一定的距離感及它周圍的細(xì)節(jié)才體現(xiàn)出來(lái)。而下方的那個(gè)綠色實(shí)色區(qū)域使到文字與圖片分離,避免了整張圖片變得過(guò)于復(fù)雜。設(shè)計(jì)知識(shí)資源網(wǎng)上圖的圖片經(jīng)過(guò)剪切,使其更加收緊。現(xiàn)在山峰給人一種更加強(qiáng)烈的高聳感而不是開(kāi)闊感。陰影也使圖片形成了
6、縱深。同時(shí)采用了一種縮窄的大寫字母,使到文字與圖片形成一個(gè)有機(jī)的整體,使讀者的眼睛看上一眼就能夠留意。上圖采用名信片的設(shè)計(jì)樣式,盡管圖片沒(méi)有改變,但這種處理方式卻使整個(gè)設(shè)計(jì)顯得更加寧?kù)o,也更有畫廊的氣息?;疑淖煮w在白色區(qū)域上仍然能夠容易被辨認(rèn),開(kāi)闊的白色區(qū)域也使到圖片有一種水平感。再來(lái)看一下實(shí)際大小的效果:讓我們進(jìn)一步來(lái)探討上述的設(shè)計(jì):首先將一張大圖片縮小到合適的尺寸(1)。設(shè)計(jì)知識(shí)資源網(wǎng)將圖片的寬度變成標(biāo)準(zhǔn)的120px,而圖片高度要少于90px,因?yàn)槲覀兿路竭€要加上文字區(qū)域(2)。用一種實(shí)色填充下方區(qū)域,同時(shí)這個(gè)區(qū)域也與圖片有一些重疊
7、。顏色來(lái)自于圖片,用吸管在圖片取色(3)。最后加上文字(4)。當(dāng)您要面對(duì)一種復(fù)雜的或者有太多細(xì)節(jié)的圖片時(shí),這種處理方式是比較理想的。這里,我們對(duì)圖片進(jìn)行剪切,為該圖片創(chuàng)造出一個(gè)視覺(jué)焦點(diǎn)。然后再尋找一種能夠加強(qiáng)該圖片傳達(dá)的字體。在這個(gè)例子中,我們采用一種又高又窄的字體填滿下方整個(gè)區(qū)域來(lái)加強(qiáng)這座山峰的特點(diǎn)。留意上方的那行細(xì)字,山峰是疊在這行文字上方的,加強(qiáng)了圖片的層次感。也使到這座花崗巖山峰有更加靠前的感覺(jué)。利用文字來(lái)補(bǔ)充圖片在這里,我們這張充滿動(dòng)感的圖片由于受到背景的影響而削弱了對(duì)比的強(qiáng)度。背景與人物都呈同一種色調(diào),同時(shí)背景也還有很多細(xì)節(jié),
8、使到圖中人物不能成為焦點(diǎn)圖案,挽救的途徑是利用文字來(lái)對(duì)這張圖片進(jìn)行補(bǔ)充。創(chuàng)造焦點(diǎn)的第一步是通過(guò)剪切,盡可能將注意力放在這個(gè)滑板的運(yùn)動(dòng)員身上(1),背景雖然顯得有點(diǎn)雜亂,但在視覺(jué)也挺有趣,你可以