現(xiàn)在,在一般人的眼中,"網(wǎng)站"幾乎就代表著"互聯(lián)網(wǎng)",網(wǎng)站本身的價(jià)值正在被人們不斷的發(fā)現(xiàn),不斷的認(rèn)可,"如何設(shè)計(jì)一個(gè)成功的網(wǎng)站?"是現(xiàn)在越來越多的網(wǎng)頁設(shè)計(jì)人員所一直思考、關(guān)注的問題。設(shè)計(jì)網(wǎng)站需要考慮的因素非常之多,從前期的網(wǎng)站開始時(shí)的定位、設(shè)定網(wǎng)站框架、整理資料,到具體制作中的設(shè)計(jì)環(huán)節(jié),再到*的調(diào)試、發(fā)布、宣傳過程這是一個(gè)環(huán)環(huán)相扣的過程。
一、 網(wǎng)站的整體風(fēng)格和創(chuàng)意設(shè)計(jì)
網(wǎng)站的整體風(fēng)格及其創(chuàng)意設(shè)計(jì)是最難的。難就難在沒有一個(gè)固定的程式可以參照和模仿。給你一個(gè)主題,任何兩人都不可能設(shè)計(jì)出完全一樣的網(wǎng)站。
(一)、風(fēng)格是什么,如何樹立網(wǎng)站風(fēng)格?
風(fēng)格(style)是抽象的。是指站點(diǎn)的整體形象給瀏覽者的綜合感受。這個(gè)“整體形象”包括站點(diǎn)的CI(標(biāo)志,色彩,字體,標(biāo)語),版面布局,瀏覽方式,交互性,文字,語氣,內(nèi)容價(jià)值,存在意義,站點(diǎn)榮譽(yù)等等諸多因素。舉個(gè)例子:我們覺得網(wǎng)易是平易近人的,迪斯尼是生動(dòng)活潑的,IBM是專業(yè)嚴(yán)肅的。這些都是網(wǎng)站給人們留下的不同感受。
風(fēng)格是獨(dú)特的,是站點(diǎn)不同與其他網(wǎng)站的地方?;蛘呱?,或者技術(shù),或者是交互方式,能讓瀏覽者明確分辨出這是你的網(wǎng)站獨(dú)有的。
風(fēng)格是有人性的。通過網(wǎng)站的外表,內(nèi)容,文字,交流可以概括出一個(gè)站點(diǎn)的個(gè)性,情緒。風(fēng)格的形成不是一次定位的,你可以在實(shí)踐中不斷強(qiáng)化,調(diào)整,修飾,直到有一天,網(wǎng)友們寫信告訴你:"我喜歡你的站點(diǎn),因?yàn)樗苡酗L(fēng)格!"
(二)、創(chuàng)意是什么,如何產(chǎn)生創(chuàng)意?
創(chuàng)意(idea)是網(wǎng)站生存的關(guān)鍵。這一點(diǎn)相信大家都已經(jīng)認(rèn)同。然而作為網(wǎng)頁設(shè)計(jì)師, 最苦惱的就是沒有好的創(chuàng)意來源。
創(chuàng)意到底是什么,如何產(chǎn)生創(chuàng)意呢?
創(chuàng)意是引人入勝,精彩萬分,出奇不意的;創(chuàng)意是捕捉出來的點(diǎn)子,是創(chuàng)作出來的奇招....這些講法都說出了創(chuàng)意的一些特點(diǎn)
根據(jù)美國(guó)廣告學(xué)教授詹姆斯的研究,創(chuàng)意思考的過程分五階段:
1.準(zhǔn)備期--研究所搜集的資料,根據(jù)舊經(jīng)驗(yàn),啟發(fā)新創(chuàng)意;
2.孵化期--將資料咀嚼消化,使意識(shí)自由發(fā)展,任意結(jié)合;
3.啟示期--意識(shí)發(fā)展并結(jié)合,產(chǎn)生創(chuàng)意;
4.驗(yàn)證期--將產(chǎn)生的創(chuàng)意討論修正;
5.形成期--設(shè)計(jì)制作網(wǎng)頁,將創(chuàng)意具體化。
需要一提的是:創(chuàng)意的目的是更好的宣傳推廣網(wǎng)站。如果創(chuàng)意很好,卻對(duì)網(wǎng)站發(fā)展毫無意義,那么,我們寧可放棄這個(gè)創(chuàng)意!
二、主頁的藝術(shù)處理
主頁的設(shè)計(jì)主要是網(wǎng)頁設(shè)計(jì)軟件的操作與技術(shù)應(yīng)用的問題。但是,要使主頁設(shè)計(jì)、制作得漂亮,必然離不開對(duì)主頁進(jìn)行藝術(shù)的加工和處理,這就要涉及到美術(shù)的一些基本常識(shí)。
(一)、風(fēng)格定位
主頁的美化首先要考慮風(fēng)格的定位。任何主頁都要根據(jù)主題的內(nèi)容決定其風(fēng)格與形式,因?yàn)橹挥行问脚c內(nèi)容的完美統(tǒng)一,才能達(dá)到理想的宣傳效果。目前主頁的應(yīng)用范圍日益擴(kuò)大,幾乎包括了所有的行業(yè),但歸納起來大體有這么幾個(gè)大類:新聞機(jī)構(gòu)、*機(jī)關(guān)、科教文化、娛樂藝術(shù)、電子商務(wù)、網(wǎng)絡(luò)中心等。對(duì)于不同性質(zhì)的行業(yè),應(yīng)體現(xiàn)出不同的主頁風(fēng)格。例如:**的主頁風(fēng)格一般應(yīng)比較莊重,而娛樂行業(yè)則可以活潑生動(dòng)一些;文化教育*的主頁風(fēng)格應(yīng)該高雅大方,而商務(wù)主頁則可以貼近民俗,使大眾喜聞樂見。
主頁風(fēng)格的形成主要依賴于主頁的版式設(shè)計(jì),依賴于頁面的色調(diào)處理,還有圖片與文字的組合形式等。這些問題看似簡(jiǎn)單,但往往需要主頁的設(shè)計(jì)和制作者具有一定的美術(shù)素質(zhì)和修養(yǎng)。
還有,動(dòng)畫效果也不宜在主頁設(shè)計(jì)中濫用,特別是一些內(nèi)容比較嚴(yán)肅的主頁。主頁畢竟主要依靠文字和圖片來傳播信息,它不是動(dòng)畫片,更不是電視或電影。
(二)、版面編排
主頁的設(shè)計(jì)首先涉及到的是頁面的版面編排問題。主頁作為一種版面,既有文字,又有圖片。文字有大有小,還有標(biāo)題和正文之分;圖片也有大小,而且有橫有豎之別。圖片和文字都需要同時(shí)展示給觀眾,總不能簡(jiǎn)單地羅列在一個(gè)頁面上,這樣往往會(huì)搞得雜亂無章。因此必須根據(jù)內(nèi)容的需要,將這些圖片和文字按照一定的次序進(jìn)行合理的編排和布局,使它們組成一個(gè)有機(jī)的整體,展現(xiàn)給廣大的觀眾??梢砸罁?jù)如下幾條來做:
1.主次分明,中心突出。在一個(gè)頁面上,必然考慮視覺的中心,這個(gè)中心一般在屏幕的中央,或者在中間偏上的部位。因此,一些重要的文章和圖片一般可以安排在這個(gè)部位,在視覺中心以外的地方就可以安排那些稍微次要的內(nèi)容,這樣在頁面上就突出了重點(diǎn),做到了主次有別。
2.大小搭配,相互呼應(yīng)。較長(zhǎng)的文章或標(biāo)題,不要編排在一起,要有一定的距離,同樣,較短的文章,也不能編排在一起。對(duì)待圖片的安排也是這樣,要互相錯(cuò)開,造成大小之間有一定的間隔,這樣可以使頁面錯(cuò)落有致,避免重心的偏離。
3.圖文并茂,相得益彰。文字和圖片具有一種相互補(bǔ)充的視覺關(guān)系,頁面上文字太多,就顯得沉悶,缺乏生氣。頁面上圖片太多,缺少文字,必然就會(huì)減少頁面的信息容量。因此,最理想的效果是文字與圖片的密切配合,互為襯托,既能活躍頁面,又使主頁有豐富的內(nèi)容。
(三)、線條和形狀
文字、標(biāo)題、圖片等的組合,會(huì)在頁面上形成各種各樣的線條和形狀。這些線條與形狀的組合,構(gòu)成了主頁的總體藝術(shù)效果。必須注意藝術(shù)地搭配好這些線條和形狀,才能增強(qiáng)頁面的藝術(shù)魅力。
1.直線(矩形)的應(yīng)用。直線條的藝術(shù)效果是流暢、挺拔、規(guī)矩、整齊,所謂有輪有廓。直線和矩形在頁面上的重復(fù)組合可以呈現(xiàn)井井有條、涇渭分明的視覺效果。一般應(yīng)用于比較莊重、嚴(yán)肅的主頁題材。
2.曲線(弧形)的應(yīng)用。曲線的效果是流動(dòng)、活躍,具有動(dòng)感。曲線和弧形在頁面上的重復(fù)組合可以呈現(xiàn)流暢、輕快,富有活力的視覺效果。一般應(yīng)用于青春、活潑的主頁題材。
3.曲、直線(矩形、弧形)的綜合應(yīng)用。把以上兩種線條和形狀結(jié)合起來運(yùn)用,可以大大豐富主頁的表現(xiàn)力,使頁面呈現(xiàn)更加豐富多彩的藝術(shù)效果。這種形式的主頁,適應(yīng)的范圍更大,各種主題的主頁都可以應(yīng)用。
(四)、色彩處理
色彩是人的視覺最敏感的東西。主頁的色彩處理得好,可以錦上添花,達(dá)到事半功倍的效果。色彩總的應(yīng)用原則應(yīng)該是“總體協(xié)調(diào),局部對(duì)比”,也就是:主頁的整體色彩效果應(yīng)該是和諧的,只有局部的、小范圍的地方可以有一些強(qiáng)烈色彩的對(duì)比。在色彩的運(yùn)用上,可以根據(jù)主頁內(nèi)容的需要,分別采用不同的主色調(diào)。因?yàn)樯示哂邢笳餍?,例如:嫩綠色、翠綠色、金黃色、灰褐色就可以分別象征著春、夏、秋、冬。其次還有職業(yè)的標(biāo)志色,例如:軍警的橄欖綠,醫(yī)療衛(wèi)生的白色等。色彩還具有明顯的心理感覺,例如冷、暖的感覺,進(jìn)、退的效果等。充分運(yùn)用色彩的這些特性,可以使我們的主頁具有深刻的藝術(shù)內(nèi)涵,從而提升主頁的文化品位。
*,還要考慮主頁底色(背景色)的深、淺。有些主頁,底色是黑的,但文字也選用了較深的色彩,由于色彩的明度比較接近,讀者在閱覽時(shí),眼睛就會(huì)感覺很吃力,影響了閱讀效果。當(dāng)然,色彩的明度也不能變化太大,否則屏幕上的亮度反差太強(qiáng),同樣也會(huì)使讀者的眼睛受不了。
三、網(wǎng)頁的色彩
網(wǎng)頁的色彩是樹立網(wǎng)站形象的關(guān)鍵之一,色彩搭配卻是網(wǎng)友們感到頭疼的問題。網(wǎng)頁的背景,文字,圖標(biāo),邊框,超鏈接...,應(yīng)該采用什么樣的色彩,應(yīng)該搭配什么色彩才能*的表達(dá)出預(yù)想的內(nèi)涵呢?
網(wǎng)頁制作用彩色還是非彩色好呢?根據(jù)專業(yè)的研究機(jī)構(gòu)研究表明:彩色的記憶效果是黑白的3.5倍。也就是說,在一般情況下,彩色頁面較完全黑白頁面更加吸引人。
我們通常的做法是:主要內(nèi)容文字用非彩色(黑色),邊框,背景,圖片用彩色。這樣頁面整體不單調(diào),看主要內(nèi)容也不會(huì)眼花。
非彩色的搭配: 黑白是最基本和最簡(jiǎn)單的搭配,白字黑底,黑底白字都非常清晰明了?;疑侨f能色,可以和任何彩色搭配,也可以幫助兩種對(duì)立的色彩和諧過渡。如果你實(shí)在找不出合適的色彩,那么用灰色試試,效果絕對(duì)不會(huì)太差。
(一)、色彩的心理感覺。
不同的顏色會(huì)給瀏覽者不同的心理感受。
紅色---是一種激奮的色彩。刺激效果,能使人產(chǎn)生沖動(dòng),憤怒,熱情,活力的感覺。
綠色---介于冷暖兩中色彩的中間,顯得和睦,寧?kù)o,健康,安全的感覺。 它和金黃,淡白搭配,可以產(chǎn)生優(yōu)雅,舒適的氣氛。
橙色---也是一種激奮的色彩,具有輕快,歡欣,熱烈,溫馨,時(shí)尚的效果。
黃色---具有快樂,希望,智慧和輕快的個(gè)性,它的明度*。
藍(lán)色---是*涼爽,清新,專業(yè)的色彩。它和白色混合,能體現(xiàn)柔順,淡雅,浪漫的氣氛(象天空的色彩:)
白色---具有潔白,明快,純真,清潔的感受。
黑色---具有深沉,神秘,寂靜,悲哀,壓抑的感受。
灰色---具有中庸,平凡,溫和,謙讓,中立和高雅的感覺。
每種色彩在飽和度,透明度上略微變化就會(huì)產(chǎn)生不同的感覺。以綠色為例,黃綠色有青春,旺盛的視覺意境,而藍(lán)綠色則顯得幽寧,陰深。
(二)、網(wǎng)頁色彩搭配的原理
1.色彩的鮮明性。網(wǎng)頁的色彩要鮮艷,容易引人注目。
2.色彩的獨(dú)特性。要有與眾不同的色彩,使得大家對(duì)你的印象強(qiáng)烈。
3.色彩的合適性。就是說色彩和你表達(dá)的內(nèi)容氣氛相適合。如用粉色體現(xiàn)女性站點(diǎn)的柔性。
4.色彩的聯(lián)想性。不同色彩會(huì)產(chǎn)生不同的聯(lián)想,藍(lán)色想到天空,黑色想到黑夜,紅色想到喜事等,選擇色彩要和你網(wǎng)頁的內(nèi)涵相關(guān)聯(lián)。
(三)、網(wǎng)頁色彩掌握的過程
隨著網(wǎng)頁制作經(jīng)驗(yàn)的積累,我們用色有這樣的一個(gè)趨勢(shì):單色->五彩繽紛->標(biāo)準(zhǔn)色->單色。一開始因?yàn)榧夹g(shù)和知識(shí)缺乏,只能制作出簡(jiǎn)單的網(wǎng)頁,色彩單一;在有一定基礎(chǔ)和材料后,希望制作一個(gè)漂亮的網(wǎng)頁,將自己收集的*的圖片,最滿意色彩堆砌在頁面上;但是時(shí)間一長(zhǎng),卻發(fā)現(xiàn)色彩雜亂,沒有個(gè)性和風(fēng)格;第三次重新定位自己的網(wǎng)站,選擇好切合自己的色彩,推出的站點(diǎn)往往比較成功;當(dāng)*設(shè)計(jì)理念和技術(shù)達(dá)到頂峰時(shí),則又返樸歸真,用單一色彩甚至非彩色就可以設(shè)計(jì)出簡(jiǎn)潔精美的站點(diǎn)。
(四)、網(wǎng)頁色彩搭配的技巧
1.用一種色彩。這里是指先選定一種色彩,然后調(diào)整透明度或者飽和度,(說得通俗些就是將 色彩變淡或則加深),產(chǎn)生新的色彩,用于網(wǎng)頁。這樣的頁面看起來色彩統(tǒng)一,有層次感。
2.用兩種色彩。先選定一種色彩,然后選擇它的對(duì)比色,整個(gè)頁面色彩豐富但不花稍。
3.用一個(gè)色系。簡(jiǎn)單的說就是用一個(gè)感覺的色彩,例如淡藍(lán),淡黃,淡綠;或者土黃,土灰,土藍(lán)。確定色彩的方法各人不同,
4.用黑色和一種彩色。比如大紅的字體配黑色的邊框感覺很"跳"。
注意在網(wǎng)頁配色中,忌諱的是:
1.不要將所有顏色都用到,盡量控制在三種色彩以內(nèi)。
2.背景和前文的對(duì)比盡量要大,(絕對(duì)不要用花紋繁復(fù)的圖案作背景),以便突出主要文字內(nèi)容。
四、設(shè)計(jì)網(wǎng)站的標(biāo)志(logo)
一個(gè)網(wǎng)站的標(biāo)志(logo)。就如同商標(biāo)一樣,logo是你站點(diǎn)特色和內(nèi)涵的集中體現(xiàn),看見logo就讓大家聯(lián)想起你的站點(diǎn)。標(biāo)志可以是中文,英文字母,可以是符號(hào),圖案,可以是動(dòng)物或者人物等等。比如:soim是用soim的英文作為標(biāo)志,新浪用字母sina+眼睛作為標(biāo)志。標(biāo)志的設(shè)計(jì)創(chuàng)意來自你網(wǎng)站的名稱和內(nèi)容。
(1).網(wǎng)站有代表性的人物,動(dòng)物,花草,可以用它們作為設(shè)計(jì)的藍(lán)本,加以卡通化和藝術(shù)化,例如迪斯尼的米老鼠,搜狐的卡通狐貍,鯊?fù)w壇的籃球鯊魚。
(2).網(wǎng)站有專業(yè)性的,可以以本專業(yè)有代表的物品作為標(biāo)志。比如*銀行的銅板標(biāo)志,奔馳汽車的方向盤標(biāo)志。
(3).最常用和最簡(jiǎn)單的方式是用自己網(wǎng)站的英文名稱作標(biāo)志。采用不同的字體,字母的變形,字母的組合可以很容易制作好自己的標(biāo)志。
五、網(wǎng)頁設(shè)計(jì)人員的風(fēng)格
作為一個(gè)在網(wǎng)絡(luò)環(huán)境下的設(shè)計(jì)人員應(yīng)該怎樣利用自己的設(shè)計(jì)來滿足人們的需求,迎合他們的要求,同時(shí)如何保持自己的風(fēng)格,使自己真正作為一個(gè)倡導(dǎo)潮流的人。
網(wǎng)頁人員的風(fēng)格就是在運(yùn)用自己的所擁有的手段,包括所擁有的審美的素質(zhì)、應(yīng)用軟件的能力、以及感受生活的敏銳的覺察力,來建立起自己獨(dú)特的設(shè)計(jì)形式、獨(dú)特的作風(fēng)。首先來說他的這種風(fēng)格不能背離人們的現(xiàn)實(shí)太遠(yuǎn),這個(gè)現(xiàn)實(shí)就是人們習(xí)慣了的網(wǎng)頁的布局,雖然可能經(jīng)過長(zhǎng)期的努力可能會(huì)使這種局面得以改觀,但是在目前的情況下如果一味的求自己的風(fēng)格就會(huì)嚴(yán)重的脫離用戶要一步一步的將自己的風(fēng)格反映出來,不能脫離人們的現(xiàn)實(shí)太遠(yuǎn)。當(dāng)然由于自己的習(xí)慣、修養(yǎng)以及其它的因素的作用,這個(gè)風(fēng)格體現(xiàn)的方式大相徑庭
享譽(yù)世界的德國(guó)廣告設(shè)計(jì)大師岡特`蘭堡說過“一名設(shè)計(jì)師的作品停在一個(gè)水平及風(fēng)格上不變化,那就是死亡”。平面設(shè)計(jì)如此,在網(wǎng)頁設(shè)計(jì)上同樣如此, 一個(gè)網(wǎng)頁設(shè)計(jì)師沒有自己的風(fēng)格是很可悲的,因?yàn)檫@樣他永遠(yuǎn)就只能是在一個(gè)低水平的層次上徘徊,或者只是拾人牙慧。永遠(yuǎn)都沒有自己的東西融入到網(wǎng)頁設(shè)計(jì)中,成就不了好的成績(jī),只有在不斷的探索和實(shí)踐中總結(jié)經(jīng)驗(yàn),提高自己的同時(shí)樹立起自己的獨(dú)特的設(shè)計(jì)理念,才能夠形成自己的風(fēng)格,開辟出網(wǎng)頁設(shè)計(jì)的新天地。同時(shí)也要不斷的在形成自己的風(fēng)格的同時(shí),嘗試一些不同的風(fēng)格,尋求突破,“不破不立”,只有不斷的嘗試,因?yàn)橹挥胁粩嗟呢S富自己的同時(shí),才有機(jī)會(huì)贏得這種嘗試的成功。經(jīng)常有意識(shí)的這樣去實(shí)踐,就有可能達(dá)到自己的設(shè)計(jì)的新境界!