網(wǎng)頁(yè)設(shè)計(jì)中字體與圖片的位置關(guān)系處理

2023-03-23    分類(lèi): 網(wǎng)站建設(shè)

響應(yīng)式網(wǎng)站的一個(gè)特點(diǎn)是:一張圖片通常會(huì)配上幾個(gè)字或者一句話。在設(shè)計(jì)的時(shí)候,就有一個(gè)問(wèn)題需要處理——
字體與圖片的位置關(guān)系,設(shè)計(jì)師是如何處理的呢?

網(wǎng)頁(yè)設(shè)計(jì)

根據(jù)我們的觀察,不同的設(shè)計(jì)師對(duì)字體和圖片位置關(guān)系的處理辦法是不一樣,不過(guò),如下幾個(gè)辦法是通用的。
字體大小處理
通常來(lái)說(shuō),很多圖片都是有主體物體的,就是圖片中呈現(xiàn)的主要物體,在這種情況下,使用的字體不應(yīng)該大于主體物。如果有的圖片沒(méi)有主體物,使用的字體大小也應(yīng)該考慮到用戶的辨認(rèn),不宜過(guò)大或者過(guò)小,不少設(shè)計(jì)師常用14px或12px的字體。
字體所處位置處理
大多數(shù)的圖片都是有視覺(jué)焦點(diǎn)的,通常來(lái)說(shuō),字體應(yīng)該處于圖片的視覺(jué)焦點(diǎn)橫豎軸線上,如果,字體較少,可以直接放在視覺(jué)焦點(diǎn)上。例如,蘋(píng)果官網(wǎng)上,幾乎所有的字體都位于產(chǎn)品圖視覺(jué)焦點(diǎn)的數(shù)軸線上方。也有的圖片沒(méi)有明顯的視覺(jué)焦點(diǎn),對(duì)于這類(lèi)圖片,文字可以直接放置在圖片中央為宜。
字體與圖片邊緣的距離
如果圖片中有主體物,字體與圖片邊緣的距離,應(yīng)該與主體物邊緣的距離相等或者差不多。這樣設(shè)計(jì)的好處是,在視覺(jué)上,將字體與圖片的主體物處于并列的狀態(tài),一文一圖,整個(gè)畫(huà)面看起來(lái)較為協(xié)調(diào)。
字體與圖片線條的關(guān)系
如果圖片中有明細(xì)物體線條,例如,圖片中有河水的流向等等,也就是說(shuō),圖片中主體物是有明確的線條的,對(duì)于這類(lèi)圖片,設(shè)計(jì)師可以采取兩種辦法。一種辦法是字體的排版可以與線條平行。還有的設(shè)計(jì)師可能會(huì)采用另一種辦法,讓字體的排版與主體物線條靠近。這兩種辦法設(shè)計(jì)出來(lái)的作品,都不會(huì)有突兀之感。
字體面與主體物面有交叉
如果字體較多,會(huì)形成一個(gè)字體面,而如果圖片中有主體物,也會(huì)形成一個(gè)主題面,兩個(gè)面之間,好能夠形成面與面之間的交叉。這樣的視覺(jué)呈現(xiàn),不會(huì)讓字體或者主體物顯得孤立,兩者之間會(huì)給人有聯(lián)系的感覺(jué)。
在元素較為簡(jiǎn)單的圖片中,單純使用漢字,會(huì)更加凸顯出畫(huà)面的單調(diào)。設(shè)計(jì)師會(huì)采取這樣一種處理辦法,就是增加數(shù)字、英文字體的使用,將數(shù)字、英文、漢字搭配起來(lái),讓整個(gè)單調(diào)的畫(huà)面豐滿和豐富。在一些慶典或者周年慶的網(wǎng)頁(yè)設(shè)計(jì)中,數(shù)字往往被突出顯示,配以文字說(shuō)明,畫(huà)面沖擊感十足。
書(shū)法字體與網(wǎng)站風(fēng)格
漢字的變化范圍遠(yuǎn)遠(yuǎn)超過(guò)英文,這也使得漢字字體是可以與網(wǎng)站的風(fēng)格進(jìn)行搭配的。例如,一個(gè)做古典家具的英文網(wǎng)站,英文字體在怎么變化,可能也無(wú)法傳達(dá)出古典、傳統(tǒng)的概念和意境,但是如果使用書(shū)法字體,古典的已經(jīng)躍然紙上。
不難看出,網(wǎng)站中單單是一個(gè)字體的設(shè)計(jì),學(xué)問(wèn)就非常之深、非常之大,這也足以看出,網(wǎng)站設(shè)計(jì)是一個(gè)“做到老、學(xué)到老”的職業(yè),任何一個(gè)網(wǎng)站設(shè)計(jì)師,概莫能外。

當(dāng)前標(biāo)題:網(wǎng)頁(yè)設(shè)計(jì)中字體與圖片的位置關(guān)系處理
URL網(wǎng)址:http://www.bm7419.com/news32/247032.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供面包屑導(dǎo)航、微信小程序品牌網(wǎng)站設(shè)計(jì)、手機(jī)網(wǎng)站建設(shè)虛擬主機(jī)網(wǎng)站內(nèi)鏈

廣告

聲明:本網(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í)需注明來(lái)源: 創(chuàng)新互聯(lián)

h5響應(yīng)式網(wǎng)站建設(shè)