設計元素 字型

2021-05-25 12:34:47 字數 1907 閱讀 6583

文字作為做常見、最大的資訊傳遞方式,遍布我們生活的每個角落。也為此,注定了它是每乙個設計中最主要的元素之一。

大多數設計人員在頁面上使用多種字型,往往是隨機的,即興的,完全依賴於自己的喜好或者感覺。然,這種隨機會讓設計中存在一種或多種衝突,衝突的起因來自字型的樣式、大小、粗細等多方面。

robin.williams在《寫給大家看的設計書》一書中將字型分為六大類(不知道是不是他老人家原創):

1、oldstyle

——oldstyle類別的字型是基於手寫體建立的,這一類別的字型都有一條自左上向右下傾斜的強調線!所以,它應當是給眼球感覺最舒適的一類字型,也最適合大量文字展示。

2、moden

——moden字型與

oldstyle

有乙個相似的地方,就是它們都有截線,不同的是

moden

字型的強調線是自上而下垂直的,同時

moden

類別的字型粗細過度非常明顯,瘋狂的突出。所以,它不適合作為大量的文字展示,會過多的刺激眼球,也正因如此,它是和突出某些重要資訊,比方說做標題。

3、slab serif

——slab serif類別的字型,粗細過度非常不明顯,甚至沒有,有點類粗體的感覺!基於這個特點,

slab serif

使人閱讀起來很舒服,但同樣會顯得過於暗淡,很難激起人們的注意!所以,它適合作為細小資訊的填充,短小的說明,或者作為兒童讀物的主要文字也不錯。

4、sans serif

——sans serif和前面幾位相比,比較特殊,它沒有強調線,也沒有截線!為此,在乙個好的設計頁面中,適量引入

sans serif

是個非常不錯的選擇,它能大大提公升頁面的對比性!最大的問題在於,它與

oldstyle

一樣有用強調線,又和

slab serif

一樣沒有截線,過多使用會產生***,就是使整個頁面都失去絢麗的部分。好比乙個人穿了一件桔黃色的上衣,又偏偏穿了一條奶黃色的褲子,覺得搭配卻又讓人看著彆扭。這就是

slab serif!

5、script

——script,漂亮的手寫體。這玩意兒好比是飯後的甜點,你永遠不能拿它當正餐來吃,好比咖啡方糖,只適合放一點作為點綴,否則味道就變了。最適合的比喻

script

是忌廉,搭配起來很好吃,光啃忌廉只會讓人想吐。它能給頁面增加一抹亮色,卻不適合作為大文字載體。炫目的東西,只適合做為點綴。

6、decoratuve

——最後一種,decoratuve

,怎麼說呢?藝術字!

藝術字好比,最容易抓住人的眼球,一眼將你的目光吸引到它所包含的資訊上!和script

相似,它不適合作為大文字載體,只適合抓眼球,如果某人有好奇心,想用這樣一種驚豔的方式展示他的設計,我不反對!但結果是注定的,那就是

——天書原來如此!

天下字型千千萬,robin

的六個分類應該可以將這千千萬都涵蓋其中。所以,我們在設計中使用文字,也變得有機可循,大可不必遵循「隨

綜上所訴,相同的文字資訊,採用完全相同的字型(是字型,不是類別),不相同類別之間,要採用不同的類別(六大類別,不是字型)。比方說乙個網文的標題我採用的moden

字型,正文採用

oldstyle

,段首採用

slab serif

,**的

logo

用decoratuve

,僅做到如機」

和「感覺」

。此,我們發現自己的設計會驚豔很多,至少不是隨機產生的產物,會變得有跡可循。

當然,除此之外,字型運用還有很多講究,比方說大小、方向等等,我只是個初學者,更多的東西要靠我們一起慢慢實驗,才能有更多的心得。

總結:避免在同乙個頁面中出現同一種類別的字型,否則效果不是醒目,而是衝突!

字型設計輔助

rightfont 5 for mac是一款支援photoshop和sketch的字型設計輔助軟體,rightfont 5 for mac 字型管理器 可以在sketch裡插入文字進行美化時,雙擊rightfont列表裡的各種字型可馬上更改sketch字型樣式,這樣會大大的節省設計師們的時間。rig...

網頁元素 字型相對單位

rem 相對html的font size單位,在使用rem前要先設定根元素的單位 根元素 html 使用時 p 32px em 相對當前物件文字單位尺寸,如果當前物件沒有設定預設文字尺寸,則相對於瀏覽器預設字型尺寸 當前物件尺寸 body 使用時 p 32px vw vh vmax vmin 相對於...

網頁元素 字型相對單位

rem 相對html的font size單位,在使用rem前要先設定根元素的單位 根元素 html 使用時 p 32px em 相對當前物件文字單位尺寸,如果當前物件沒有設定預設文字尺寸,則相對於瀏覽器預設字型尺寸 當前物件尺寸 body 使用時 p 32px vw vh vmax vmin 相對於...