網站設計的技巧

網站設計的技巧

　　首先我(wǒ)(wǒ)們需要了解一(yī)下(xià)網站的頁面組成，網站一(yī)般包括以下(xià)幾部分(fēn)：
　　首頁：網站的門面，如同公司的形象，特别注重設計和規劃。
　　框架頁：網站的主要結構頁面，又(yòu)稱次首頁、内頁，大(dà)型網站往往框架頁即首頁，如一(yī)些門戶網站。框架頁主要是網站内部主要欄目的首頁，講究風格的一(yī)緻性，并于主頁呼應。
　　普通頁：網站主要的承載信息的頁面，設計要求不高，但要求鏈接準确、文字無誤、圖文并茂，并沿襲網頁的風格。
　　彈出頁：一(yī)般用于廣告、新聞、消息、到其他網站的鏈接等等，一(yī)般用的很少。

　　通過上面的分(fēn)析，我(wǒ)(wǒ)們可以看出：
　　從功能上來看，首頁主要承擔着樹(shù)立企業形象（當然不僅僅是首頁）的作用，框架頁在導航方面起着重要的作用，比如各欄目内部主要内容的介紹，都可以在框架頁中(zhōng)體(tǐ)現再進入普通頁，讓浏覽者能夠迅速了解網站各欄目的主要内容，擇其需要而浏覽，而普通頁則是主要的信息頁面，也是網站的最終頁面，對于大(dà)型網站，這種結構非常重要，而對于中(zhōng)小(xiǎo)型企業，網站規模較小(xiǎo)、頁面數量不多，有時框架頁就起着普通頁的作用，至于彈出頁，建議您不是必要，最好不要用。下(xià)面詳細介紹各頁面的設計技巧：

　　一(yī)、首頁設計技巧
　　網站首頁是企業網上的虛拟門面，在此，提醒上網的企業注意自己門面的設計，決不能敷衍了事、馬馬虎虎。我(wǒ)(wǒ)們會經常看到印刷精美的産品目錄或廣告，當您屢屢看到那些印有産品目錄或廣告的精美印刷制品的時候，相信您或多或少會對有關的産品形成一(yī)種好感，即使您不會購買，也必然對這些産品形成一(yī)定程度的認同。而對于設計毛糙的宣傳品，您肯定會懷疑其内容的真實性，從而對其産品或服務産生(shēng)質疑。好，現在說說網站的設計，相信您會同意這種說法：網站的頁面就好比是“無紙(zhǐ)的印刷品”。既然如此，我(wǒ)(wǒ)們會因此而得出一(yī)個結論：精良和專業網站的設計，如同制作精美的印刷品，會大(dà)大(dà)刺激消費(fèi)者（訪問者）的購買欲望，反之，您公司所提供的産品或服務将不會給消費(fèi)者（訪問者）留下(xià)較好的印象。值得一(yī)提的是，除非您的企業有專業的網站規劃、設計人員(yuán)，否則您最好找專業公司或專業人員(yuán)爲您設計制作，一(yī)個優秀的專業設計人員(yuán)會很快明白(bái)您的意圖，并根據您的建站目的提出建設性的意見。
　　 一(yī)般來說，網站首頁的形式不外(wài)乎有兩種，一(yī)種是純粹的形象展示型，這種類型文字信息較少，圖像信息較多，通過藝術造型和設計布局，利用一(yī)系列與公司形象和産品、服務有關的圖像、文字信息，組成一(yī)幅生(shēng)動的畫面，向浏覽者展示一(yī)種形象、一(yī)個氛圍，從而吸引浏覽者進入浏覽。這需要設計者具有良好的設計基礎和審美能力，能夠努力挖掘企業深層的内涵，展示企業文化。這種類型的首頁在設計過程中(zhōng)一(yī)定要明确要以設計爲主導，通過色彩、布局給訪問者留下(xià)深刻的印象，當然，我(wǒ)(wǒ)們不能爲了設計而設計，我(wǒ)(wǒ)們的目的是營銷，在設計過程中(zhōng)一(yī)定要牢記這一(yī)點！
　　 另一(yī)種是信息羅列型，一(yī)般的大(dà)、中(zhōng)型企業網站和門戶網站常用的方式，即在首頁中(zhōng)就羅列出網站的主要内容分(fēn)類、重點信息、網站導航、公司信息等等，也就是我(wǒ)(wǒ)們上面談到的框架頁，這種風格比較适合網站信息量大(dà)，内容豐富的網站，因爲是以展示信息爲主，這是的設計就要在細微之處體(tǐ)現企業形象，建議設計人員(yuán)最好仔細閱讀企業的ＣＩ手冊，熟悉企業标志(zhì)、吉祥物(wù)、字體(tǐ)及用色标準，在網站的局部體(tǐ)現出來，往往平淡之中(zhōng)一(yī)個優美的符合企業特點的曲線就能夠給人以深刻的印象，從而将企業形象印在浏覽者的腦海裏。設計人員(yuán)在設計過程中(zhōng)要注意使用這些語言符号來表達一(yī)種獨特的企業信息。

