2022-07-07 分類: 網(wǎng)站建設(shè)
下次當(dāng)你在設(shè)計(jì)一些報(bào)告書之類的封面時(shí),可以將它設(shè)計(jì)得耳目一新。在狹窄封面上的彩色圖片對(duì)讀者產(chǎn)生了相當(dāng)大的吸引力,同時(shí)又能讓讀者看到下面一頁(yè)的部分內(nèi)容。里面那一頁(yè)是介紹文字。這種版式永遠(yuǎn)都給人吸引人的眼睛。
理論上說,這個(gè)封面可以說是由兩個(gè)頁(yè)面組成。由于這兩頁(yè)紙同時(shí)構(gòu)成了一個(gè)封面,所以里面的文字應(yīng)該與封面的圖案配合好水平線。
當(dāng)然,將順序調(diào)換一下也未嘗不可。文字標(biāo)題在最上面一頁(yè),而圖片則變成內(nèi)頁(yè)。效果同樣不錯(cuò)。
利用顏色及圖案的適當(dāng)變化,可以使你輕易設(shè)計(jì)一系列這樣的漂亮封面。
二、封面上有太多照片要用?將它們按網(wǎng)格排列!
與其將封面設(shè)計(jì)成一幅復(fù)雜的抽象拼貼圖,不然將圖片排列整齊,既簡(jiǎn)單,又美觀。這種按網(wǎng)格排列的圖片有大有小,互相重疊,但整體看起卻象是一個(gè)有機(jī)整體。
正方形網(wǎng)張:有時(shí)你在設(shè)計(jì)封面時(shí)很難找到一張完全合你心意的照片,干脆將幾張圖片同時(shí)用上。然后用方格來定位。當(dāng)然,為了使它適合網(wǎng)格的大小,你事先需要對(duì)圖片進(jìn)行適當(dāng)?shù)募羟?。一個(gè) 4 × 4 的網(wǎng)格形成 16 個(gè)小方格。注意下圖中,這些網(wǎng)格線在設(shè)計(jì)中仍然是保留的。
從上面這個(gè)示意圖可以看出。整個(gè)網(wǎng)格將封面分成三部分,并將所有元素都形成了整齊的排列。而上下的文字都是與其中一條網(wǎng)線對(duì)齊的。
三、網(wǎng)頁(yè):將眾多的信息形成視覺層次感是大的關(guān)鍵
Men.style.com 的網(wǎng)頁(yè)中包含了眾多的信息,下圖共有 9 張圖片,還有很多大小標(biāo)題,所形成的區(qū)域數(shù)量也非常多――有重點(diǎn)的封面報(bào)道,有一些是比較次要的新聞,還有其它的搜索功能等等。但你在看這個(gè)網(wǎng)頁(yè)的時(shí)候,卻并不會(huì)讓你的眼睛無所適從眼花繚亂,相反,整個(gè)版面安排得非常漂亮及吸引人。為什么有這種效果?關(guān)鍵是他們?cè)谂虐嫔蠌?qiáng)調(diào)了層次感。整個(gè)版面大元素與小元素之間,通過淺色及暗色及組織形成了協(xié)調(diào)的對(duì)比。
一眼望去,電影明星蓋倫霍爾( Gyllenhaal )是這個(gè)版面當(dāng)之無愧的視覺焦點(diǎn)。他為什么有這種力量: 1 、他是這個(gè)網(wǎng)頁(yè)中大的一個(gè)元素; 2 、他的身體輪廓與那些矩形的直線邊框形成了對(duì)比; 3 、他超出了區(qū)域一部分; 4 、以黑色為主的肖像與周圍白色區(qū)域形成了對(duì)比。 5 、在這么多圖片中,他的面孔是大家最熟悉的,而且,他還直視著你。
從下面的示意圖你或許看到更清楚:
A 是最主要的區(qū)域。( 1 )該版面被分成三個(gè)主要區(qū)域;( 2 )而每一個(gè)區(qū)域又再細(xì)分為各個(gè)小區(qū)域;( 3 )這些小區(qū)域里面還有更小的區(qū)域。而 A 區(qū)域給人顏色厚重的感覺,使它輕易地與其它兩個(gè)區(qū)域分開。而 A 中的小區(qū)域之間的對(duì)比則較為低調(diào),并沒有象大區(qū)域的對(duì)比那樣強(qiáng)烈。
這樣的劃分,使到網(wǎng)頁(yè)可以包含很多的信息。特別注意其中標(biāo)題的樣式,在不同區(qū)域中一些主要標(biāo)題的字體及樣式都是一樣的,使到整個(gè)版面在視覺上形成一個(gè)整體。
四、圖片版面:一些小元素可以“軟化”版面
怎樣才能在這個(gè)網(wǎng)頁(yè)設(shè)計(jì)中,使吉普車的圖片讓觀看的人顯得更有動(dòng)感?簡(jiǎn)單,在整個(gè)版面中加上一些小元素。這些小元素可以使網(wǎng)頁(yè)及圖片邊框所形成的硬邊感覺“軟化”,使到整個(gè)版面讓人覺得更加親切吸引。
從上面的兩個(gè)網(wǎng)頁(yè)中我們可以看到,圖片的吉普車圖片占據(jù)著非常大的位置,而且正在向你駛來!而當(dāng)你加上一些小元素之后(如上圖的小石塊及樹葉),會(huì)使到整個(gè)版面產(chǎn)生微妙的視覺變化,因?yàn)檫@些小元素與吉普車的比例與我們?cè)诂F(xiàn)實(shí)生活中所看到的比例感覺差不多一致的,這樣就會(huì)使吉普車給人的感覺更真實(shí)。而這些小元素加在版面的邊緣上,軟化了硬邊的感覺。這些小元素我們可以從一些圖片取出,而在應(yīng)用時(shí)應(yīng)該加上一點(diǎn)陰影效果,顯得更真實(shí)。
五、對(duì)于一些低預(yù)算及時(shí)間很緊迫的版面設(shè)計(jì),我們應(yīng)該走極端!
對(duì)于一些小型設(shè)計(jì)項(xiàng)目,費(fèi)用預(yù)算很低,但客戶又要求你時(shí)間要快,面對(duì)這種情況,我們以極端的方式設(shè)計(jì)是其中最容易的一條路――或者讓你的圖片顯得非常大,或者讓圖片顯得非常小。收集一些矢量或圖片素材,再加一些特別的字體,就可以輕松完成:
上面的設(shè)計(jì)中各個(gè)元素顯得很小,而且圖片樣式差不多。這種一行排列的設(shè)計(jì)不用幾分鐘就可以完成。一行細(xì)小的字體是希望故意增加版面的復(fù)雜性。而白色是其中主要的色調(diào)。
而上圖這個(gè)則相反,元素很大但結(jié)構(gòu)卻很簡(jiǎn)單,我們將其中的圖片盡可能拉大,但與背景的對(duì)比不要太過強(qiáng)烈,出來的效果就是:你毫不費(fèi)吹灰之力就創(chuàng)造出一種很酷的視覺效果。線條較細(xì)的字體與圖中那只有點(diǎn)呆鸛的形象產(chǎn)生良好搭配。請(qǐng)注意小示意圖中的虛線,它是各個(gè)元素之間產(chǎn)生聯(lián)系的參考線。
本文所用顏色如下:
文章標(biāo)題:版面排版的五個(gè)技巧
文章URL:http://www.rwnh.cn/news0/175100.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供外貿(mào)網(wǎng)站建設(shè)、微信小程序、網(wǎng)站排名、面包屑導(dǎo)航、網(wǎng)站策劃、ChatGPT
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(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í)需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容