網站(zhàn)建設的現狀以及應用技(jì)巧

    （一）垃圾還(hái)是經典
網站(zhàn)建設技(jì)術(shù)更新很(hěn)快，一個(gè)網站(zhàn)的界面設計(jì)壽命僅僅2-3年而已。不管是垃圾還(hái)是精品，都沒有(yǒu)所謂的經典。經典隻存在于是哪個(gè)首次成功創新性的應用。一個(gè)閉門(mén)造車(chē)者做(zuò)出的東西，是遠遠趕不上(shàng)綜合借鑒者的。網站(zhàn)建設技(jì)術(shù)不同于其他藝術(shù)，在模仿加創新的網站(zhàn)建設技(jì)術(shù)領域當中，即便是完全自己設計(jì)的，也是沿用了人(rén)們已經認同的大(dà)部分用戶習慣，而且這種沿襲的痕迹時(shí)非常的明(míng)顯！還(hái)有(yǒu)那(nà)個(gè)設計(jì)者敢腆着臉說，這都是我自己的原創設計(jì)？對于業界來(lái)說，經典隻是個(gè)理(lǐ)念和(hé)象征！
（二）國內(nèi)網站(zhàn)建設技(jì)術(shù)環境
不可(kě)否認，國內(nèi)網站(zhàn)建設技(jì)術(shù)環境目前還(hái)停留在初級的認知階段，也就是說，絕大(dà)多(duō)數(shù)人(rén)不知道(dào)網絡的真正的可(kě)用之處，你(nǐ)去做(zuò)一個(gè)業務的時(shí)候，不得(de)不去做(zuò)大(dà)量的說服教育工作(zuò)。以乙方的身份去說服甲方，以專業角度去教育非專業認識，結果是可(kě)想而知的。也正是這種全體(tǐ)社會(huì)普遍的低(dī)認知水(shuǐ)平，導緻了大(dà)量網絡垃圾的産生(shēng)。
舉個(gè)簡單的例子，看看“阿裏巴巴”中文和(hé)英文兩個(gè)版本的頁面。中文版主色是橙色（與标志(zhì)色統一），英文版是極不協調的藍(lán)橙（具有(yǒu)很(hěn)明(míng)顯的生(shēng)湊效果）。
為(wèi)啥中文版是橙色，呵呵，不要以為(wèi)哪是為(wèi)了和(hé)标志(zhì)統一，其實那(nà)時(shí)國內(nèi)最常用的商業色。橙色代表什麽？肉色，淫欲。商業是性質？貪婪、拜金。對于社會(huì)主義初級階段群衆的普遍思想來(lái)說，橙色就是最突出的體(tǐ)現，它不僅僅是網頁首選商業色，它還(hái)體(tǐ)現了當今社會(huì)經濟發展條件下的“浮躁”和(hé)“糜爛”，它還(hái)說明(míng)了“低(dī)認知水(shuǐ)平”的國人(rén)，需要用這個(gè)刺激的顔色，去宣教引領他們被動接受。
為(wèi)啥英文版是藍(lán)橙？因為(wèi)洋人(rén)已處于發達社會(huì)，他們首先需要的不是“宣教引領”，而是“功能”。一個(gè)弱化的界面更能強化顯示功能，使人(rén)方便使用。較刺激熱烈的顔色，會(huì)引起洋人(rén)的反感，所以用的淺藍(lán)灰色。那(nà)麽為(wèi)什麽又會(huì)出現極不協調的橙色捏？原因有(yǒu)二，一是要與标志(zhì)顔色統一，二是中英文要有(yǒu)傳承，所以出了這末個(gè)一半是火(huǒ)焰一半世海水(shuǐ)的結果。
　（三）什麽是好的網站(zhàn)建設技(jì)術(shù)
　（1）內(nèi)容和(hé)功能決定表現形式和(hé)界面設計(jì)
常常拿(ná)到的任務是一張小(xiǎo)紙條，上(shàng)面兩句話(huà)，叫你(nǐ)去做(zuò)一個(gè)網站(zhàn)設計(jì)。有(yǒu)的人(rén)看看紙條就去設計(jì)頁面了憑，憑兩句話(huà)，你(nǐ)就可(kě)以為(wèi)客戶做(zuò)一個(gè)頁面設計(jì)，以我7、8年的設計(jì)經驗，我都不敢去做(zuò)，你(nǐ)真是我的偶像阿！
做(zuò)網站(zhàn)建設技(jì)術(shù)，你(nǐ)需要了解客戶的東西很(hěn)多(duō)：
1、建站(zhàn)目的
2、欄目規劃及每個(gè)欄目的表現形式及功能要求
3、主色、客戶性别喜好、聯系方式、舊(jiù)版網址、偏好網址
4、根據行(xíng)業和(hé)客戶要求，那(nà)些(xiē)要着重表現
5、是否分期建設、考慮後期的兼容性
6、客戶是否有(yǒu)強烈的建站(zhàn)欲望
7、你(nǐ)是否能在精神意識上(shàng)控制(zhì)住客戶
8、面對你(nǐ)未接觸的技(jì)術(shù)知識，你(nǐ)有(yǒu)底嗎？
9. 網站(zhàn)類型
等等...
當你(nǐ)把這些(xiē)內(nèi)容都了解清除了時(shí)候，你(nǐ)的大(dà)腦(nǎo)中就已經給這個(gè)網站(zhàn)有(yǒu)個(gè)全面而形象的定位了，這時(shí)才是有(yǒu)的放矢去做(zuò)界面設計(jì)的時(shí)候了。
（2）界面弱化
一個(gè)好的界面設計(jì)它的界面時(shí)弱化的，它突出的是功能，着重體(tǐ)現的是網站(zhàn)業提供給使用者是主要什麽。這就涉及到浏覽順序、功能分區(qū)等等。
要讓訪客在0.5內(nèi)就能把握網站(zhàn)的行(xíng)業性質，1秒(miǎo)內(nèi)就知道(dào)該從哪個(gè)地方開(kāi)始使用這個(gè)網站(zhàn)，能點一次的，絕不點第二次。當然上(shàng)面說的是大(dà)多(duō)數(shù)功能性網站(zhàn)，對于宣戰展示性網站(zhàn)，諸如加特效的或Flash網站(zhàn)，可(kě)能就不得(de)不花(huā)哨一些(xiē)，但(dàn)不能太過分。網站(zhàn)不是動畫(huà)片，在效率越來(lái)越高(gāo)，社會(huì)心理(lǐ)越來(lái)越浮躁的中國，人(rén)們的耐心越來(lái)越小(xiǎo)，心理(lǐ)承受能力越來(lái)越低(dī)。效果可(kě)以體(tǐ)現意境，點到為(wèi)止。
（3）模塊化和(hé)可(kě)修改性強
模塊化不僅可(kě)以提高(gāo)重用性，也能統一網站(zhàn)風格，還(hái)可(kě)以降低(dī)程序開(kāi)發的強度。這裏就設計(jì)一些(xiē)尺寸、模數(shù)、寬容度、命名規範等等知識了，不再冗述。
，無論是架構還(hái)是模塊或圖片，都要考慮可(kě)修改性強。舉個(gè)簡單的例子，logo、按鈕等，很(hěn)多(duō)人(rén)喜歡制(zhì)作(zuò)圖片，N個(gè)按鈕就是N張圖片。如果隻做(zuò)3-5類按鈕的背景圖片，然後用在網頁代碼裏打上(shàng)文字，那(nà)麽修改起來(lái)就簡單了，讓程序員自己改字就可(kě)以了。然而網頁顯示的字體(tǐ)是帶有(yǒu)鋸齒的，一般即能清晰又保證美觀的字體(tǐ)字号有(yǒu)幾類：
宋體(tǐ) 12px | 宋體(tǐ) 12px 粗體(tǐ) | 宋體(tǐ) 14px | 宋體(tǐ) 14px 粗體(tǐ) | 黑(hēi)體(tǐ) 20px | verdana 9px | Arial Black 12px+ |
（4）創藝是可(kě)恥的，分析能力遠比創藝來(lái)的重要
設計(jì)界動辄就大(dà)談什麽“創意”，我要說的是，還(hái)沒有(yǒu)搞清目的意義內(nèi)容，還(hái)沒在技(jì)術(shù)制(zhì)作(zuò)上(shàng)臻于完善的基礎上(shàng)班，用創藝和(hé)特效來(lái)迷惑客戶和(hé)訪客是可(kě)恥的。一個(gè)網也設計(jì)者的分析能力遠比創藝來(lái)的重要。
（5）兼顧還(hái)是抛棄
CSS、XHTML、web2.0、Ajax等等山(shān)雨欲來(lái)，學習先進技(jì)術(shù)固然是有(yǒu)好處的，但(dàn)對于目前國內(nèi)普遍的低(dī)認知水(shuǐ)平，決定了客戶的需求和(hé)價格也是相當低(dī)的。之前，說到經濟決定網也設計(jì)，所以有(yǒu)的時(shí)候，是不允許你(nǐ)做(zuò)出更多(duō)的兼顧的，抛棄和(hé)放棄也是無奈之舉。
（四）結尾，送上(shàng)思洋廣州的一些(xiē)經驗
　　（一）網頁配色基本概念
（1）白紙黑(hēi)字是永遠的主題，誰都說不出不好來(lái)。
（2）網頁最常用流行(xíng)色
·蘭色——藍(lán)天白雲，沉靜整潔的顔色。
·綠色——綠白相間(jiān)，雅緻而有(yǒu)生(shēng)氣。
·橙色——活潑熱烈，标準商業色調。
·暗紅——甯重、嚴肅、高(gāo)貴，需要配黑(hēi)和(hé)灰來(lái)壓制(zhì)刺激的紅色，
（3）顔色的忌諱
·忌髒——背景與文字內(nèi)容對比不強烈，灰暗的背景令人(rén)沮喪！
·忌純——豔麗(lì)的純色對人(rén)的刺激太強烈抗議，缺乏內(nèi)涵。
·忌跳(tiào)——再好看的顔色，也不能脫離整體(tǐ)。脫離群衆是自取其辱！
·忌花(huā)——要有(yǒu)一種主色貫穿其中，主色并不時(shí)面積最大(dà)的顔色，而是最重要，最能揭示和(hé)反映主題的顔色，就象領導者一樣，雖然在人(rén)數(shù)上(shàng)居少(shǎo)數(shù)，但(dàn)起決定作(zuò)用。
·忌粉——顔色淺固然顯的幹淨，但(dàn)如果對比過弱，整得(de)蒼白無力了，就象病夫一樣無可(kě)救藥。
·藍(lán)色忌純，綠色忌黃，紅色忌豔。
　　（4）幾種固定搭配
·藍(lán)白橙——藍(lán)為(wèi)主調。白底，藍(lán)标題欄，橙色按鈕或ICON做(zuò)點綴。
·綠白蘭——綠為(wèi)主調。白底，綠标題欄，蘭色或橙色按鈕或ICON做(zuò)點綴。
·橙白紅——橙為(wèi)主調。白底，橙标題欄，暗紅或桔紅色按鈕或ICON做(zuò)點綴。
·暗紅黑(hēi)——暗紅主調。黑(hēi)或灰底，暗紅标題欄，文字內(nèi)容背景為(wèi)淺灰色。
　（二）網站(zhàn)建設技(jì)術(shù)理(lǐ)念
　（1）內(nèi)容決定形式
　　先把內(nèi)容充實上(shàng)，再分區(qū)塊，再定色調，再處理(lǐ)細節。
　（2）先整體(tǐ)，後局部，最後回歸到整體(tǐ)。
全局考慮，把能填上(shàng)的都填上(shàng)，占位置。然後定基調，分模塊設計(jì)。最後調整不滿意的幾個(gè)局部細節。
　　（3）功能決定設計(jì)方向
·看網站(zhàn)的用途，決定設計(jì)思路.商業性的就要突出赢利目的；政府型的就要突出形象和(hé)權威性的文章；教育性的，就要突出師(shī)資和(hé)課程。

