資訊活動???News
聯系我們???Contact
你的位置:首頁 > 資訊活動 > 網站資訊

網站建設技術解析

2014-04-30 15:11:07??????點擊:
        網站建設技術更新很快,一個網站的界面設計壽命僅僅2-3年而已。不管是垃圾還是精品,都沒有所謂的經典,經典只存在于是哪個首次成功創新性的應用。一個閉門造車者做出的東西,是遠遠趕不上綜合借鑒者的。網頁設計不同于其他藝術,在模仿加創新的網頁設計領域當中,即便是完全自己設計的,也是沿用了人們已經認同的大部分用戶習慣,而且這種沿襲的痕跡是非常的明顯!還有哪個設計者敢腆著臉說,這都是我自己的原創設計?對于業界來說,經典只是個理念和象征! 
  不可否認,國內網頁設計環境目前還停留在初級的認知階段,也就是說,絕大多數人不知道網絡的真正的可用之處,你去做一個業務的時候,不得不去做大量的說服教育工作。以乙方的身份去說服甲方,以專業角度去教育非專業認識,結果是可想而知的。也正是這種全體社會普遍的低認知水平,導致了大量網絡垃圾的產生。 
  什么是好的網站建設
  (1)內容和功能決定表現形式和界面設計 
  常常拿到的任務是一張小紙條,上面兩句話,叫你去做一個網站設計。有的人看看紙條就去設計頁面了,憑兩句話,你就可以為客戶做一個頁面設計,以我7、8年的設計經驗,我都不敢去做,你真是我的偶像阿! 
  做網站,你需要了解客戶的東西很多: 
  1、建站目的。 
  2、欄目規劃及每個欄目的表現形式及功能要求。 
  3、主色、客戶性別喜好、聯系方式、舊版網址、偏好網址。 
  4、根據行業和客戶要求,那些要著重表現。 
  5、是否分期建設、考慮后期的兼容性。 
  6、客戶是否有強烈的建站欲望。 
  7、你是否能在精神意識上控制住客戶。 
  8、面對你未接觸的技術知識,你有底嗎? 
  9. 網站類型。 
  等等... 
  當你把這些內容都了解清楚了時候,你的大腦中就已經給這個網站有個全面而形象的定位了,這時才是有的放矢去做界面設計的時候了。 
  (2)界面弱化 
  一個好的界面設計它的界面是弱化的,它突出的是功能,著重體現的是網站業提供給使用者主要是什么。這就涉及到瀏覽順序、功能分區等等。 
  要讓訪客在0.5秒內就能把握網站的行業性質,1秒內就知道該從哪個地方開始使用這個網站,能點一次的,絕不點第二次。當然上面說的是大多數功能性網站,對于宣傳展示性http://www.thfyjviz.cn網站,諸如加特效的或Flash網站,可能就不得不花哨一些,但不能太過分。網站不是動畫片,在效率越來越高,社會心理越來越浮躁的中國,人們的耐心越來越小,心理承受能力越來越低。效果可以體現意境,點到為止。 
  (3)模塊化和可修改性強 
  模塊化不僅可以提高重用性,也能統一網站風格,還可以降低程序開發的強度。這里就涉及一些尺寸、模數、寬容度、命名規范等等知識了,不再冗述。 
  無論是架構還是模塊或圖片,都要考慮可修改性強。舉個簡單的例子,logo、按鈕等,很多人喜歡制作圖片,N個按鈕就是N張圖片。如果只做3-5類按鈕的背景圖片,然后用在網頁代碼里打上文字,那么修改起來就簡單了,讓程序員自己改字就可以了。然而網頁顯示的字體是帶有鋸齒的,一般既能清晰又保證美觀的字體字號有幾類: 
  宋體12px | 宋體 12px 粗體 | 宋體 14px | 宋體 14px 粗體 | 黑體 20px | verdana 9px | Arial Black 12px+ | 
  (4)創意是可恥的,分析能力遠比創意來的重要 
  設計界動輒就大談什么“創意”,我要說的是,還沒有搞清目的意義內容,還沒在技術制作上臻于完善的基礎上,用創意和特效來迷惑客戶和訪客是可恥的。一個網頁設計者的分析能力遠比創意來的重要。 
  (四)結尾,送上思洋廣州的一些經驗 
  (一)網頁配色基本概念 
  (1)白紙黑字是永遠的主題,誰都說不出不好來。 
  (2)網頁最常用流行色 
  ?藍色——藍天白云,沉靜整潔的顏色。 
  ?綠色——綠白相間,雅致而有生氣。 
  ?橙色——活潑熱烈,標準商業色調。 
  ?暗紅——寧重、嚴肅、高貴,需要配黑和灰來壓制刺激的紅色。 
  (3)顏色的忌諱 
  ?忌臟——背景與文字內容對比不強烈,灰暗的背景令人沮喪! 
  ?忌純——艷麗的純色對人的刺激太強烈抗議,缺乏內涵。 
  ?忌跳——再好看的顏色,也不能脫離整體。脫離群眾是自取其辱! 
  ?忌花——要有一種主色貫穿其中,主色并不是面積最大的顏色,而是最重要,最能揭示和反映主題的顏色,就象領導者一樣,雖然在人數上居少數,但起決定作用。 
  ?忌粉——顏色淺固然顯的干凈,但如果對比過弱,整得蒼白無力了,就象病夫一樣無可救藥。 
  ?藍色忌純,綠色忌黃,紅色忌艷。 
  (4)幾種固定搭配 
  ?藍白橙——藍為主調。白底,藍標題欄,橙色按鈕或ICON做點綴。 
  ?綠白蘭——綠為主調。白底,綠標題欄,蘭色或橙色按鈕或ICON做點綴。 
  ?橙白紅——橙為主調。白底,橙標題欄,暗紅或桔紅色按鈕或ICON做點綴。 
  ?暗紅黑——暗紅主調。黑或灰底,暗紅標題欄,文字內容背景為淺灰色。 
  (二)http://www.thfyjviz.cn網頁設計理念 
  (1)內容決定形式 
  先把內容充實上,再分區塊,再定色調,再處理細節。 
  (2)先整體,后局部,最后回歸到整體。 
  全局考慮,把能填上的都填上,占位置。然后定基調,分模塊設計。最后調整不滿意的幾個局部細節。 
  (3)功能決定設計方向 
  ?看網站的用途,決定設計思路.商業性的就要突出贏利目的;政府型的就要突出形象和權威性的文章;教育性的,就要突出師資和課程。 
  關于網頁標題設計的原則 
  在設計網頁標題時,應注意同時兼顧對用戶的注意力,以及對搜索引擎檢索的需要。這一原則在實際操作中可通過三個方面來體現,這三個方面也可以被認為是網頁標題設計的一般規律: 
  (1)網頁標題不宜過短或者多長。一般來說6-10個漢字比較理想,最好不好超過30個漢字。網頁標題字數過少可能包含不了有效關鍵詞,字數過多不僅搜索引擎無法正確識別標題中的核心關鍵詞,而且也讓用戶難以對網頁標題(尤其是首頁標題,代表了網站名稱)形成深刻印象,也不便于其他網站鏈接。 
  (2)網頁標題應概括網頁的核心內容。當用戶通過搜索引擎檢索時,在檢索結果頁面中的內容一般是網頁標題(加鏈接)和網頁摘要信息,要引起用戶的關注,網頁標題發揮了很大的作用,如果網頁標題和頁面摘要信息有較大的相關性,摘要信息對網頁標題將發揮進一步的補充作用,從而引起用戶對該網頁信息點擊行為的發生(也就意味著搜索引擎推廣發揮了作用)。另外,當網頁標題被其他網站或者本網站其他欄目/網頁鏈接時,一個概括了網頁核心內容的標題有助于用戶判斷是否點擊該網頁標題鏈接。 
  (3)網頁標題中應含有豐富的關鍵詞。考慮到搜索引擎營銷的特點,搜索引擎對網頁標題中所包含的關鍵詞具有較高的權重,盡量讓網頁標題中含有用戶檢索所使用的關鍵詞。以網站首頁設計為例,一般來說首頁標題就是網站的名稱或者公司名稱,但是考慮到有些名稱中可能無法包含公司/網站的核心業務,也就是說沒有核心關鍵詞,這時通常采用“核心關鍵詞+公司名/品排名”的方式來作為網站首頁標題。本文開頭所列舉的某網絡營銷服務商網站首頁標題實例,其實也是采用這種方式來設計網頁標題,只不過由于羅列了太多的“核心關鍵詞”,反而沒有了核心。 
  上述幾個方面其實都考慮了搜索引擎檢索網頁的特點,也就是說,網頁標題設計都將有利于搜索引擎檢索作為重要因素,即使如此,作者仍然建議,與網頁內容寫作一樣,網頁標題寫作首先是給用戶看的,在這個前提之上考慮對搜索引擎檢索才有意義。可見網頁標題設計并不是一件隨意的事情,尤其對網站首頁標題設計,不可不慎重。 
  做美工看起來并不是一件容易的事情。首先,要對整個站點和企業有個大致的了解。例如:某些企業喜歡藍色的主調,你不可能去做個紅色的主調,這樣完全違背客戶的主要意愿,如果百度的標志改成五顏六色的,相信大家也不會認可的。站長的職責是規劃網站結構。同樣也需要有一定的審美觀。下面介紹了幾款常用的繪圖工具和基本知識。 
  1.源文件psd,ai,cdr的區別 
  psd文件就是用photoshop創建的,當然也必須用photoshop打開; 
  ai文件是Illustrator的。他們都是Adobe公司的。ai文件同樣也可以用photoshop打開,但打開后會載入在同一層內。 
  cdr文件是CorelDRAW的。 
  2.關于CMYK和RGB顏色模式 
  CMYK是Cyan(青)、Magenta(品紅)、Yellow(黃)、Black(黑),這是印刷上使用比較普遍的色彩模式。 
  R、G、B就是Red、Green、Blue(紅,綠,藍)三種顏色,RGB模式就是由這三種顏色為基色進行疊加而模擬出大自然色彩的色彩組合模式。我們日常用的彩色電腦顯示器、彩色電視機等的色彩都使用這種模式。 
  3.矢量圖 
  矢量圖與位圖最大的區別是,它不受分辨率的影響。因此在印刷時,可以任意放大或縮小圖形而不會影響出圖的清晰度 。 
  矢量圖:是根據幾何特性來繪制圖形,矢量可以是一個點或一條線,矢量圖只能靠軟件生成,文件占用內在空間較小,因為這種類型的圖像文件包含獨立的分離圖像,可以自由無限制的重新組合。它的特點是放大后圖像不會失真,和分辨率無關,文件占用空間較小,適用于圖形設計、文字設計和一些標志設計、版式設計等。 
  ai cdr均為矢量圖。 
  4.圖片文件jpg,gif,png,bmp的區別 
  bmp:是未經過壓縮的用點陣來表示的真彩圖片,占用磁盤空間較大 
  gif:是經過壓縮的,只能表示256種顏色,占用磁盤空間小,常用來演示色彩單一的成塊的卡通圖案,GIF還有一種可以表示連續的動畫。 
  png:是fireworks的圖片格式 
  jpg:也是有損壓縮格式但是它表示的顏色比較豐富,一般用來顯示真彩的照片或圖案。 
  5.名片的尺寸問題 
  名片的標準尺寸:90mmX54mm。但是加上出血上下左右各2mm,所以在設計時 
  制作尺寸必須設定為:94 x 58mm。 
  6.源文件的提供問題 
  作為設計者和客戶(這里指各站長),如果事先沒有明文協議的話 
  設計者有權不提供源文件。 
  7.什么是logo,ci,vi 
  VI是Visual Identity的縮寫,中文譯為“企業視覺識別”。VI是CI計劃的靜態識別符號,是企業理念視覺化傳達的載體,因此它項目最多,效果最為直接。VI作為視覺識別,它是外在表現,固然需要具有美感,但VI必須是MI的體現,直接反映企業的理念。因此VI設計包含這樣一些原則:即充分傳達企業理念、人性原則、民族性原則、簡潔抽象及動態原則、員工參與原則、法律原則、藝術性原則和個性原則。 
  CI是Corporate Identity的縮寫,中文譯為“企業形象”。CI計劃,是指企業有目的、有計劃、戰略性地創造出所希望的自身形象,由此提高企業的社會知名度,最終得到自己最適合的經營環境。 
  而logo只是網站或企業一個標志。 
