知識不僅是指課本的內(nèi)容,還包括社會(huì)經(jīng)驗(yàn)、文明文化、時(shí)代精神等整體要素,才有競爭力,知識是新時(shí)代的資本,五六十年代人靠勤勞可以成事；今天的香港要搶知識,要以知識取勝 個(gè)人網(wǎng)站設(shè)計(jì)及實(shí)現(xiàn)作 者：張 鐸指導(dǎo)教師：劉向嬌摘要：網(wǎng)絡(luò)發(fā)展到今天建立網(wǎng)站已經(jīng)成為一個(gè)很普遍的問題了對于企業(yè)家來說建立好的網(wǎng)站可以搶占新世紀(jì)發(fā)展的戰(zhàn)略要點(diǎn)建立新的企業(yè)形象直接開拓國際市場對于個(gè)人來說建設(shè)好的個(gè)人網(wǎng)站可以更加方便的收集信息開展更加直接的網(wǎng)絡(luò)交流使用自己構(gòu)造的平臺(tái)可以為畢業(yè)后找工作做好充分的準(zhǔn)備在我的個(gè)人網(wǎng)站制作過程中主要是針對我網(wǎng)站設(shè)計(jì)的方向和目的、網(wǎng)站設(shè)計(jì)的整個(gè)流程出發(fā)然后通過自己設(shè)計(jì)的這個(gè)個(gè)人網(wǎng)站作品來說明并演示一個(gè)網(wǎng)站制作過程這篇論文的主要內(nèi)容是個(gè)人網(wǎng)站的設(shè)計(jì)思想整體規(guī)化及相關(guān)的基礎(chǔ)科知識網(wǎng)站的規(guī)化又包括網(wǎng)頁的結(jié)構(gòu)、欄目的設(shè)置、網(wǎng)頁的風(fēng)格、顏色的搭配、版面的布局、文字圖片的運(yùn)用等關(guān)鍵詞：網(wǎng)站設(shè)計(jì)；網(wǎng)站規(guī)化；網(wǎng)站主題 隨著經(jīng)濟(jì)的發(fā)展計(jì)算機(jī)以被應(yīng)用到社會(huì)生活的各個(gè)領(lǐng)域這給人們的生活帶來很大的方便如今已成為人們?nèi)粘Ｉ钪胁豢苫蛉鄙俚牟糠秩藗兛梢宰悴怀鰬羯暇W(wǎng)購物隨時(shí)查詢股票信息在自己的博客上盡情發(fā)表言論.以上這些都離不開最基本的網(wǎng)頁設(shè)計(jì)和制作1 網(wǎng)站作為網(wǎng)絡(luò)信息主要的表現(xiàn)形式而且還是互聯(lián)網(wǎng)信息的主要承載者在互聯(lián)網(wǎng)上表現(xiàn)出及其重要的地位并發(fā)揮著及其重要的作用無論是在國內(nèi)還是國外都得以迅速的發(fā)展和壯大并被人們重視和關(guān)注網(wǎng)站的迷人之處在于綜合使用文本、圖像、聲音、動(dòng)畫視頻信息和內(nèi)容具有豐富的多媒體表現(xiàn)與互動(dòng)特點(diǎn)毋庸置疑網(wǎng)站已成為最吸引人的也是最有效的信息傳遞的手段和方式隨著網(wǎng)絡(luò)技術(shù)的發(fā)展各類網(wǎng)站紛紛出現(xiàn)個(gè)人網(wǎng)站也成為了一種時(shí)尚越來越多的人希望擁有自己的網(wǎng)站開辟網(wǎng)絡(luò)世界的一片天地展示自己的才華和風(fēng)格2 個(gè)人網(wǎng)站是指個(gè)人因某種興趣、擁有某種專業(yè)技術(shù)提供某種服務(wù)或把自己的作品、商品展示銷售而制作的具有獨(dú)立空間域名的網(wǎng)站所謂個(gè)人網(wǎng)站就是指網(wǎng)站內(nèi)容是介紹自己的或是以自己的信息為中心的網(wǎng)站3 一 網(wǎng)站設(shè)計(jì)規(guī)化 1.1 什么是網(wǎng)站網(wǎng)站是因特網(wǎng)上的一個(gè)信息集中點(diǎn)可以通過域名進(jìn)行訪問網(wǎng)站要存儲(chǔ)在獨(dú)立服務(wù)器或者服務(wù)器的虛擬主機(jī)上才能接受訪問網(wǎng)站是有獨(dú)立域名、獨(dú)立存放空間的內(nèi)容集合這些內(nèi)容可能是網(wǎng)頁也可能是程序或其他文件不一定要有很多網(wǎng)頁只要有獨(dú)立域名和空間哪怕只有一個(gè)頁面也叫網(wǎng)站網(wǎng)站就是在互聯(lián)網(wǎng)上的一塊固定的面向全世界發(fā)布消息的地方它由域名和網(wǎng)站空間構(gòu)成衡量一個(gè)網(wǎng)站的性能通常從網(wǎng)站空間大小、網(wǎng)站位置、網(wǎng)站連接速度、網(wǎng)站軟件配置、網(wǎng)站提供服務(wù)等幾方面考慮1.2 網(wǎng)站建設(shè)的目的網(wǎng)站的建設(shè)不僅僅是制作主頁的問題還需要考慮網(wǎng)站的定位、目標(biāo)用戶、網(wǎng)站內(nèi)容、服務(wù)事項(xiàng)、空間方案、安全性、藝術(shù)設(shè)計(jì)等等任何網(wǎng)站在建設(shè)之前都必須明確文向、用途和服務(wù)群體等一系列的問題寫出詳細(xì)的建站計(jì)劃可以說這是網(wǎng)站建設(shè)的根源和核心所在這里我的個(gè)人網(wǎng)站主要是讓更多的人認(rèn)識到我了解我借助網(wǎng)絡(luò)的這個(gè)平臺(tái)來展示我自己還有我希望能交到和我一樣懷著夢想起航的朋友1.3 本站的明確目的不同的網(wǎng)站目的要求通過不同的方式來實(shí)現(xiàn)一個(gè)展示個(gè)人能力的網(wǎng)站與一個(gè)以花卉種植為主題的網(wǎng)站以及一個(gè)大型門戶網(wǎng)站和一個(gè)小型企業(yè)網(wǎng)站其出發(fā)點(diǎn)和建站目的都有所不同在整個(gè)網(wǎng)站的建設(shè)規(guī)化方面的要求也是肯定不一樣的因此在規(guī)化我的網(wǎng)站時(shí)我選擇的是與我本人相關(guān)的內(nèi)容來作為主題的 網(wǎng)站預(yù)計(jì)的用戶群體：對于網(wǎng)站的設(shè)計(jì)者和建設(shè)者來說在設(shè)計(jì)規(guī)化網(wǎng)站時(shí)必須要明確自己網(wǎng)站的瀏覽都也就是確定自己的用戶群體在已經(jīng)確定了建設(shè)目的的前提下應(yīng)根據(jù)建站方向所會(huì)導(dǎo)致出現(xiàn)的不同用戶群體的需求來規(guī)化設(shè)計(jì)整個(gè)網(wǎng)站我的這個(gè)網(wǎng)站就確定了以懷著夢想奮斗的人為用戶群體1.4 軟件準(zhǔn)備在網(wǎng)頁的設(shè)計(jì)過程中因人而宜每個(gè)人使用的軟件也許不同 Dreamweaver與Flash、 Fireworks這3者被用戶稱為網(wǎng)頁設(shè)計(jì)三劍客Dreamweaver的優(yōu)勢在于它不僅是優(yōu)秀的所見即所得的編輯軟件同時(shí)也兼顧了HTML源代碼可以讓用戶很方便地在兩種模式之間的切換 Dreamweaver采用所見即所得的直觀設(shè)計(jì)模式充分尊重設(shè)計(jì)人員的原始意識和想像力它成功地將網(wǎng)頁設(shè)計(jì)功能中的技術(shù)實(shí)現(xiàn)部分和設(shè)計(jì)部分分開還提供眾多的可視化設(shè)計(jì)工具、應(yīng)用開發(fā)環(huán)境以及代碼編輯支持如利用鼠標(biāo)拖曳來添加表格、圖像等元素在方檔中直接輸入文本直接插入一些常用的特殊符號對象等用戶在沒有輸入代碼的情況下完成了上述工作Dreamweaver自動(dòng)將結(jié)果轉(zhuǎn)換為HTML源代碼用戶也可以隨時(shí)查看方檔的HTML源代碼在代碼視圖中進(jìn)行修改 二 網(wǎng)站的總體設(shè)計(jì) 2.1 確定網(wǎng)站主題做網(wǎng)站首先必須要解決的就是網(wǎng)站內(nèi)容問題即確定網(wǎng)站的主題如果自己在某些方面有興趣或掌握的資料越多也可以做一個(gè)自己感興趣的東西你可以有自己的見解做出自己的特色對于內(nèi)容主題的選擇要做到小而精主題定位要小內(nèi)容要精不要去試圖制作一個(gè)包羅萬象的站點(diǎn)這往往會(huì)失去網(wǎng)站的特色也會(huì)帶來高強(qiáng)度的勞動(dòng)給網(wǎng)站的及時(shí)更新帶來困難我的網(wǎng)站主題是以我個(gè)人相關(guān)的資料來制作的2.2 確定網(wǎng)站形象網(wǎng)站形象的設(shè)計(jì)可以從網(wǎng)站標(biāo)志、網(wǎng)站色彩、網(wǎng)站字體網(wǎng)絡(luò)宣傳語等這些方面著手網(wǎng)站色彩網(wǎng)站給人的第一印象來自視覺沖擊不同的色彩搭配產(chǎn)生不同的效果并可能影響到訪問者的情緒標(biāo)準(zhǔn)色彩是指能體現(xiàn)網(wǎng)站形象和延伸內(nèi)涵的色彩給人以整體統(tǒng)一的感覺我個(gè)人網(wǎng)站的色彩是以粉色為主淡粉色和冰粉色為輔給人一種浪漫的感覺仿佛生活在虛幻的世界里 網(wǎng)站字體和標(biāo)準(zhǔn)色彩一樣標(biāo)準(zhǔn)字體是指用于標(biāo)題、主菜單的特有字體為了體現(xiàn)網(wǎng)站的特有風(fēng)格可以根據(jù)自已網(wǎng)站所表達(dá)的內(nèi)涵選擇更貼切的字體我的個(gè)人網(wǎng)站的標(biāo)準(zhǔn)字體是幼圓給人一種沉穩(wěn)而不失俏皮的感覺2.3 確定網(wǎng)站風(fēng)格 風(fēng)格是抽象的是指網(wǎng)站的整體形象給瀏覽者的綜合感受這個(gè)整體形象包括網(wǎng)站的標(biāo)志、色彩、字體、標(biāo)語等諸多因素網(wǎng)站是可以平易近人、生動(dòng)活潑的也可以是專業(yè)嚴(yán)肅的不管是色彩、技術(shù)、文字、布局、還是交互方式只要你能由此讓瀏覽者明確的分辨出這是你網(wǎng)站獨(dú)所有的這就形成了風(fēng)格 風(fēng)格是有人性的通過網(wǎng)站的色彩、技術(shù)、文字、布局、交互方式可以概括出一個(gè)網(wǎng)站的個(gè)性；我的網(wǎng)站風(fēng)格是以浪漫為主給人一種夢幻的感覺2.4 確定網(wǎng)站內(nèi)容我的個(gè)人網(wǎng)站大體上包括了一些內(nèi)容：首頁、網(wǎng)頁設(shè)計(jì)、動(dòng)畫特效、網(wǎng)頁素材、相關(guān)軟件、作品展示、本站論壇、游客留言等網(wǎng)站常用內(nèi)容方便大家瀏覽三 具體實(shí)現(xiàn)與分析 3.1 首頁一個(gè)網(wǎng)站的首頁是一個(gè)文檔當(dāng)一個(gè)網(wǎng)站服務(wù)器收到一臺(tái)電腦上網(wǎng)絡(luò)瀏覽器的訊息連結(jié)請求時(shí)便會(huì)向這臺(tái)電腦發(fā)送這個(gè)文檔當(dāng)在瀏覽器的位址列輸入域名而未指向特定目錄或檔案時(shí)通常瀏覽器也會(huì)打開網(wǎng)站的首頁 網(wǎng)站首頁往往會(huì)被編輯得易于了解該網(wǎng)站提供的資訊并引導(dǎo)互聯(lián)網(wǎng)用戶瀏覽網(wǎng)站其他部分的內(nèi)容這部分內(nèi)容一般被認(rèn)為是一個(gè)目錄性質(zhì)的內(nèi)容如圖1 圖13.2 網(wǎng)頁設(shè)計(jì)模塊 為了滿足廣大網(wǎng)頁制作愛好者的學(xué)習(xí)需求本網(wǎng)站推出新版的網(wǎng)頁制作教程該教程使用Dreamweaver CS5作為開發(fā)工具結(jié)合老師的網(wǎng)站開發(fā)經(jīng)驗(yàn)為大家講解網(wǎng)頁制作的每個(gè)環(huán)節(jié)希望通過本套課程的學(xué)習(xí)大家能靈活運(yùn)用Dreaweaver完成網(wǎng)站的開發(fā)如圖2 圖23.3 網(wǎng)頁特效模塊 提供包括鼠標(biāo)類類、文字類、菜單類、背景類、圖形類、播放器等網(wǎng)頁特效代碼力求做到收集最全網(wǎng)站可能的關(guān)注這方面的最新發(fā)展趨勢不斷更新自己的網(wǎng)站盡可能的收集最新的網(wǎng)頁特效代碼如圖3圖33.4 網(wǎng)頁素材模塊提供各種新式素材包含圖片、動(dòng)畫、flash、音樂等方便網(wǎng)頁及網(wǎng)站制作時(shí)參考即借鑒之用如圖4圖43.5 相關(guān)軟件下載模塊 提供網(wǎng)站及網(wǎng)頁制作所需的必要工具如Dreamweaver、Flash、 Fireworks等相關(guān)必備軟件下載如圖5圖53.6 作品展示模塊提供多種多樣名人或企業(yè)個(gè)人網(wǎng)站供大家學(xué)習(xí)參考豐富大家的知識詳細(xì)內(nèi)容如圖6所示圖63.7 論壇及留言模塊論壇又名網(wǎng)絡(luò)論壇BBS全稱為Bulletin Board System（電子公告板）或者Bulletin Board Service（公告板服務(wù)）是Internet上的一種電子信息服務(wù)系統(tǒng)它提供一塊公共電子白板每個(gè)用戶都可以在上面書寫通過留言的方式可發(fā)布信息或提出看法它是一種交互性強(qiáng)內(nèi)容豐富而及時(shí)的Internet電子信息服務(wù)系統(tǒng)用戶在BBS站點(diǎn)上可以獲得各種信息服務(wù)發(fā)布信息進(jìn)行討論聊天等等如圖7所示圖7四 總結(jié) 經(jīng)過老師耐心細(xì)致的指導(dǎo)及同學(xué)之間的相互交流同時(shí)翻閱了大量的資料(包括網(wǎng)上資料、書本及學(xué)校的一些相關(guān)資料)經(jīng)過近一段時(shí)間的努力個(gè)人網(wǎng)站的設(shè)計(jì)制作告一段落總結(jié)這次揚(yáng)帆起航-個(gè)人網(wǎng)站開發(fā)制作過程我使用了目前因特網(wǎng)上比較流行的各種靜態(tài)制作方法及交互動(dòng)態(tài)網(wǎng)站的制作設(shè)計(jì)手段并對初步利用后臺(tái)程序完成了網(wǎng)站的動(dòng)態(tài)響應(yīng)與生成網(wǎng)頁的技術(shù)同時(shí)也從中學(xué)習(xí)了對靜態(tài)網(wǎng)頁的處理風(fēng)格色彩搭配頁面導(dǎo)航方面有了一定的經(jīng)驗(yàn) 目前網(wǎng)站的制作技術(shù)與要求都已經(jīng)告別了因特網(wǎng)初期網(wǎng)站制作的幼稚期隨著各類網(wǎng)站的迅速增加與瀏覽者需求的提高無不要求網(wǎng)站從立意、策劃、頁面設(shè)計(jì)到后臺(tái)程序的全面提高無論是個(gè)人網(wǎng)站還是企業(yè)網(wǎng)站都必須被要求從瀏覽者角度出發(fā)最大限度的滿足用戶的要求這也是以后各類網(wǎng)站發(fā)展競爭的真正實(shí)質(zhì)所在 本次設(shè)計(jì)由于設(shè)計(jì)時(shí)間比較緊且相關(guān)模塊比較多加之設(shè)計(jì)經(jīng)驗(yàn)的不足在網(wǎng)站的整體設(shè)計(jì)及各模塊功能可能設(shè)計(jì)的不完全有待于進(jìn)一步的完善和改進(jìn) 參 考 文 獻(xiàn)1 http:/ http:/ http:/ website design and RealizationZhang DuoAbstract: the network development to today to establish the website has become a very common problem. For the entrepreneur build good website can seize strategic points of development in the new century. To establish a new corporate image to open up international market directly. For an individual build good personal website can be more convenient to collect information carry out more direct communication using the constructed their own platform can find a job after graduation fully prepared.In my personal website design process is mainly based on our web site design web site design purpose and direction of the entire process and through their own design of this personal website works to explain and demonstrate a website production process. The main content of this thesis is a personal website design overall planning and related basic knowledge. Site planning and webpage structure section design webpage style color layout of the layout text and images using. There are the theme of the site is to be included in the main contents a site must have a clear theme especially the personal web site not as separate webpage that becomes less content while the single so to find the content they are interested in so deep so thoroughly show their own characteristics so as to leave deep impression.Keywords: website design； website programming；website theme ?第 1 頁 （共 9 頁）