三把火科技
大客戶熱線:135 4326 7002
業務熱線: 0755-88365670   88367881

深圳網站建設如何做好網站網頁字體排版?

 二維碼 335
發表時間:2018-08-15 19:00作者:三把火科技來源:深圳網站設計www.wyskd.tw網址:http://www.wyskd.tw/

深圳網站設計會涉及到很多的制作,本文主要給大家介紹最基礎的字體排版,在開始動手制作網頁之前,首先要了解網頁設計的標準與規范,這樣才能保證設計圖符合網頁設計的要求。


深圳網頁設計規范是適用于Web端的人機交互界面的標準,是每個網頁設計師從業時必須要遵守的行為準則。網頁設計規范的首要目的是優化Web產品、提升用戶體驗。同時,統一的網頁設計規范可以讓設計師重復利用相同模塊,有助于提高設計師的工作效率。此外,遵守設計規范也有利于前端工程師、交互設計師等其他崗位之間快速有效地傳遞信息。上崗前熟讀設計規范并牢記要點可以幫助新人快速適應工作崗位,減少出錯的可能性。

企業網站建設一站式.jpg

1、字體的選擇

對于大多數中國人來說,見過最多的字體應該就是黑體和宋體了,這兩種字體是設計的基礎字體,應用在生活的各個場景中。

? 宋體:源于書法體,主要特點是橫細豎粗,筆畫末端帶有三角狀裝飾,字形端莊有力,常運用在文章正文當中。

? 黑體:字的主要特點是橫豎均勻,筆畫相對宋體較為粗壯,常用作文章標題,突出而醒目。

早在2006年Windows發布Vista系統時,微軟雅黑體就已代替宋體,成為了新的系統默認字體。

那么當時為何要選擇微軟雅黑體來代替宋體呢?

原因是宋體是一款襯線字體,受到Windows平臺字體渲染技術的限制,在小字號字體渲染方面表現略差,部分字號在顯示時會產生鋸齒、模糊等效果。

而微軟雅黑這款非襯線字體,筆畫豐滿、簡潔,常用字號的顯示效果相比宋體更為優秀,同時識別度更高。因此,從Vista時代起,微軟雅黑體就作為Windows的系統默認字體沿用至今。

在網頁設計中,為了保證有較好的顯示效果,主要標題的字體建議使用微軟雅黑體,次要標題可選用宋體。

文章的正文可選用宋體,也可使用微軟雅黑體。

宋體和微軟雅黑體網頁顯示效果對比

此外,如果網頁設計中遇到需要展示英文字符的情況,建議選擇Arial、Verdana和Tahoma這幾種系統默認字體。


2、字號使用規范

在網頁設計中,一般選擇使用雙數字號,字號的大小并沒有明確規定,但為了確保正常的閱讀效果,可以參考以下參數:

? 在網頁設計中最小的字號一般為12像素;

? 正文常見字號有12像素、14像素和16像素;

? 標題常見字號有18像素、20像素、26像素和30像素。

這里需要注意的是,由于顯示器分辨率的不斷提高,12像素的字號在大分辨率顯示器中會顯得較小,對用戶閱讀造成一定的困難。因此,在目前的網頁設計中很少使用12像素的字號,網站常規正文字號普遍使用的是14像素或16像素。

宋體和微軟雅黑字體均可以作為網頁設計的常用字體。但在目前的網頁設計中我們會發現,網頁中基本都以微軟雅黑字體為主,而宋體已不多見。具體來說,微軟雅黑體相比宋體而言,少了一些裝飾性,同樣字號,微軟雅黑體在視覺上更顯粗壯有力,且辨識度更高,尤其是小字號的顯示效果,微軟雅黑體的視覺感會更為清晰與明朗。

網頁標題如何設計看起來會比較舒服?

答案是字體清晰疏闊,字號醒目易讀即可。

? 例如,網易新聞的標題樣式一般設置為微軟雅黑體字體,36像素的字號。

微軟雅黑字體,字號36px

? 騰訊新聞的標題樣式一般設置為微軟雅黑體字體,26像素的字號。

微軟雅黑字體,字號26px


3、段落、行間距規范

閱讀是用戶在網站上獲取信息的重要方式,閱讀體驗的好壞直接關系到用戶對產品的印象,作為信息展示的主體,漂亮的文字排版和巧妙的留白都能為整個網頁增色不少。在網頁設計中,文字排版的要點分為兩個方面,即段落和行間距。

? 段落中“行長”與“對齊方式”的設置