編輯本段網頁設計的要點
  網頁設計的兩大要點是:整體風格和色彩搭配。 
  一、確定網站的整體風格 
  在這里,我提供給大家一些參考經驗: 
  1.將你的標志logo,盡可能的放在每個頁面上最突出的位置。 
  2.突出你的標準色彩。 
  3.總結一句能反映貴站精髓的宣傳標語! 
  4.相同類型的圖像采用相同效果,比如說標題字都采用陰影效果,那么在網站中出現的所有標題字的陰影效果的設置應該是完全一致的! 
  二、網頁色彩的搭配 
  1.用一種色彩。這里是指先選定一種色彩,然后調整透明度或者飽和度,這樣的頁面看起來色彩統一,有層次感。 
  2.用兩種色彩。先選定一種色彩,然后選擇它的對比色。 
  3.用一個色系。簡單的說就是用一個感覺的色彩,例如淡藍,淡黃,淡綠;或者土黃,土灰,土藍。 
  在網頁配色中,還要切記一些誤區: 
  1.不要將所有顏色都用到,盡量控制在三至五種色彩以內。 
  2.背景和前文的對比盡量要大(絕對不要用花紋繁復的圖案作背景),以便突出主要文字內容。 
  三、網頁設計的工具 
  1.dreamweaver,用與編輯HTML、ASP、JSP、PHP時的輔助工具 
  2.Frontpage 跟dreamweaver一樣,不過個人感覺還是dreamweaver好。 
  3.FLASH 網頁需要畫面流動時的首選擇 
  4. PS圖象處理軟件,一般網頁都需要有圖片相搭配,PS是款很強大的工具。 
  5.FW跟PS一樣都是圖象處理軟件,但FW偏向與對網頁的處理。[個人喜歡PS] 
  網頁設計必須注意的26個問題 
  當你在INTERNET這個信息的海洋中盡情遨游時,會發現許許多多內容豐富、創意新穎、設計獨特的個人網頁,不知道你見到這樣漂亮可人的網頁是否有點心動。一旦你具備了上網的條件,又萌發了制作主頁的念頭,那么就應該注意網頁設計時應考慮哪些方面的問題,包括網站功能和以及訪問者需要什么。你的整個設計都應該圍繞這些方面來進行。下面筆者就自己在實踐操作中的使用體會來談談網頁設計時應該考慮哪些問題,希望能給初建網站的用戶帶來一定的作用。 
  1、頁面內容要新穎 
  網頁內容的選擇要不落俗套,要重點突出一個“新”字,這個原則要求我們在設計網站內容時不能照抄別人的內容,要結合自身的實際情況創作出一個獨一無二的網站。 放眼望去,網上的許多個人主頁簡直就是"雜貨店",內容包羅萬象,題材千篇一律,人人都是"軟件下載",個個都有"網絡導航",從頭到尾找不出一絲“鮮”意。所以,我們在設計網頁時,要把功夫下在選材上。選材要盡量做到“少”而“精”,又必須突出“新”,如能堅持天天更新的話,我相信這樣的網頁一定會受到大家的歡迎。 
  2、網頁命名要簡潔 
  由于一個網站不可能就是由一個網頁組成,它有許多子頁面,為了能使這些頁面有效地被連接起來,用戶最后能給這些頁面起一些有代表性的而且簡潔易記的網頁名稱。這樣既會有助于你以后方便管理網頁,在向搜索引擎提交你的網頁時更容易被別人索引到。在給網頁命名時,最好使用自己常用的或符合頁面內容的小寫英文字母,這直接關系到頁面上的連接。 
  3、要及時更新網頁 
  網頁制作好后,不能說萬事大吉了,其實事后的工作量更大。因為網頁制作是一時的,而維護更新的工作是每天都要做的。要及時把網頁上已經作廢的連接應該立即刪除掉,比如用戶無意中點擊了頁面中的一個連接,在苦苦的等待之后,換來的是無法訪問的結果,那么他們會對你的網頁大失所望,可能以后再也不會光顧你的網頁了。若不能及時更新,也最好在主頁上發布信息,告訴前來訪問的朋友,因有特殊情況需要離開一段時間,未能及時更新主頁,希望各位見諒,這樣就能給人一種對別人負責的感覺,同時能得到網友的信任。 
  4、注意視覺效果 
  設計Web頁面時,一定要用1024*768的分辨率來 分別觀察。許多瀏覽器使用1024*768的分辨率,盡管在1280*1024高分辨率下一 些Web頁面看上去很具吸引力,但在1024*768的模式下可能會黯然失色。作一點小小的努力,設計一個在不同分辨率下都能正常顯示的網頁 
  5、隨時注意網站升級 
  時刻注意網站的運行狀況。性能很好的主機隨著訪問人數的增加,可能會運行緩慢。但是,如果你不想失去訪問者的話,一定要仔細計劃好你的升級計劃。 
  6、 網頁內容要易讀 
  網站設計最重要的訣竅,恐怕就是你的網頁要易讀 。這就意味著,你必須花點心思來規劃文字與背景顏色的搭配方案。 注意不要使背景的顏色沖淡了文字的視覺效果,別用花里胡哨的色彩組合,讓人看起來你的網頁來很費勁。一般來說,淺色背景下的深色文字為佳 。這個要點要求你最好別把文字的規格設得太小、也不能太大。文字太小,人家讀起來難受;文字太大,或者文字視覺效果變化頻繁,像是沖著人大喊大叫,看起來不舒服。另外,最好讓文本左對齊,而不是居中。按當代中文的閱讀習慣,文本大都居左的。當然,標題一般應該居中,因為這符合讀者的閱讀習慣。 
  7、善用表格來布局 
  不要把一個網站的內容象作報告似的一二三四地羅列出來,要注意多用表格把網站內容的層次性和空間性突出顯示出來,使人一眼就能看出你的網站重點突出,結構分明。 
  8、 少用特殊字體 
  雖然你可以在你的HTML中使用特殊的字體,但是,你不可能預測你的訪問者在他們的計算機上將看到什么。在你的計算機里看起來相當好的頁面,在另一個不同的平臺上看起來可能非常糟糕。一些網站設計員喜歡使用來定義特性,這雖然允許你使用特殊的字體,但是仍需要一些變通的方法,以免你所選擇的字體在訪問者的計算機上不能顯示。級聯風格表CSS有助于解決這些問題,但是只有最新版的瀏覽器才支持CSS。 
  9、多學習和使用HTML 
  為了成功地設計網站,你必須理解HTML是如何工作的。大多數的網站設計者建議網絡新手應從有關HTML的書中去尋找答案,用Notepad制作網頁。因為用HTML設計網站,可以控制設計的整個過程。但是,如果你僅僅是網站設計的新手,你應該尋找一個允許修改HTML的軟件包。HomeSite4是一個很好的Web設計工具。在設計過程中,HomeSite4能幫助你學習HTML。它還允許你切換到所見即所得的模式,以便你在把網站發送到Web之前,預覽你的網站。 
  10、盡量少用Java程序 
  不要使用大幅面的Java程序,能夠用java script替代效果的則盡量不要使用java.因為目前來講java的運行速度實在慢的讓人無法忍受,往往使瀏覽者沒有耐心等頁面全部顯示出來,這樣你的精心設計便毫無效果啦。 
  11、 少放網站地圖 
  許多設計者把他們的網站地圖放在網站上,這種做法,卻是弊大于利。絕大部分的訪問者上網是尋找一些特別的信息,他們對于你的網站是如何工作的,并沒有興趣。如果你覺得你的網站需要地圖,那很可能是需要改進你的導航和工具條。 
  12、要為圖片附加注釋文字 
  給每個圖形加上文字的說明,在出現之前就可以看到相關內容,尤其是導航按鈕和大圖片更應如此。這樣一來,用戶在訪問你的站點時就有一種親切感覺,認為你心細,比較善解人意,時時刻刻為他人著想,相信你的好心會有好報的。 
  13、做個網站介紹 
  一個簡單明了的網站介紹,不僅能讓別人對你的網站能夠提供些什么有個了解,引發共鳴或是表達你的誠意,常常最能打動讀者,而且還能使訪問者能快速找到想要的東西。但是,許多設計者都沒有這樣做。有效的導航條和搜索工具使人們很容易找到有用的信息,這對訪問者很重要。告訴訪問者你所提供的正是他們想要的信息。 
  14、考慮瀏覽器的兼容性 
  當然現在IE所占的市場份額越來越大,但是我們仍然需要考慮到Netscape以及Opera這些瀏覽器用戶。設計風格的考慮,如色彩的搭配,圖形、線條的使用等等。要時刻為用戶著想,必須最少在幾種不同類型的瀏覽器下測試網站,看看兼容性如何。 
  15、不宜多用閃爍文字 
  有的設計者想通過閃爍的文字來引起訪問者的注意是可以被人理解的,但一個頁面中最多不能有三處閃爍文字,太多了給用戶一種眼花繚亂的感覺,反而會影響用戶去訪問該網站的其他內容,正所謂“物極必反”也, 
  16、每個頁面都要有導航按鈕 
  應當避免強迫用戶使用工具欄中的向前和向后按鈕。你的設計應當使用戶能夠很快地找到他們所要的東西。絕大多數好的站點在每一頁同樣的位置上都有相同的導航條,使瀏覽者能夠從每一頁上訪問網站的任何部分。 
  17、避免長文本頁面 
  在一個站點上有許多只有文本的冗長頁面,是令人乏味的,人們為了閱讀這些長文本,不得不使用卷滾條,從而也浪費了用戶在網上沖浪的時間。如果你有大量的基于文本的文檔,應當以Adobe Acrobat格式的文件形式來放置,以便你的訪問者能離線閱讀,從而節省寶貴的時間。 
  18、 網頁風格要統一 
  你網頁上所有的圖像、文字,包括像背景顏色、區分線、字體、標題、注腳什么的,要統一風格,貫穿全站。這樣子讀者看起來舒服、順暢,會對你的網站留下一個“很專業”的印象。 
  19、動畫最多只用一個 
  大家都喜歡用GIF動畫來裝飾網頁,它的確很吸引人,但我們在選擇時,是否能確定必須用GIF動畫,如果答否,那么就選擇靜止的圖片,因為它的容量要小得多。同樣的尺寸的LOGO,GIF動畫的容量有5K,而靜止LOGO的只有3K。雖然只有2K之差,但多起來,就會影響下載的速度,所以,如果有些不是必須的,就選擇最小的。 
  20、善用圖像 
  用戶在網上四處漫游,你必須設法吸引和維護他們對你的主頁的注意力。萬維網的其中一個最重大資源是其多媒體能力,所以我們無論如何要善加利用。主頁上最好有醒目的圖像、新穎的畫面、美觀的字款,使其別具特色,令人過目不忘。圖像的內容應有一定的實際作用,切忌虛飾浮夸。注意圖畫可以彌補文字之不足,但并不能夠完全取代文字。很多用戶把瀏覽軟件設定為略去圖像,以求節省時間他們只看文字。因此,制作主頁時,必須注意將圖像所連接的重要信息或聯接其他頁面的指示用文字重復表達幾次,同時要注意避免使用過大的圖像,如果不得不放置大的圖像在網站上,就最好使用Thumbnails軟件,把圖像的縮小版本的預覽效果顯示出來,這樣用戶就不必浪費金錢和時間去下載他們根本不想看的大圖像。 
  21、 網站導航要清晰 
  所有的超鏈接應清晰無誤地向讀者標識出來,所有導航性質的設置,像圖像按鈕,都要有清晰的標識,讓人看得明白,千萬別光顧視覺效果的熱鬧的,而讓人家不知東西南北。鏈接文本的顏色最好用約定俗成的:未訪問的,藍色;點擊過的,紫色或栗色。總之,文本鏈接一定要和頁面的其他文字有所區分,給讀者清楚的導向 。 
  22、最好不用記數器 
  由于計數器也是由程序設計成的,顯示計數器的過程其實就是在執行一個程序的過程,它需要占用用戶寶貴的上網時間,況且大多數瀏覽者認為計數器毫無意義,它們很容易被做假,瀏覽者也不想看廣告。因此筆者建議不要輕易考慮在你的網站上放置一個醒目的點擊記數器。你設計網站是為了給訪問者提供服務,而不是推銷你自己認為重要的東西。如果你顯示你的網站是多么受歡迎,你最好提供一個鏈接,顯示訪問日志。 
  23、不能忽視錯別字 
  一個好的網站對設計的每一個細節都不會放過,哪怕是一個微小的拼寫錯誤都是絕對不能出現的。但是遺憾的是,許多設計者都缺少這種技能。確保你拼寫正確,并且格外注意平常容易誤寫的錯別字,要時時刻刻保持一種嚴謹的科學態度。 
网上赚小钱的app