淺析網(wǎng)頁(yè)設(shè)計(jì)中的文字編排與版式設(shè)計(jì)發(fā)布者：本站 時(shí)間：2020-05-02 14:05:20
本文主要圍繞網(wǎng)頁(yè)設(shè)計(jì)中的視覺(jué)設(shè)計(jì)談對(duì)網(wǎng)頁(yè)設(shè)計(jì)的設(shè)計(jì)理念和方法。通過(guò)對(duì)網(wǎng)頁(yè)設(shè)計(jì)的中的視聽(tīng)元素和版式設(shè)計(jì)的分析，找到網(wǎng)頁(yè)設(shè)計(jì)的特點(diǎn)、布局的設(shè)計(jì)理念和設(shè)計(jì)風(fēng)格。
網(wǎng)頁(yè)設(shè)計(jì)，以圖形用戶界面設(shè)計(jì)和交互設(shè)計(jì)為特點(diǎn)的設(shè)計(jì)系統(tǒng)，網(wǎng)頁(yè)的輸出端主要是電腦端和移動(dòng)終端。網(wǎng)頁(yè)的藝術(shù)設(shè)計(jì)內(nèi)容，可以劃分為兩大類(lèi)：多媒體設(shè)計(jì)元素及版式設(shè)計(jì)。在分析研究這兩向內(nèi)容的基礎(chǔ)上探索網(wǎng)頁(yè)設(shè)計(jì)的方法和規(guī)律。網(wǎng)頁(yè)設(shè)計(jì)中的多媒體設(shè)計(jì)元素主要包括：圖標(biāo)、圖像、表格、色彩、導(dǎo)航、音樂(lè)、視頻影像、背景、交互按鈕、文本信息、鏈接等。所謂網(wǎng)頁(yè)的版式設(shè)計(jì)，是在有限的屏幕空間上將視聽(tīng)多媒體元素進(jìn)行有機(jī)的排列組合，它在傳達(dá)信息的同時(shí)，也產(chǎn)生感官上的美感和精神上的享受。
一、網(wǎng)頁(yè)設(shè)計(jì)中的文字編排
(一)文字段落編排——網(wǎng)頁(yè)中的字體
網(wǎng)頁(yè)中行距、字距的合理安排可以使用戶在瀏覽時(shí)更為清晰迅速的查找信息，文字字體、字號(hào)所形成的節(jié)奏和美感也是設(shè)計(jì)時(shí)要考慮的因素。因?yàn)槠聊粸g覽的特性，正文的中文字體一般最常選用宋體和黑體，也可選用等線體、細(xì)圓體等清秀端莊的字體。選擇有襯線體要比較慎重，字號(hào)較小的情況下會(huì)產(chǎn)生視覺(jué)錯(cuò)視，就好像字體周?chē)心：南袼攸c(diǎn)，影響用戶閱讀。襯線字體因?yàn)樵诠P畫(huà)的起落處具有裝飾線腳，在屏幕端顯示效果不是那么的好。在網(wǎng)頁(yè)界面設(shè)計(jì)中，襯線字體可以適當(dāng)?shù)膽?yīng)用在標(biāo)題字的設(shè)計(jì)中，讓標(biāo)題更具有美感。
(二)文字段落編排——CSS樣式設(shè)計(jì)
篇、章頁(yè)字體注意變化，按照章節(jié)層次字號(hào)大小按一定的順序選定。使讀者閱讀起來(lái)感到結(jié)構(gòu)分明、條理清楚。每個(gè)層次不同的字體在統(tǒng)一中不乏變化，豐富視覺(jué)意味。在網(wǎng)頁(yè)制作時(shí)采用CSS技術(shù)，可以有效地對(duì)頁(yè)面的布局、字體、顏色、背景和其它效果實(shí)現(xiàn)更加精確的控制。
二、網(wǎng)頁(yè)中的版式設(shè)計(jì)
(一)版式設(shè)計(jì)綜述
第一頁(yè)(首頁(yè))的版式以及下級(jí)頁(yè)面的安排上基本上是從一而終，統(tǒng)一在一種格調(diào)中，這樣才能構(gòu)成閱讀時(shí)的順暢，形成界面整體的風(fēng)格。層級(jí)頁(yè)面，統(tǒng)一并不代表一成不變，統(tǒng)一中尋求變化，如果一個(gè)網(wǎng)站有較為復(fù)雜的層級(jí)頁(yè)面，怎樣拓展設(shè)計(jì)是關(guān)鍵。還要注意的是要根據(jù)站點(diǎn)地圖規(guī)劃好不同內(nèi)容頁(yè)面的區(qū)分。(比如用顏色區(qū)分，用文字版面的不同區(qū)分，用動(dòng)靜區(qū)分等等)。
(二)網(wǎng)頁(yè)色彩的搭配
色彩代表了不同的情感，有著不同的象征含義。網(wǎng)頁(yè)配色中，忌諱的是：(1)一個(gè)網(wǎng)站中的色彩不要過(guò)于混亂，根據(jù)網(wǎng)站的主題內(nèi)容定義色彩體系，在統(tǒng)一中找對(duì)比。(體系化)。(2)背景和文本信息的對(duì)比盡量要大，不要用繁復(fù)的圖案圖形作背景，以免影響到文字的識(shí)別性。
(三)網(wǎng)頁(yè)中的布局理念——功能優(yōu)先原則
網(wǎng)頁(yè)布局大致可分為國(guó)字型、左右布局及上下布局型、大背景封面型等。國(guó)字型是一些門(mén)戶類(lèi)網(wǎng)站常見(jiàn)的布局方式，上面是網(wǎng)站的主導(dǎo)航及搜索區(qū)塊，通欄的滾動(dòng)廣告欄，中部是網(wǎng)站當(dāng)前頁(yè)面的主要內(nèi)容，左側(cè)通常會(huì)放置二級(jí)導(dǎo)航欄，右側(cè)會(huì)放一些超鏈接或者其他功能模塊，最下面是網(wǎng)站的一些基本信息、聯(lián)系方式、版權(quán)聲明等，這種結(jié)構(gòu)是我們?cè)诰W(wǎng)上見(jiàn)到的差不多最多的一種結(jié)構(gòu)類(lèi)型。左右布局及上下布局：左右布局是以左右為分別兩頁(yè)的框架結(jié)構(gòu)，一般左面是導(dǎo)航鏈接，右面是當(dāng)前頁(yè)面內(nèi)容區(qū)。有一些企業(yè)網(wǎng)站喜歡用這種布局設(shè)計(jì)，我們見(jiàn)到的大部分的大型論壇都是這種結(jié)構(gòu)的。這種類(lèi)型結(jié)構(gòu)非常清晰，檢索方便，層級(jí)結(jié)構(gòu)清晰有條理。上下布局是以左右為分別兩頁(yè)的框架結(jié)構(gòu)，一般上面是導(dǎo)航鏈接，下面是當(dāng)前頁(yè)面內(nèi)容區(qū)。大背景封面型：這種類(lèi)型基本上是出現(xiàn)在一些網(wǎng)站的首頁(yè)，大背景能夠更好地渲染餓網(wǎng)站的氣氛，具有很好地沉浸感，這種類(lèi)型的首頁(yè)使用的比較多，適合首頁(yè)內(nèi)容容量較少的頁(yè)面。那么什么樣的布局是最好的，要具體情況具體分析：(1)國(guó)字型適合網(wǎng)站信息比較多，頁(yè)面容量較大的門(mén)戶類(lèi)網(wǎng)站。(2)左右布局及上下布局型是比較常見(jiàn)的網(wǎng)站布局模式，但容量相對(duì)于國(guó)字形要少一些，但布局合理便于瀏覽。(3)大背景封面型比較適合展示企業(yè)形象或這信息較少的極具個(gè)性化的個(gè)人主頁(yè)。在這種類(lèi)型中合理的加入交互動(dòng)態(tài)型可以達(dá)到很好的用戶體驗(yàn)，好的交互大大豐富了網(wǎng)頁(yè)，但是它不能表達(dá)過(guò)多的文字信息。但動(dòng)態(tài)及視頻較多的網(wǎng)站也有更新比較麻煩，加載比較慢也的缺點(diǎn)，我覺(jué)得可以在頁(yè)面中局部使用交互動(dòng)畫(huà)增加界面的沉浸感。
對(duì)用戶來(lái)說(shuō)，網(wǎng)頁(yè)設(shè)計(jì)的目標(biāo)是帶來(lái)“成功且令人滿意的體驗(yàn)”，成功就是指用戶能高效的完成任務(wù)，令人滿意是指這一過(guò)程是愉快的，而不僅僅是滿足功能性需求，這種愉快可以表現(xiàn)為視覺(jué)上的愉悅，審美的享受。
選擇我們，優(yōu)質(zhì)服務(wù)，不容錯(cuò)過(guò)
1. 優(yōu)秀的網(wǎng)絡(luò)資源，強(qiáng)大的網(wǎng)站優(yōu)化技術(shù)，穩(wěn)定的網(wǎng)站和速度保證
2. 15年上海網(wǎng)站建設(shè)經(jīng)驗(yàn)，優(yōu)秀的技術(shù)和設(shè)計(jì)水平，更放心
3. 全程省心服務(wù)，不必?fù)?dān)心自己不懂網(wǎng)絡(luò)，更省心。
------------------------------------------------------------
24小時(shí)聯(lián)系電話：021-58370032