行長:主要指段落文字的寬度。

通常情況下,行越長,行間距越大,否則用戶在閱讀時很容易串行。在網頁正文中,漢字一般以每行顯示30~40個字為宜,英文一般以每行顯示40~70個字母為宜。

段落:對齊方式主要有4種,包括左對齊、右對齊、居中對齊和兩端對齊。

段落對齊方式

在國內,大段文字的設計,多數設計師會根據中國用戶的閱讀習慣,將對齊方式設置為左對齊。

? 段落中“行間距”的設置

行間距:指段落中行與行之間的距離。

行間距作為段落中的留白,讓字與字之間有了可呼吸的空間。過小的行間距會使頁面變得擁擠不堪,增加用戶錯讀的可能性。而過大的行間距則會占用大量的頁面空間,缺乏美感。選擇適當的行間距不僅可以提升文字的易讀性,也可以最大限度地利用好頁面空間。

行間距的設置

傳統中文文檔默認行間距一般為1.5倍,在現階段的網頁設計中,漢字一般使用1.8~2倍的行間距。

英文段落一般選擇1.5倍行間距。

網頁設計的標注規范

在設計的日常工作中,設計師與前端開發人員的對接關系往往非常緊密,而設計圖的標準化標注可以提高前端開發人員的工作效率。

效果圖的標注一般包括以下3個部分:

☉ 頁面中控件的顏色、尺寸、交互效果(如按鈕、表單等)。

☉ 字體顏色、字號。

☉ 頁面中各個模塊的尺寸和間距。

在效果圖標注中,應特別注意以下4個問題:

☉ 保證標注的文字清晰易讀。

☉ 標注所使用的顏色應與背景色區分。

☉ 標注應盡量在空白區域,不要對原圖造成視覺干擾。

☉ 標注信息應條理清楚,同一模塊的標注應擺放在同一位置,適當留有間隙,方便開發人員閱讀。

在進行網頁設計時,網頁設計師必須熟讀網頁設計的原則和規范,且一切設計必須依照規范來進行。目前遵循的網頁設計規范都是經過科學論證和用戶調研得出的。隨著科學技術的不斷發展,這些規范可能需要與時俱進,但是對于現階段的網頁設計而言,這些符合當下用戶體驗的規范經驗值得設計師學習和借鑒。


深圳網站設計公司www.wyskd.tw

更多資訊,包括深圳網站設計,百度排名,網站推廣等信息,歡迎來電13543267002
文章附圖

什么是萬詞霸屏?萬詞霸屏名字真不是蓋的,一次性操作幾萬個關鍵詞在首頁,還是全搜索引擎,基本上客戶付了錢,肯定能上幾...

文章附圖

營銷型網站-做最賺錢的網站1,為什么要做營銷型網站?營銷型網站有什么好處?2,什么是營銷型網站?所謂營銷型網站就是...

文章附圖

SEO網站推廣-百度優化排名什么是seo優化排名?seo優化排名的定義是什么?SEO,就是搜索引擎優化;通過對您網...

文章附圖

做網站最主要的是考慮那些因素?第一:域名注冊,選擇一個好域名太重要了,如果公司名字很好,但是域名很長,不好記,那就...

文章附圖

網站設計流程一般包括哪些方面?1.網站方案策劃:策劃好網站的方向,網站名,網站的目標,網站的運營,贏利點以及對手分...

文章附圖

深圳網站建設公司?研究怎樣的網站用戶體驗是不好的?1、超長的頁面下載時間:如果頁面下載時間超過30秒,很難有用戶會...

文章附圖

網站邏輯層的設計深圳網站建設公司網站邏輯層是三層邏輯體系架構的中間層,處于網站表現層和網站數據層之間,是進行數據交...

文章附圖

網站的兩層體系架構:網站的兩層體系架構有什么好處?在現階段,使用較多的兩層體系架構是基于C/S的。1)基于C/S的...

在線客服
 
 
 聯系方式
熱線:0755-88365670
客服:0755-88367881
電話:13543267002
游戏网址注册免费送彩金 36选7开奖结果2019079 家彩开奖千禧3d试机号开机号 捕鱼达人之深寂海底 皇冠体育博彩源码 福建时时官方网站 七乐彩开奖走势图线 ttg pt登录 辽宁11选5开奖结果手机版 湖北丨丨选5开奖结果 二分钟时时彩开奖结果 上海时时开奖走势 乒乓球比赛实时比分 福建22选5走势图彩票走势图 重庆时时真的存在吗 浙江12选五预测号码