雷火平台-中国知名电竞赛事平台

聯(lián)系我們 face+ 關(guān)于 服務(wù) 案例
首頁 案例 服務(wù) 關(guān)于 face+

網(wǎng)頁設(shè)計(jì)排版應(yīng)該怎么做? 為你分享方法

Time: 2020-03-17

      網(wǎng)頁設(shè)計(jì)排版應(yīng)該怎么做?對于這個問題,相信不少的朋友們都很想掌握住,接下來就讓我們一起來看看怎么做,便可以讓我們的網(wǎng)頁更加的方便人們閱讀吧,具體方法如下。

  、網(wǎng)站設(shè)計(jì)公司服務(wù)流程

  以下是網(wǎng)站設(shè)計(jì)公司服務(wù)流程:

  1、需求-客戶需求溝通分析 ;

  2、簽約-簽署相關(guān)合同協(xié)議、客戶支付預(yù)付款;

  3、實(shí)施-網(wǎng)站頁面設(shè)計(jì)、制作、程序開發(fā);

  4、驗(yàn)收-網(wǎng)站測試及驗(yàn)收;

  5、維護(hù)-網(wǎng)站后期維護(hù)工作。

  二、網(wǎng)頁設(shè)計(jì)排版應(yīng)該怎么做

  字體和字號這兩個元素必須捏在一起

  字體分為襯線體(serif)與非襯線體(sans serif)。簡單的說,襯線體(serif)就是帶有襯線的字體,筆畫粗細(xì)不同并帶有額外的裝飾,開始和結(jié)尾有明顯的筆觸。常用的英文襯線體有Times New Roman和Georgia,中文即是我們在windows下最常見的中易宋體。

  與襯線體相反,無襯線裝飾,筆畫粗細(xì)無明顯查差異的字體就是非襯線體(sans serif)。Arial、Helvetica、Verdanad都是我們熟悉的英文非襯線體,中文有微軟雅黑和mac下默認(rèn)的中文-華文細(xì)黑。

  在過去,普遍認(rèn)為有筆觸裝飾的襯線體,可提高辨識度和閱讀效率,更適合做為閱讀的字體。多用于報(bào)紙、書籍等印刷品的正文。非襯線體飽滿醒目,常用做標(biāo)題或者用于較短的段落。

11111111111.jpg

  (圖片來自網(wǎng)絡(luò))

  很長一段時間里,在互聯(lián)網(wǎng)上我們會注意這樣的一個現(xiàn)象,國外網(wǎng)站大部分以非襯線體為主,而中文網(wǎng)站基本就是宋體。其實(shí)不難理解,襯線字體筆畫有粗細(xì)之分,很小字的情況下細(xì)筆畫就被弱化,受限于電腦的分辨率,10-12px的襯線字體在顯示器上是相當(dāng)難辨認(rèn)的;同字號的非襯線體筆畫簡潔而飽滿,更適于做網(wǎng)頁字體。windows下,中文宋體小字點(diǎn)陣的特性,12px、14px的字號顯示仍然相當(dāng)清晰美觀,便于閱讀。這也就是為什么大多網(wǎng)頁設(shè)計(jì)制作人員容易機(jī)械性的選用特定字號或英文或中文的字體。

  如今隨著顯示器越來越大,分辨率越來越高,經(jīng)常會覺得看12px的文字有點(diǎn)吃力,做為設(shè)計(jì)師也會不自覺的開始大量使用14px的字體,而且越來越多的網(wǎng)站開始使用15、16px甚至18px以上的字號做正文文字。大字號的使用,對英文字體來講,襯線體的高辨識度和流暢閱讀的優(yōu)勢就體現(xiàn)出來了。微軟雅黑就是微軟在這個字體顯示問題上的解決方案。

  行長

  我們隨手拿起一本書或者一份報(bào)紙,數(shù)一數(shù)每行的文字,一般情況下都不會超過40個漢字。這是因?yàn)槿绻啃形淖诌^長,讀者會不停的轉(zhuǎn)動脖子,感到疲憊的同時也會降低閱讀效率;目光從行尾移至下一行首,也很容易串行,影響讀者瀏覽文章的節(jié)奏。這點(diǎn)同樣適用于網(wǎng)頁上的文章閱讀。由于顯示器是橫向的,我們更要注意劃分閱讀區(qū)域。

  文本寬度控制在450-700px為宜,此范圍內(nèi)參照字號大小;

  英文每行80-100個字母(空格算一個字母)為宜;

  中文每行30-40個漢字為宜。

  間距

  通過設(shè)置間距,我們就可以控制文字的密度。如果每行間距太小,與文字過長一樣,讀者瀏覽文章時也容易串行;如果行距過寬,閱讀時就會感覺文章不夠連貫。

  間距沒有固定的值,通常是根據(jù)字體大小來定義的。在word里我們??吹诫p倍行距、單倍行距和1.5倍行距的選項(xiàng)。網(wǎng)頁上行距的單位常用em來表示,不管是中文網(wǎng)站還是英文網(wǎng)站,大家多喜歡用1.5em-1.8em的行距。以1.6em的行距為例,字號16px的字,行距就是25.6px。

  關(guān)于段距,我們要考慮一下具體實(shí)際情況。比如文章篇幅較短,就不需要很寬的段距;二文章篇幅很長,特別是那些偏學(xué)術(shù)的比較枯燥的文章,就要多利用段距把握文章的節(jié)奏,給閱讀者喘息和思考的機(jī)會,且使文章更有層次和可讀性。

22222222222222.jpg

  (圖片來自網(wǎng)絡(luò))

  網(wǎng)頁設(shè)計(jì)排版應(yīng)該怎么做?以上就是我們?yōu)榇蠹曳窒淼膸c(diǎn)內(nèi)容,大家是不是都掌握的差不多了呢?希望上面的內(nèi)容可以讓大家的網(wǎng)頁獲得更多的人氣。


合作咨詢

上海(總部)

上海市浦東新區(qū)郭守敬路498號22號樓
021-61057328
service@faceui.com

辦公地址地圖

北京

北京市東城區(qū)后永康17號A座
010-64015620
service@faceui.com

辦公地址地圖

成都

四川省成都市錦江區(qū)東大街牛王廟段100號
028-62790929
service@faceui.com

辦公地址地圖
首頁 | 案例 | 服務(wù) | 關(guān)于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號-5

上海辦公地點(diǎn)地圖
北京辦公地點(diǎn)地圖
深圳辦公地點(diǎn)地圖
在微信中搜索faceui
或保存二維碼在微信中打開