　　關于網頁标題設計(jì)的原則

在設計(jì)網頁标題時(shí)，應注意同時(shí)兼顧對用戶的注意力，以及對搜索引擎檢索的需要。這一原則在實際操作(zuò)中可(kě)通(tōng)過下來(lái)三個(gè)方面來(lái)體(tǐ)現，這三個(gè)方面也可(kě)以被認為(wèi)是網頁标題設計(jì)的一般規律：
（1）網頁标題不宜過短(duǎn)或者多(duō)長。一般來(lái)說6－10個(gè)漢字比較理(lǐ)想，最好不好超過30個(gè)漢字。網頁标題字數(shù)過少(shǎo)可(kě)能包含不了有(yǒu)效關鍵詞，字數(shù)過多(duō)不僅搜索引擎無法正确識别标題中的核心關鍵詞，而且也讓用戶難以對網頁标題（尤其是首頁标題，代表了網站(zhàn)名稱）形成深刻印象，也不便于其他網站(zhàn)鏈接。
（2）網頁标題應概括網頁的核心內(nèi)容。當用戶通(tōng)過搜索引擎檢索時(shí)，在檢索結果頁面中的內(nèi)容一般是網頁标題（加鏈接）和(hé)網頁摘要信息，要引起用戶的關注，網頁标題發揮了很(hěn)大(dà)的作(zuò)用，如果網頁标題和(hé)頁面摘要信息有(yǒu)較大(dà)的相關性，摘要信息對網頁标題将發揮進一步的補充作(zuò)用，從而引起用戶對該網頁信息點擊行(xíng)為(wèi)的發生(shēng)（也就意味着搜索引擎推廣發揮了作(zuò)用）。另外，當網頁标題被其他網站(zhàn)或者本網站(zhàn)其他欄目/網頁鏈接時(shí)，一個(gè)概括了網頁核心內(nèi)容的标題有(yǒu)助于用戶判斷是否點擊該網頁标題鏈接。
（3）網頁标題中應含有(yǒu)豐富的關鍵詞。考慮到搜索引擎營銷的特點，搜索引擎對網頁标題中所包含的關鍵詞具有(yǒu)較高(gāo)的權重，盡量讓網頁标題中含有(yǒu)用戶檢索所使用的關鍵詞。以網站(zhàn)首頁設計(jì)為(wèi)例，一般來(lái)說首頁标題就是網站(zhàn)的名稱或者公司名稱，但(dàn)是考慮到有(yǒu)些(xiē)名稱中可(kě)能無法包含公司/網站(zhàn)的核心業務，也就是說沒有(yǒu)核心關鍵詞，這時(shí)通(tōng)常采用“核心關鍵詞＋公司名/品排名”的方式來(lái)作(zuò)為(wèi)網站(zhàn)首頁标題。本文開(kāi)頭所列舉的某網絡營銷服務商網站(zhàn)首頁标題實例，其實也是采用這種方式來(lái)設計(jì)網頁标題，隻不過由于羅列了太多(duō)的“核心關鍵詞”，反而沒有(yǒu)了核心。
上(shàng)述幾個(gè)方面其實都考慮了搜索引擎檢索網頁的特點，也就是說，網頁标題設計(jì)都将有(yǒu)利于搜索引擎檢索作(zuò)為(wèi)重要因素，即使如此，作(zuò)者仍然建議，與網頁內(nèi)容寫作(zuò)一樣，網頁标題寫作(zuò)首先是給用戶看的，在這個(gè)前提之上(shàng)考慮對搜索引擎檢索才有(yǒu)意義。可(kě)見網頁标題設計(jì)并不是一件随意的事情，尤其對網站(zhàn)首頁标題設計(jì)，不可(kě)不慎重。
做(zuò)美工看起來(lái)并不是一件容易的事情。首先，要對整個(gè)站(zhàn)點和(hé)企業有(yǒu)個(gè)大(dà)緻的了解。例如：某些(xiē)企業喜歡藍(lán)色的主調，你(nǐ)不可(kě)能去做(zuò)個(gè)紅色的主調，這樣完全違背客戶的主要意願，如果百度的标志(zhì)改成五顔六色的，相信大(dà)家(jiā)也不會(huì)認可(kě)的。站(zhàn)長的職責是規劃網站(zhàn)結構。同樣也需要有(yǒu)一定的審美觀。下面介紹了幾款常用的繪圖工具和(hé)基本知識。
1.源文件psd，ai，cdr的區(qū)别
psd文件就是用photoshop創建的，當然也必須用photoshop打開(kāi)；
ai文件是Illustrator的。他們都是Adobe公司的。ai文件同樣也可(kě)以用photoshop打開(kāi)，但(dàn)打開(kāi)後會(huì)載入在同一層內(nèi)。
cdr文件是CorelDRAW的。
2.關于CMYK和(hé)RGB顔色模式
CMYK是Cyan（青）、Mageata（品紅）、Yellow（黃）、Black（黑(hēi)），這是印刷上(shàng)使用比較普遍的色彩模式。
R、G、B就是Red、Green、Blue（紅，綠，藍(lán)）三種顔色，RGB模式就是由這三種顔色為(wèi)基色進行(xíng)疊加而模拟出大(dà)自然色彩的色彩組合模式。我們日常用的彩色電(diàn)腦(nǎo)顯示器(qì)、彩色電(diàn)視(shì)機等的色彩都使用這種模式。
3.矢量圖
矢量圖與位圖最大(dà)的區(qū)别是,它不受分辨率的影(yǐng)響。因此在印刷時(shí),可(kě)以任意放大(dà)或縮小(xiǎo)圖形而不會(huì)影(yǐng)響出圖的清晰度
矢量圖：是根據幾何特性來(lái)繪制(zhì)圖形，矢量可(kě)以是一個(gè)點或一條線，矢量圖隻能靠軟件生(shēng)成，文件占用內(nèi)在空(kōng)間(jiān)較小(xiǎo)，因為(wèi)這種類型的圖像文件包含獨立的分離圖像，可(kě)以自由無限制(zhì)的重新組合。它的特點是放大(dà)後圖像不會(huì)失真，和(hé)分辨率無關，文件占用空(kōng)間(jiān)較小(xiǎo)，适用于圖形設計(jì)、文字設計(jì)和(hé)一些(xiē)标志(zhì)設計(jì)、版式設計(jì)等。
ai cdr均為(wèi)矢量圖。
4.圖片文件jpg，gif，png，bmp的區(qū)别
bmp：是未經過壓縮的用點陣來(lái)表示的真彩圖片,占用磁盤空(kōng)間(jiān)較大(dà)
gif：是經過壓縮的,隻能表示256種顔色,占用磁盤空(kōng)間(jiān)小(xiǎo),常用來(lái)演示色彩單一的成塊的卡通(tōng)圖案,GIF還(hái)有(yǒu)一種可(kě)以表示連續的動畫(huà).
png：是fireworks的圖片格式
jpg：也是有(yǒu)損壓縮格式但(dàn)是它表示的顔色比較豐富,一般用來(lái)顯示真彩的照片或圖案
5.名片的尺寸問題
名片的标準尺寸：90mmX54mm。但(dàn)是加上(shàng)出血上(shàng)下左右各2mm，所以在設計(jì)時(shí)
制(zhì)作(zuò)尺寸必須設定為(wèi)：94 x 58mm。
6.源文件的提供問題
作(zuò)為(wèi)設計(jì)者和(hé)客戶（這裏指各站(zhàn)長），如果事先沒有(yǒu)明(míng)文協議的話(huà)
設計(jì)者有(yǒu)權不提供源文件。
7.什麽是logo，ci，vi
VI是Visual Identity的縮寫，中文譯為(wèi)“企業視(shì)覺識别”。VI是CI計(jì)劃的靜态識别符号，是企業理(lǐ)念視(shì)覺化傳達的載體(tǐ)，因此它項目最多(duō)，效果最為(wèi)直接。VI作(zuò)為(wèi)視(shì)覺識别，它是外在表現，固然需要具有(yǒu)美感，但(dàn)VI必須是MI的體(tǐ)現，直接反映企業的理(lǐ)念。因此VI設汁包含這樣一些(xiē)原則：即充分傳達企業理(lǐ)念、人(rén)性原則、民族性原則、簡潔抽象及動态原則、員工參與原則、法律原則、藝術(shù)性原則和(hé)個(gè)性原則。
CI是Corporate Identity的縮寫，中文譯為(wèi)“企業形象”。CI計(jì)劃，是指企業有(yǒu)目的、有(yǒu)計(jì)劃、戰略性地創造出所希望的自身形象，由此提高(gāo)企業的社會(huì)知名度，最終得(de)到自己最适合的經營環境。
而logo隻是網站(zhàn)或企業一個(gè)标志(zhì)。
8，關于logo設計(jì)的資費問題
這個(gè)問題很(hěn)不好說，如果是去找正規廣告公司做(zuò)的話(huà)，根據公司規模大(dà)小(xiǎo)，500到5000的都是正常的，一般都附送半套VI（namecard等常用一些(xiē)），大(dà)公司的服務态度和(hé)服務質量不一定比小(xiǎo)公司好。現如今有(yǒu)些(xiē)朋友(yǒu)在論壇上(shàng)說50元做(zuò)logo，個(gè)人(rén)認為(wèi)還(hái)不如不收取費用來(lái)得(de)好些(xiē)。這樣的惡性競争下，設計(jì)業遲早會(huì)或者說已經被帶入了“民工職業”的行(xíng)列。
還(hái)有(yǒu)一點，如果您喜歡拿(ná)很(hěn)多(duō)方案去比稿的話(huà)，建議您去重慶威客網發布威客任務，那(nà)樣價錢(qián)不會(huì)很(hěn)貴，還(hái)可(kě)以得(de)到很(hěn)多(duō)得(de)設計(jì)方案，一般400塊錢(qián)的懸賞任務可(kě)以得(de)到30份左右的初稿，還(hái)是很(hěn)劃算(suàn)的。BTW：在威客發布懸賞任務是要給相關網站(zhàn)支付一定的任務管理(lǐ)金的，一般為(wèi)20%。）
最後說句，站(zhàn)長在設計(jì)之前請(qǐng)與設計(jì)師(shī)先進性良好溝通(tōng)，不要撇下一句“你(nǐ)看着辦吧(ba)，我相信你(nǐ)。”“你(nǐ)是專業的，你(nǐ)說怎麽弄就怎麽弄。”之類的話(huà)就不管了。自己對自己的站(zhàn)點不負責的話(huà)，設計(jì)師(shī)也一定不會(huì)對你(nǐ)的站(zhàn)點負責的。
另外，一個(gè)設計(jì)可(kě)以大(dà)幅度改稿的次數(shù)一般在2--3次間(jiān)（付費情況下），這不是一個(gè)規定，但(dàn)是大(dà)多(duō)數(shù)設計(jì)在超過這個(gè)次數(shù)後會(huì)對業主産生(shēng)一定的仇恨情緒......