　　二、風格保持一(yī)緻—内頁設計技巧
　　如何保持網站風格的一(yī)緻，是進行内頁設計過程中(zhōng)考慮的重要方面，根據我(wǒ)(wǒ)的經驗，您可以嘗試以下(xià)幾種設計方式：
　　1、結構的一(yī)緻性：我(wǒ)(wǒ)們知(zhī)道，網站的統一(yī)性在網站營銷中(zhōng)占重要地位，而網站結構是網站風格統一(yī)的重要手段，包括網站布局、文字排版、裝飾性元素出現的位置、導航的統一(yī)、圖片的位置等等，到國外(wài)著名的電子商(shāng)務網站浏覽，你會發現這些網站結構驚奇的一(yī)緻性，所不同的是色彩或内容，在結構的一(yī)緻性中(zhōng)，我(wǒ)(wǒ)們要強調網站标志(zhì)性元素的一(yī)緻性，即網站或公司名稱、網站或企業标志(zhì)、導航及輔助導航的形式及位置、公司聯系信息等，這種方式是目前網站普遍采用的結構，一(yī)方面減少設計、開(kāi)發的工(gōng)作量，同時更有利于以後的網站維護與更新。
　　 2、色彩的一(yī)緻性：方式是保持站點主體(tǐ)色彩的一(yī)緻，隻改變局部色塊，優點是一(yī)個獨特色彩的網站會給人留下(xià)很深刻的印象，因爲人的視覺對色彩要比布局更敏感，更容易在大(dà)腦中(zhōng)形成記憶符号。在色彩的一(yī)緻性中(zhōng)，我(wǒ)(wǒ)們強調的是如果企業有自身的CI形象，最好在互聯網中(zhōng)沿襲這個形象，給觀衆網上網下(xià)一(yī)緻的感覺，更有利于企業形象的樹(shù)立。一(yī)個建議是選取一(yī)兩種主要色彩，幾種輔助色彩。
　　 3、利用導航取得統一(yī)：導航是網站的一(yī)項重要組成部分(fēn)，一(yī)個出色的富有企業特性的導航将會給人留下(xià)深刻的印象，比如将标志(zhì)的形态寓于導航之中(zhōng)，或将導航設計在整個網站布局之中(zhōng)等等不一(yī)而足，花點力氣在導航上，也會設計出一(yī)個出色的站點。
　　  4、特别元素的一(yī)緻性：在網站設計中(zhōng)，個别具有特色的元素（如标志(zhì)、象征圖形、局部設計等）重複出現，也會給訪問者留下(xià)深刻印象。比如網站結構在某一(yī)點上的變化，由直線變爲圓弧、暗色點綴的亮色、色彩中(zhōng)的補色等等。
　　 5、利用圖像取得統一(yī)： 網頁中(zhōng)的圖像在使用上一(yī)定要甚之又(yòu)甚，尤其是一(yī)些動畫，網頁中(zhōng)充斥着各種可有可無的動畫，而這些動畫根本與本企業内容無關！認真檢查網頁中(zhōng)的動畫，将沒用的删掉！這裏我(wǒ)(wǒ)們所說的利用圖像取得統一(yī)，決不是在每頁中(zhōng)放(fàng)置幾個動畫！而是作爲網站結構一(yī)部分(fēn)的局部圖像，根據網頁内容的不同，配以相應的圖像或動畫，從而給浏覽者形成頁面的連續性。
　　 6、利用背景取得統一(yī)：從技術上而言，網頁背景包括背景色和背景圖像兩種，一(yī)般來說，我(wǒ)(wǒ)們并不提倡使用背景圖像，而使用背景色或色塊。原因很明顯，第一(yī)，下(xià)載速度，背景色的下(xià)載速度忽略不計，而背景圖像就得根據圖像字節大(dà)小(xiǎo)下(xià)載了，這裏需要說明的是，如果你的背景圖像比較深，那麽最好将背景色置爲深色調（默認的背景色是白(bái)色），這樣在等待浏覽器下(xià)載背景圖片的時候前面的淺色文字可以很容易閱讀，因爲如果有背景色，浏覽器先将其下(xià)載，然後下(xià)載背景圖片；第二，顯示效果，經常看到國内一(yī)些網站設有背景圖像，或者是公司的廠房、辦公大(dà)樓，或者是産品圖片，甚至是某某人物(wù)的照片，使得前面的文字很難辨認！給人一(yī)種很不舒服的感覺，讓人無法停留。在此，提醒您注意：有效利用背景取得網站統一(yī)和專業化的方法有以下(xià)幾種：
第一(yī)，認識到并不是所有的圖片都可以作爲背景，在考慮設置網站背景圖像的時請您注意；
第二，加強與前景的明暗對比，即要麽淡化背景，隐隐約約可以看到即可，要麽加深背景，而将前面的文字亮化。
　　 那麽什麽适合網頁背景呢？一(yī)個好的建議是将公司的标志(zhì)、象征性的簡單圖片作爲背景，并将其淡化，使浏覽者在閱讀網站内容的同時不經意記下(xià)公司的标志(zhì)。曾經一(yī)個網站的背景設計給我(wǒ)(wǒ)留下(xià)深刻的印象：單色背景中(zhōng)一(yī)個網站标志(zhì)的居中(zhōng)放(fàng)大(dà)淡化，前面元素中(zhōng)也不斷重複這個标志(zhì)：如提交按紐形狀刻意設計成标志(zhì)的形式等等，在整個頁面中(zhōng)形成特有元素在大(dà)小(xiǎo)、明暗及位置的呼應，很好地塑造了網站的特有形象。

