[界面構(gòu)成要素]與傳統(tǒng)媒體不同,網(wǎng)頁(yè)除了文字和圖像以外,還包含聲音、視頻和動(dòng)畫等新興多媒體元素,更借助由代碼語(yǔ)言編程所實(shí)現(xiàn)的各種交互式效果,增加了網(wǎng)頁(yè)界面的生動(dòng)性和復(fù)雜性,也使得網(wǎng)頁(yè)設(shè)計(jì)者需要考慮更多頁(yè)面元素的排布、優(yōu)化。
[文字]文字元素是信息傳達(dá)的主體部分,從網(wǎng)頁(yè)最初的純文字界面發(fā)展至今,文字仍是其他任何元素?zé)o法取代的重要構(gòu)成。這首先是文字信息符合人類的閱讀習(xí)慣,其次因?yàn)槲淖炙即嫒】臻g小,節(jié)省了下載和瀏覽時(shí)間。網(wǎng)頁(yè)中的文字主要包括標(biāo)題、信息、文字鏈接、幾種主要形式。標(biāo)題和傳統(tǒng)媒體中信息傳達(dá)的基本作用相同,是內(nèi)容的簡(jiǎn)概說(shuō)明一般比較醒目、優(yōu)先編排。文字作為占據(jù)頁(yè)面重要比率的元素,同時(shí)又是信息重要載體,它的字體、大小、顏色和排布對(duì)頁(yè)面整體設(shè)計(jì)影響極大,應(yīng)精心處理。
如[圖例 2]是典型的以文字排布為主的網(wǎng)頁(yè)界面。整個(gè)頁(yè)面較少圖形修飾,分類條例清晰,卻并不會(huì)給人單調(diào)感覺,可見文字排布得當(dāng),版面同樣可以生動(dòng)活潑。文字的設(shè)計(jì)編排在某種程度上來(lái)說(shuō),比圖像元素更難把握,以后章節(jié)會(huì)就此具體論述。
[圖形]圖形在網(wǎng)頁(yè)界面中具有重要作用。圖形的出現(xiàn),打破了網(wǎng)頁(yè)初期單純的文字界面,也帶來(lái)了新的直觀表現(xiàn)形式。很多網(wǎng)頁(yè)中,圖形占據(jù)了重要頁(yè)面,有的甚至是全部頁(yè)面。圖形往往能引起人們的注意,并激發(fā)閱讀興趣,圖形給人的視覺印象要優(yōu)于文字,合理的運(yùn)用圖形。可以生動(dòng)直觀、形象地表現(xiàn)設(shè)計(jì)主題。網(wǎng)頁(yè)中常用的圖形格式包括jpg和gif,這兩種格式壓縮比高,得到了規(guī)范瀏覽器的支持,下載速度快,具有跨平臺(tái)的特性,不需要瀏覽器安裝插件即可直接閱覽。圖形元素包括標(biāo)題、背景、主圖、鏈接圖標(biāo)四種。以圖像作為標(biāo)題和鏈接可以使網(wǎng)頁(yè)具有更好的視覺效果,配合文字增強(qiáng)生動(dòng)和形象性。需要特別注意的是背景和主圖的作用。以圖形為背景能襯托主題的表現(xiàn),增加網(wǎng)頁(yè)的層次感,使網(wǎng)頁(yè)不再但點(diǎn)枯燥,融入設(shè)計(jì)者的風(fēng)格。主圖與背景和裝飾性小土不同,背景是襯托主題,主圖則是突出表現(xiàn)主題。主圖是整個(gè)網(wǎng)頁(yè)的視覺中心,它具有直觀性強(qiáng)的特點(diǎn),可以為單調(diào)的文字信息增強(qiáng)活力,不需要象文字那樣去逐句閱讀,可以不受文化水平的限制,能給人強(qiáng)烈的視覺信息。
[頁(yè)面版式]頁(yè)面版式也稱頁(yè)面的構(gòu)圖,版式是網(wǎng)頁(yè)界面設(shè)計(jì)的重要組成部分,它將文字、圖形等視覺元素進(jìn)行組合配置,使頁(yè)面整體視覺效果美觀和諧,便于閱讀,實(shí)現(xiàn)信息傳達(dá)的最佳效果。以下是幾個(gè)成功的版式的例子:[圖例3]頁(yè)面層次感強(qiáng),簡(jiǎn)潔流暢。看似隨意的大處留白正是版式布局的精妙之處。[圖例4]借助圖片對(duì)頁(yè)面的黃金分割,在淡雅的色調(diào)上成功排布了文字信息,整個(gè)頁(yè)面清新素雅,平衡和諧。
[多媒體]網(wǎng)頁(yè)構(gòu)成中的多媒體元素主要包括音頻、視頻和動(dòng)畫。這些是界面構(gòu)成中最吸引人的元素,但是我個(gè)人始終認(rèn)為網(wǎng)頁(yè)應(yīng)該“內(nèi)容為王”,任何技術(shù)的應(yīng)用應(yīng)該以信息的更好傳達(dá)為中心,不能唯視覺化。
[技術(shù)]網(wǎng)頁(yè)的技術(shù)要素并非任何情況下在網(wǎng)頁(yè)中都能直觀體現(xiàn),但是卻代表了設(shè)計(jì)的整體水平,也是衡量設(shè)計(jì)成功的重要標(biāo)準(zhǔn)。網(wǎng)頁(yè)界面設(shè)計(jì)最基本的技術(shù)要求包括:
瀏覽器,應(yīng)該保證成功的設(shè)計(jì)作品在不同的主流瀏覽器下所顯現(xiàn)的頁(yè)面與原設(shè)計(jì)作品一致(主要考慮IE與Netscape)。具體技術(shù)細(xì)節(jié)后面會(huì)有詳細(xì)說(shuō)明...
傳輸速度,界面設(shè)計(jì)的視覺成功,不能以犧牲網(wǎng)頁(yè)下載顯示速度為代價(jià),圖形是網(wǎng)頁(yè)界面中最常見的易造成傳輸速度緩慢的因素,下面是一些網(wǎng)頁(yè)圖形處理的常用原則(技術(shù)細(xì)節(jié)參見圖像優(yōu)化章節(jié)):保證所需清晰度的條件下,盡量壓縮圖形文件大小/采用圖片分割,切割成若干小圖多線程下載/采用盡量少的界面顏色/優(yōu)化版式、表格排布,使主要頁(yè)面框架內(nèi)容先行載入/減少客戶端程序如javascript等的應(yīng)用。
屏幕分辨率,專業(yè)設(shè)計(jì)人員的標(biāo)準(zhǔn)顯示器應(yīng)工作在1024*768模式下,但是必須考慮驗(yàn)證其他較低分辨率下的兼容顯示效果。
顏色顯示,通常顯示設(shè)備的顯示顏色模式主要是256色、32378色(32K)、65536色(64K,16位增強(qiáng)色)、或1677萬(wàn)色(24位真彩色)。16色可以滿足絕大多數(shù)網(wǎng)絡(luò)圖形的顏色要求,如果需要更高精度的圖像文件,應(yīng)該在文件大小和顯示質(zhì)量之間選擇平衡。
[網(wǎng)頁(yè)界面的特征]網(wǎng)頁(yè)界面設(shè)計(jì)需要設(shè)計(jì)師綜合多方面的知識(shí)。他與網(wǎng)絡(luò)藝術(shù)、經(jīng)濟(jì)學(xué)、心理學(xué)及美學(xué)等領(lǐng)域都有著密切的聯(lián)系,界面設(shè)計(jì)的中心是“信息傳達(dá)”這一主題