　　三、色彩搭配
　　網頁中(zhōng)最難處理的也就是色彩搭配的問題了。如何運用最簡單的色彩表達最豐富的含義，體(tǐ)現企業形象是網頁設計人員(yuán)需要不斷學習、探索的課題。如何進行色彩搭配是一(yī)門學問，下(xià)面的一(yī)些方法是我(wǒ)(wǒ)在實踐過程中(zhōng)的體(tǐ)會，希望能夠爲您起到一(yī)定的參考作用。
　　1、運用相同色系色彩：所謂相同色系，是指幾種色彩在360°色相環上位置十分(fēn)相近，大(dà)約在45°左右或同一(yī)色彩不同明度的幾種色彩，如：，這種搭配的優點是易于使網頁色彩趨于一(yī)緻，對于網頁設計新手有很好的借鑒作用，這種用色方式容易塑造網頁和諧統一(yī)的氛圍，缺點是容易造成頁面的單調，因此往往利用局部加入對比色來增加變化，如局部對比色彩的圖片等。這種方法不失爲一(yī)種設計的好方法。
　　2、運用對比色或互補色：所謂對比色，是指色相環相距較遠，大(dà)約在100°左右，視覺效果鮮亮、強烈，而互補色則是色相環上相距最遠的連種色彩，即相距180°，其對比關系最強烈、最富有刺激性，往往使畫面十分(fēn)突出，如：，這種用色方式容易塑造活潑、韻動的網頁效果，特别适合體(tǐ)現輕松、積極的素材的網站，缺點是容易造成色彩的花，使用中(zhōng)注意色彩使用的度。
　　值得注意的是，以上兩種用色方式在實際應用中(zhōng)要注意主體(tǐ)色彩的運用，即以一(yī)種或兩種色彩爲主，其它色彩爲輔，不要幾種色彩等量使用，以免造成色彩的混亂。
　　3、使用過渡色：過渡色能夠神奇地将幾種不協調的色彩統一(yī)起來，在網頁中(zhōng)合理地使用過渡色能夠使你的色彩搭配技術更上一(yī)層樓。過渡色包括幾種形式：兩種色彩的中(zhōng)間色調、單色中(zhōng)混入黑、白(bái)、灰進行調和以及單色中(zhōng)混入相同色彩進行調和等等，您可以自己嘗試調配，在以後的更新中(zhōng)，我(wǒ)(wǒ)會專題介紹如何使用過渡色。

　　四、版面布局
　　一(yī)般來說，企業網站首頁的布局比較靈活，着重設計，這裏我(wǒ)(wǒ)所說的布局主要是指内頁的版面布局。中(zhōng)、小(xiǎo)型企業網站的内頁布局一(yī)般比較簡單，即内頁的一(yī)欄式版面布局，從排版布局的角度而言，我(wǒ)(wǒ)們還可以設計成等分(fēn)兩欄式、三欄式、多欄式，不等分(fēn)兩欄式、三欄式、多欄式等等，但因爲浏覽器寬幅有限，一(yī)般不宜設計成三欄以上的布局。
　　在版面布局中(zhōng)主要是考慮導航、必要信息與正文之間的布局關系。比較多的情況是采用頂部放(fàng)置必要的信息，如公司名稱、标志(zhì)、廣告條以及導航條，或将導航條放(fàng)在左側而右側是正文等等，這樣的布局結構清晰、易于使用。當然，您也可以嘗試這些布局的變化形式，如：左右兩欄式布局，一(yī)半是正文，另一(yī)半是形象的圖片、導航；或正文不等兩欄式布置，通過背景色區分(fēn)，分(fēn)别放(fàng)置圖片和文字等等。在設計中(zhōng)注意多吸取好的網站設計的精髓。