第一篇：網(wǎng)頁制作期末論文
關(guān)于網(wǎng)頁制作的相關(guān)基本問題
摘要：隨著網(wǎng)絡(luò)的發(fā)展，網(wǎng)頁的制作越來越重要。網(wǎng)頁制作要能充分吸引訪問者的注意力，讓訪問者產(chǎn)生視覺上的愉悅感，就必須要把網(wǎng)頁設(shè)計(jì)和網(wǎng)頁制作結(jié)合起來。要想制作出理想的網(wǎng)頁，除了要有一定的網(wǎng)頁制作基礎(chǔ)外，還要正確選擇開發(fā)工具。在本文中，簡單介紹了網(wǎng)頁制作的相關(guān)技術(shù)、網(wǎng)頁制作的一般方法過程及應(yīng)該注意的問題。初學(xué)網(wǎng)頁制作，要注意網(wǎng)頁布局、網(wǎng)頁色彩搭配及線條、文字、目錄等細(xì)節(jié)的處理，并不斷修改、完善。
關(guān)鍵詞：網(wǎng)頁制作；一般方法過程；網(wǎng)頁布局；色彩搭配。
一、網(wǎng)頁制作的相關(guān)技術(shù)
（一）常用制作工具：
1.Dreamweaver：Dreamweaver是美國Macromedia公司開發(fā)的一款集網(wǎng)頁制作和管理網(wǎng)站于一身的可視化網(wǎng)頁編輯器，它是第一套針對(duì)專業(yè)網(wǎng)頁設(shè)計(jì)師特別發(fā)展的視覺化的網(wǎng)頁開發(fā)工具，是最受專業(yè)設(shè)計(jì)者歡迎的網(wǎng)頁制作工具之一，利用它可以輕而易舉地制作出跨越平臺(tái)限制和跨越瀏覽器限制的充滿動(dòng)感的網(wǎng)頁。其中重點(diǎn)介紹CS5的新功能：
①CSS檢查新增功能，以可視方式顯示詳細(xì)的CSS 框模型，輕松切換 CSS 屬性并且無需讀取代碼或使用其他實(shí)用程序。
②與 Adobe BrowserLab 集成新增功能，使用多個(gè)查看、診斷和比較工具預(yù)覽動(dòng)態(tài)，網(wǎng)頁和本地內(nèi)容。
③PHP 自定義類代碼提示新增功能，為自定義 PHP 函數(shù)顯示適當(dāng)?shù)恼Z法，幫助您更準(zhǔn)確地編寫代碼。
④CSS Starter頁增強(qiáng)功能，借助更新和簡化的 CSS Starter 布局，快速啟動(dòng)基于標(biāo)準(zhǔn)的網(wǎng)站設(shè)計(jì)。
2.Frontpage是微軟公司出品的一款網(wǎng)頁制作入門級(jí)軟件，可以在可視化的方式下簡單直觀的實(shí)現(xiàn)HTML幾乎所有的功能，例如：新建和修改一個(gè)網(wǎng)頁、新建一個(gè)Web站點(diǎn)，在網(wǎng)頁中插入圖片、多媒體等眾多功能。FrontPage使用方便簡單，會(huì)用Word就能做網(wǎng)頁，該軟件結(jié)合了設(shè)計(jì)、程式碼、預(yù)覽三種模式。也可一起顯示程式碼和設(shè)計(jì)檢視與Microsoft Office各軟件無縫連接，良好的表格控制能力，繼承了Microsoft Office產(chǎn)品系列的良好的易用性。但 Frontpage 也有其不足之處：
①瀏覽器兼容性不好，做出來的網(wǎng)頁，用 Netscape 往往不能正常顯示； ②生成的垃圾代碼多，也會(huì)自動(dòng)修改代碼，導(dǎo)致在某些情況下極為不便； ③對(duì)DHTML的支持不好。微軟在2006年年底前停止提供FrontPage軟件。3.Flash：Flash是由Macromedia公司開發(fā)的一款優(yōu)秀的網(wǎng)頁動(dòng)畫開發(fā)軟件，從簡單的動(dòng)畫到交互式Web應(yīng)用程序，它使用戶可以創(chuàng)建任何作品。網(wǎng)頁設(shè)計(jì)者使用 Flash 創(chuàng)作出既漂亮又可改變尺寸的導(dǎo)航界面以及其它奇特的效果。2012年8月15日，F(xiàn)lash退出Android平臺(tái)，正式告別移動(dòng)端。
（二）材料的選取
1.先大后小
先把大的結(jié)構(gòu)設(shè)計(jì)好，然后再逐步完善小的結(jié)構(gòu)設(shè)計(jì)。2.先簡單后復(fù)雜
先設(shè)計(jì)出簡單的內(nèi)容，然后再設(shè)計(jì)復(fù)雜的內(nèi)容，以便出現(xiàn)問題時(shí)好修改。3.多靈活運(yùn)用模板，提高制作效率
二、網(wǎng)頁制作的一般方法過程
（一）網(wǎng)站的結(jié)構(gòu)
1.網(wǎng)頁頁面的創(chuàng)建
①在Dreamveaver“文件－新建－常規(guī)－基本頁－HTML”，這樣就建好了一個(gè)頁面，英文版的默認(rèn)的文件名為untitled.htm，htm表示這個(gè)網(wǎng)頁文件是一個(gè)靜態(tài)的HTML文件。給它改名為index.htm。
注：網(wǎng)站第一頁的名字通常是index.htm或index.html。其它頁面的名字可以自己取。這也就是主頁，上傳后打開網(wǎng)頁默認(rèn)連接到此頁。
②在標(biāo)題空格里輸入網(wǎng)頁名稱，點(diǎn)擊修改－頁面屬性，打開“頁面屬性”窗口。在這里可以設(shè)置網(wǎng)站的標(biāo)題、背景顏色或背景圖像，超級(jí)鏈接的顏色（一般默認(rèn)即可）。③此時(shí)光標(biāo)位于左上角，可輸入一句話，如“歡迎來到我的主頁”。選取文字，用菜單“窗口/屬性”打開屬性面板，選取文字大小為6，再使文字居中，然后在文字前用幾個(gè)回車使其位于頁面中間等。
2.欄目的設(shè)置
網(wǎng)站的題材確定后，收集和組織相關(guān)的資料內(nèi)容。為了吸引網(wǎng)友們來瀏覽網(wǎng)站，需將吸引人的內(nèi)容放在最突出的位置，讓好東西在版面分布上占絕對(duì)優(yōu)勢(shì)。
欄目的實(shí)質(zhì)是一個(gè)網(wǎng)站的大綱索引，索引應(yīng)該將網(wǎng)站的主體明確顯示出來。在制定欄目的時(shí)候，要仔細(xì)考慮，合理安排。一般的網(wǎng)站欄目安排要注意：
①緊扣主題，主題欄目個(gè)數(shù)在總欄目中要占絕對(duì)優(yōu)勢(shì)，這樣主題突出，容易給人留下深刻印象。
②設(shè)一個(gè)最近更新欄目或網(wǎng)站指南欄目，可以照顧到常來的訪客，并幫助初訪者快速找到他們想要的內(nèi)容，讓主頁更人性化。
③設(shè)定類似論壇、留言本可以雙向交流的欄目，可以讓瀏覽者留下他們的信息?；蛘吡粢粋€(gè)“Email me”的站點(diǎn)，更具親和力。
（二）網(wǎng)站的風(fēng)格
網(wǎng)站風(fēng)格是網(wǎng)站頁面設(shè)計(jì)上的視覺元素組合在一起的整體形象，展現(xiàn)給人的直觀感受，包括網(wǎng)站的配色、字體、布局、內(nèi)容等因素。
1.協(xié)調(diào)運(yùn)用顏色
不同的色彩影響著人們對(duì)網(wǎng)站的第一感覺，一般旅游和園林類型的網(wǎng)站使用綠色系比較多，藍(lán)色則被譽(yù)為是企業(yè)色確實(shí)很多企業(yè)和政府機(jī)關(guān)都偏愛使用沉穩(wěn)而大方的藍(lán)色。
一個(gè)網(wǎng)站必須有一種或兩種主題色，既不至于讓客戶迷失方向，也不至于單調(diào)、乏味。通常情況下，一個(gè)頁面內(nèi)盡量不要使用超過4種色彩，太多的色彩容易讓人感覺沒有方向、沒有側(cè)重。當(dāng)主題色確定好以后，考慮配色時(shí)，一定要考慮其他配色與主題色的關(guān)系，要體現(xiàn)什么樣的效果。
2.適當(dāng)選擇線條和形狀
文字、標(biāo)題、圖片等的組合，會(huì)在頁面上形成各種各樣的線條和形狀。這些線條與形狀的組合，構(gòu)成了主頁的總體藝術(shù)效果。必須注意搭配好這些線條和形狀，才能增強(qiáng)頁面的藝術(shù)魅力。直線條的藝術(shù)效果是流暢、整齊的，直線和矩形在頁面上的重復(fù)組合可以呈現(xiàn)井井有條的視覺效果。一般應(yīng)用于比較莊重嚴(yán)肅的主頁題材。曲線的效果是活躍的，具有動(dòng)感，曲線和弧形在頁面上的重復(fù)組合可以呈現(xiàn)輕快、富有活力的視覺效果。一般應(yīng)用于青春、活潑的主頁題材。把以上兩種線條和形狀結(jié)合起來運(yùn)用，可以大大豐富主頁的表現(xiàn)力，使頁面呈現(xiàn)更加豐富多彩的藝術(shù)效果，但處理不好會(huì)產(chǎn)生凌亂的效果。
3.均衡的分割版式：
在網(wǎng)頁設(shè)計(jì)中，頁面因?yàn)閮?nèi)容元素的需要被分割成很多區(qū)塊，區(qū)塊之間的均衡就是版式設(shè)計(jì)上需要著重考慮的問題。一幅好的、均衡的網(wǎng)頁版面設(shè)計(jì)，是布局、重心、對(duì)比等多種形式原理創(chuàng)造性全面應(yīng)用的結(jié)果。傳統(tǒng)網(wǎng)頁設(shè)計(jì)的版式控制都是在不超越大眾顯示器分辨率寬度的前提下，依照內(nèi)容多少縱向延展設(shè)計(jì)。而如今流行的產(chǎn)品型網(wǎng)站，更傾向于在一屏內(nèi)表達(dá)最主要的東西，尤其是首頁，盡量不出現(xiàn)滾動(dòng)條。
4．顏色搭配
在網(wǎng)頁設(shè)計(jì)中，如何配色并不固定，只是與人的視覺有關(guān)。比如冷色基調(diào)，就大都以冷色，如要用暖色就要多加注意，可能會(huì)影響視覺，使游覽者眼睛不適。亮色的使用更吸引人的眼球，但極難搭配。比如在過節(jié)時(shí)，各大網(wǎng)站為了加強(qiáng)溫馨度就多用紅黃橙來渲染。
（三）版面布局：
版面指的是瀏覽器看到的完整的一個(gè)頁面。因?yàn)槊總€(gè)人的顯示器分辨率不同，所以同一個(gè)頁面的大小可能出現(xiàn)不同尺寸。布局，是以最適合瀏覽的方式將圖片和文字排放在頁面的不同位置。經(jīng)常用到的版面布局形式有: 1.“T”結(jié)構(gòu)布局。即頁面頂部為橫條網(wǎng)站標(biāo)志+廣告條，下方左面為主菜單，右面顯示內(nèi)容的布局。這是網(wǎng)頁設(shè)計(jì)中用的最廣泛的一種布局方式。這種布局的優(yōu)點(diǎn)是頁面結(jié)構(gòu)清晰，主次分明，缺點(diǎn)是規(guī)矩呆板，如果細(xì)節(jié)色彩上不注意，很容易讓人感覺乏味。
2.“口”型布局。即頁面一般上下各有一個(gè)廣告條，左面是主菜單，右面放友情連接等，中間是主要內(nèi)容。這種布局的優(yōu)點(diǎn)是充分利用版面，信息量大，缺點(diǎn)是頁面擁擠，不夠靈活。
3.對(duì)稱對(duì)比布局。即采取左右或者上下對(duì)稱的布局，一半深色，一半淺色，一般用于設(shè)計(jì)型站點(diǎn)。優(yōu)點(diǎn)是視覺沖擊力強(qiáng)，缺點(diǎn)是將兩部分有機(jī)的結(jié)合比較困難。
（四）文字圖片的運(yùn)用：
1.字體與字號(hào)
在同一頁面中，字體種類少，版面雅致，有穩(wěn)定感；字體種類多，則版面活躍，豐富多彩。關(guān)鍵是如何根據(jù)頁面內(nèi)容來掌握這個(gè)比例關(guān)系。從加強(qiáng)平臺(tái)無關(guān)性的角度來考慮，正文內(nèi)容最好采用缺省字體。因?yàn)闉g覽器是用本地機(jī)器上的字庫顯示頁面內(nèi)容的?？紤]到大多數(shù)瀏覽者的機(jī)器里只裝有三種字體類型及一些相應(yīng)的特定字體，而你指定的字體在瀏覽者的機(jī)器里并不一定能夠找到。
大小可以用不同的方式來計(jì)算，例如磅或像素，建議采用磅為單位。最適合于網(wǎng)頁正文顯示的字體大小為12磅左右。較大的字體可用于標(biāo)題或其他需要強(qiáng)調(diào)的地方，小一些的字體可以用于頁腳和輔助信息。小字號(hào)容易產(chǎn)生整體感和精致感，但可讀性較差。
2.行距
行距的變化也會(huì)對(duì)文本的可讀性產(chǎn)生很大影響。一般情況下，接近字體尺寸的行距設(shè)置比較適合正文。適當(dāng)?shù)男芯鄷?huì)形成一條明顯的水平空白帶，以引導(dǎo)瀏覽者的目光，而行距過寬會(huì)使一行文字失去較好的延續(xù)性。除了對(duì)于可讀性的影響，行距本身也是具有很強(qiáng)表現(xiàn)力的設(shè)計(jì)語言，為了加強(qiáng)版式的裝飾效果，可以有意識(shí)地加寬或縮窄行距，加寬行距可以體現(xiàn)輕松、舒展的情緒，應(yīng)用于娛樂性、抒情性的內(nèi)容。
3.文字的整體編排
頁面里的正文部分是由許多單個(gè)文字經(jīng)過編排組成的群體，要充分發(fā)揮這個(gè)群體形狀在版面整體布局中的作用。在網(wǎng)頁設(shè)計(jì)中，字體的處理與顏色、版式、圖形等其他設(shè)計(jì)元素的處理一樣非常關(guān)鍵。文字編排有四種基本形式：
①兩端均齊：文字從左端到右端的長度均齊，顯得端正、嚴(yán)謹(jǐn)、美觀。②居中排列：在字距相等的情況下，以頁面中心為軸線排列，產(chǎn)生對(duì)稱的形式美感。
③左對(duì)齊或右對(duì)齊：使行首或行尾自然形成一條清晰的垂直線，易與圖形配合。這種編排方式有松有緊，有虛有實(shí)，能產(chǎn)生一種節(jié)奏與韻律的形式美感。④繞圖排列：將文字繞圖形邊緣排列，令人感到融洽、自然。
三、網(wǎng)頁制作過程中應(yīng)該注意的問題
（一）文件管理
為了管理方便，我們把圖片放在“images”文件夾內(nèi)。如果圖片少，也可以放在站點(diǎn)根目錄下。注意文件名要用英文或用拼音文字命名而且使用小寫，不能用中文，否則會(huì)出現(xiàn)一些麻煩。
（二）欄目建立
在每個(gè)主目錄下都建立獨(dú)立的Images目錄。一般來說，一個(gè)站點(diǎn)根目錄下都有一個(gè)默認(rèn)的Images目錄。將所有圖片都存放在這個(gè)目錄里不方便，所以為每個(gè)主欄目建立一個(gè)獨(dú)立的Images目錄是為了方便維修和管理。
（三）目錄
①目錄的層次不要太深，不要超過3層； ②不要使用中文目錄；
③不要使用過長的目錄，不便于記憶； ④盡量使用意義明確的目錄，便于記憶和管理。
（四）字體的輸入
如要選取字體，選擇字體中的最后一項(xiàng)：編輯字體列表。然后在對(duì)話框中選+號(hào)，接著在“可用字體”欄中選擇需要加入到字體列表中的一種字體，點(diǎn)擊中間的按鈕就可以加入了。注意：
①在網(wǎng)頁上最常用的是宋體字。不要將特殊的字體加到列表中使用，因?yàn)閯e人電腦上未裝就看不到；
②在網(wǎng)頁上打入空格的辦法是：把輸入法調(diào)為全角； ③在網(wǎng)頁上換行的辦法是：shift+Enter。只按Enter則為換段。
第二篇：網(wǎng)頁制作論文
網(wǎng)頁制作論文
簡介
網(wǎng)頁制作是網(wǎng)站策劃師、網(wǎng)絡(luò)程序員、網(wǎng)頁設(shè)計(jì)師等崗位，應(yīng)用各種網(wǎng)絡(luò)程序開發(fā)技術(shù)和網(wǎng)頁設(shè)計(jì)技術(shù)，為企事業(yè)單位、公司或個(gè)人在全球互聯(lián)網(wǎng)上建設(shè)站點(diǎn)，并包含域名注冊(cè)和主機(jī)托管等服務(wù)的總稱。其作用為展現(xiàn)公司形象，加強(qiáng)客戶服務(wù)，完善網(wǎng)絡(luò)業(yè)務(wù)。網(wǎng)頁制作是企業(yè)開展電子商務(wù)的基礎(chǔ)設(shè)施和信息平臺(tái)，是INTERNET上宣傳和反映企業(yè)形象和文化的重要窗口。新競(jìng)爭力也認(rèn)為注重網(wǎng)站的網(wǎng)絡(luò)營銷價(jià)值而不是外在表現(xiàn)。網(wǎng)頁制作是指使用標(biāo)識(shí)語言，通過一系列設(shè)計(jì)、建模、和執(zhí)行的過程將電子格式的信息通過互聯(lián)網(wǎng)傳輸，瀏覽。
網(wǎng)頁制作要能充分吸引訪問者的注意力，讓訪問者產(chǎn)生視覺上的愉悅感。因此在網(wǎng)頁創(chuàng)作的時(shí)候就必須將網(wǎng)站的整體設(shè)計(jì)與網(wǎng)頁設(shè)計(jì)的相關(guān)原理緊密結(jié)合起來。網(wǎng)站設(shè)計(jì)是將策劃案中的內(nèi)容、網(wǎng)站的主題模式，以及結(jié)合自己的認(rèn)識(shí)通過藝術(shù)的手法表現(xiàn)出來。
目錄
1.網(wǎng)頁制作的兩種設(shè)計(jì)模式 2.網(wǎng)頁制作常用工具 3.flash 3.1flash簡介 3.2flash動(dòng)畫的特點(diǎn) 3.3flash動(dòng)畫的前景 3.4flash在網(wǎng)頁中的應(yīng)用 3.5flash制作流程 4.fireworks
4.1fireworks簡介
4.2fireworks在網(wǎng)頁中的應(yīng)用
4.3fireworks的重要性
4.4fireworks制作流程 5.參考文獻(xiàn)
正文
1.網(wǎng)頁制作的兩種設(shè)計(jì)模式
從前一般網(wǎng)頁都使用表格進(jìn)行排版設(shè)計(jì)，這樣作的優(yōu)點(diǎn)在于設(shè)計(jì)制作速度快，尤其在可視化網(wǎng)頁編輯器，如Microsoft FrontPage中，這樣設(shè)計(jì)顯得直觀而方便，然而這讓越來越復(fù)雜的版面需要許多不斷嵌套的表格設(shè)計(jì)，致使網(wǎng)頁代碼變得冗長復(fù)雜，使文件體積增大，且不容易被搜索引擎查找。同時(shí)，這樣做也不利于大型網(wǎng)站的改版工作。
于是隨著主流網(wǎng)頁瀏覽器對(duì)CSS的支援度提高，近年來興起了一種新的網(wǎng)頁設(shè)計(jì)模式。被業(yè)界稱為“網(wǎng)頁重構(gòu)”的革命，其核心在于分隔網(wǎng)頁的風(fēng)格和內(nèi)容，指標(biāo)記語言(如HTML,XML)負(fù)責(zé)定義頁面的內(nèi)容，但不可以定義任何涉及網(wǎng)站外觀(風(fēng)格)的東西。而網(wǎng)站風(fēng)格就由另外的CSS檔案負(fù)責(zé)。在排版方面，新的模式提倡使用由CSS定義的DIV進(jìn)行頁面排版，而將表格還原為排列數(shù)據(jù)的最初功能。這種模式有很多好處，例如可以協(xié)助搜尋引擎查找網(wǎng)頁的情況，減小文件提及提高瀏覽速度，且由于一個(gè)CSS檔案可以控制多個(gè)頁面，這也給改版帶來了很大方便。
由于W3C是該模式極力的倡導(dǎo)者，于是業(yè)界鑒定網(wǎng)頁是否符合W3C標(biāo)準(zhǔn)，就可以在W3C網(wǎng)站自動(dòng)檢測(cè)該網(wǎng)站的情況。
這種模式也有缺點(diǎn)，其中一個(gè)弱點(diǎn)就是，在不同瀏覽器出來的效果會(huì)有分別，但這種情況主要是由于微軟的Internet Explorer對(duì)CSS文檔的支持有眾多缺陷造成的。另一方面，開始設(shè)計(jì)CSS時(shí)，并不能清楚看到目標(biāo)，因此顯得不直觀。
網(wǎng)頁實(shí)際是一個(gè)文件，他存放在世界某個(gè)角落的的某一臺(tái)計(jì)算機(jī)中，而這臺(tái)計(jì)算機(jī)必須是與互聯(lián)網(wǎng)相連的。網(wǎng)頁經(jīng)由網(wǎng)址（URL）來識(shí)別與存取，當(dāng)我們?cè)跒g覽器輸入網(wǎng)址后，經(jīng)過一段復(fù)雜而又快速的程序，網(wǎng)頁文件會(huì)被傳送到你的計(jì)算機(jī)，然后再通過瀏覽器解釋網(wǎng)頁的內(nèi)容，再展示到你的眼前。
2.網(wǎng)頁制作常用工具
1、dreamweaver,用與編輯HTML、ASP、JSP、PHP時(shí)的輔助工具。Dreamweaver是美國MACROMEDIA公司開發(fā)的集網(wǎng)頁制作和管理網(wǎng)站于一身的所見即所得網(wǎng)頁編輯器，它是第一套針對(duì)專業(yè)網(wǎng)頁設(shè)計(jì)師特別發(fā)展的視覺化網(wǎng)頁開發(fā)工具，利用它可以輕而易舉地制作出跨越平臺(tái)限制和跨越瀏覽器限制的充滿動(dòng)感的網(wǎng)頁。
2、Frontpage 跟dreamweaver一樣，不過還是dreamweaver好。
3、FLASH 網(wǎng)頁需要畫面流動(dòng)時(shí)的首選擇
4、PS圖象處理軟件，一般網(wǎng)頁都需要有圖片相搭配，PS是款很強(qiáng)大的工具。
5、FW跟PS一樣都是圖象處理軟件，但FW偏向與對(duì)網(wǎng)頁的處理。
6、Adobe公司推出的cs3系列，軟件之間兼容性較好。可以用此系列對(duì)網(wǎng)站的美工特效進(jìn)行進(jìn)一步的修飾美化和優(yōu)化。
3.flash 3.1flash簡介
Flash最早出現(xiàn)并興起于網(wǎng)絡(luò)，是網(wǎng)絡(luò)多媒體動(dòng)畫的重要制作形式，它是macromedia公司推出的交互式矢量圖和 Web 動(dòng)畫的標(biāo)準(zhǔn)。網(wǎng)頁設(shè)計(jì)者使用 Flash 創(chuàng)作出既漂亮又可改變尺寸的導(dǎo)航界面以及其他奇特的效果。其運(yùn)用范圍覆蓋諸多領(lǐng)域如電視廣告、網(wǎng)絡(luò)廣告、游戲、演示動(dòng)畫、課件、網(wǎng)頁、手機(jī)動(dòng)畫等新興媒體。現(xiàn)在由于網(wǎng)絡(luò)帶寬的不斷提高，F(xiàn)lash動(dòng)態(tài)網(wǎng)頁以其具備的聲音、動(dòng)態(tài)圖像等多媒體優(yōu)勢(shì)，相信在不遠(yuǎn)的將來能夠完全替代靜態(tài)（HTML）網(wǎng)頁。
3.2flash動(dòng)畫的特點(diǎn)
（一）Flash動(dòng)畫受網(wǎng)絡(luò)資源的制約一般比較短小，利用Flash制作的動(dòng)畫是矢量的，無論把它放大多少倍都不會(huì)失真。
（二）Flash動(dòng)畫具有交互性優(yōu)勢(shì)，可以更好地滿足所有用戶的需要。它可以讓欣賞者的動(dòng)作成為動(dòng)畫的一部分。用戶可以通過點(diǎn)擊、選擇等動(dòng)作，決定動(dòng)畫的運(yùn)行過程和結(jié)果，這一點(diǎn)是傳統(tǒng)動(dòng)畫所無法比擬的。
（三）Flash動(dòng)畫可以放在網(wǎng)上供人欣賞和下載，由于使用的是矢量圖技術(shù)，具有檔小、傳輸速度快、播放采用流式技術(shù)的特點(diǎn)，因此動(dòng)畫是邊下載邊播放，如果速度控制得好，則根本感覺不到檔的下載過程。所以Flash動(dòng)畫在網(wǎng)上被廣泛傳播。
（四）Flash動(dòng)畫有嶄新的視覺效果，比傳統(tǒng)的動(dòng)畫更加輕易與靈巧，更加“酷”。不可否認(rèn)，它已經(jīng)成為一種新時(shí)代的藝術(shù)表現(xiàn)形式。
（五）Flash動(dòng)畫制作的成本非常低，使用Flash制作的動(dòng)畫能夠大大地減少人力、物力資源的消耗。同時(shí)，在制作時(shí)間上也會(huì)大大減少。
（六）Flash動(dòng)畫在制作完成后，可以把生成的檔設(shè)置成帶保護(hù)的格式，這樣維護(hù)了設(shè)計(jì)者的版權(quán)利益。
3.3flash動(dòng)畫的前景
現(xiàn)在的Flash平臺(tái)包括:Flash Studio
8、Flash Player
8、Flash in Mobile flex 1.5、以及應(yīng)用于通信行業(yè)的Breeze 5等；未來即將推出的產(chǎn)品包括Browser client Flash Player、Mobile client Flash Player、Apollo Flash+HTML的客戶端工具，以及Flex等企業(yè)端工具等。這些工具將滿足設(shè)計(jì)和開發(fā)人員跨越各種開放的和專有的平臺(tái)，包括從桌面到移動(dòng)設(shè)備，提供更豐富的網(wǎng)絡(luò)內(nèi)容和互聯(lián)網(wǎng)應(yīng)用，企業(yè)也能夠通過Flash應(yīng)用獲得更大的受益。
（一）網(wǎng)絡(luò)視頻鐘情Flash 面對(duì)全球超過100萬的Flash開發(fā)者的期望，Macromedia也不斷開發(fā)新的領(lǐng)域。而用戶對(duì)視頻應(yīng)用的垂青，刺激著Macromedia推出新的工具。在上千開發(fā)者的注目下，Macromedia推出了Flash Media Server 2，以鞏固其Flash Platform作為網(wǎng)絡(luò)視頻最佳選擇的地位
（二）Flex 2產(chǎn)品線和Flash Player 8.5出手不凡
Macromedia Flex 2產(chǎn)品線和Macromedia Flash Player 8.5是本次發(fā)布會(huì)的重頭戲。新產(chǎn)品涵蓋RIA的全部應(yīng)用場(chǎng)景，從電子商務(wù)產(chǎn)品配置，到需要與實(shí)時(shí)數(shù)據(jù)集成的可視交易應(yīng)用。
Flash Player目前在全球6億多個(gè)桌面和移動(dòng)設(shè)備上安裝,估計(jì)新版本在12個(gè)月內(nèi)將被80%的聯(lián)網(wǎng)計(jì)算機(jī)下載。Flash Player 8.5在Flash Player 8的基礎(chǔ)上增加了適合行業(yè)使用的編程功能，并構(gòu)建了先進(jìn)的跨平臺(tái)運(yùn)行時(shí)環(huán)境。它備有一個(gè)新的虛擬機(jī)，可以提供更高的運(yùn)行性能、全面的運(yùn)行錯(cuò)誤報(bào)告、增強(qiáng)型調(diào)試功能以及支持ActionScript 3。ActionScript 3遵守最新的ECMA Script規(guī)范，能夠更易于查找及解決問題，從而提高開發(fā)人員的工作效率。
3.4flash在網(wǎng)頁中的應(yīng)用
在網(wǎng)絡(luò)高速發(fā)展的今天,越來越多的人們已經(jīng)不再滿意圖文并茂的靜態(tài)網(wǎng)頁格式,動(dòng)態(tài)網(wǎng)頁應(yīng)運(yùn)而生,但是一般的動(dòng)態(tài)圖片和網(wǎng)站的背景音樂應(yīng)用并不合拍.什么時(shí)候可以把多媒體應(yīng)用在網(wǎng)站上呢 Flash正是在這一網(wǎng)絡(luò)發(fā)展的大背景下應(yīng)運(yùn)而生的,前身是Future Splash.Flash1.0版本誕生于1996年,由于當(dāng)時(shí)的網(wǎng)絡(luò)大背景,Flash在出道之時(shí)并沒有得到計(jì)算機(jī)行業(yè)應(yīng)有的重視,Flash真正的火爆是從Flash3.0版本開始的,到了1999年6月發(fā)布的Flash4.0版本,其制作的動(dòng)畫開始大量的在網(wǎng)上傳播,已經(jīng)逐漸成為了網(wǎng)頁交互多媒體動(dòng)畫設(shè)計(jì)軟件的標(biāo)準(zhǔn).現(xiàn)在,Flash5.0以其特有的ActionScript腳本編程,正在以極快的速度追趕HTML網(wǎng)頁標(biāo)準(zhǔn).它改變了以往靜態(tài)的,枯燥的,網(wǎng)頁形式,利用它短小精悍的文件體積和插件,利用它簡單易學(xué)的操作方式,利用它的“流”式播放形式豐富我們的網(wǎng)絡(luò)生活.試想,如果它真的超過HTML成為未來的網(wǎng)頁設(shè)計(jì)軟件的主流,那也將是網(wǎng)絡(luò)的一場(chǎng)革命,也是網(wǎng)絡(luò)生活的福音.3.5flash制作流程
（1）建立一個(gè)新的場(chǎng)景
依次選擇“文件”、“新建”、“Flash文檔”命令，建立空白文檔，大小為550*400像素，背景為白色。
（1）
（2）重新命名場(chǎng)景和涂層名稱
依次選擇“窗口”、“設(shè)計(jì)面板”、“場(chǎng)景”命令，在彈出的場(chǎng)景面板中雙擊默認(rèn)場(chǎng)景名稱，改為“跳動(dòng)的小球”。然后重新命名涂層名稱，雙擊默認(rèn)涂層名稱，改為“地面”。然后用水平線表示地面，選擇筆觸顏色為黑色，單擊“線條工具”按鈕，在第一幀的舞臺(tái)下方，拖動(dòng)鼠標(biāo)畫一條直線表示地面。
（2）
（3）插入水平線結(jié)束幀
單擊水平線涂層第35幀的小方框，選中該幀；依次選擇“插入”、“時(shí)間軸”、“關(guān)鍵幀”命令，在地面層的1到35幀之間插入了相同的水平線。
（3）（4）插入跳動(dòng)的小球涂層，畫小球的初始狀態(tài)
雙擊默認(rèn)的涂層名，改為跳動(dòng)的小球涂層，此圖層處于激活狀態(tài)。設(shè)置填充色為黑色，在第一幀的舞臺(tái)上方，畫一個(gè)小球，刪除輪廓線。
（4）
（5）插入下一幀
單擊跳動(dòng)的小球?qū)拥诙男》娇?，選中該幀；依次選擇“插入”、“時(shí)間軸”、“關(guān)鍵幀”命令，在第二幀中復(fù)制第一幀的圖形；拖動(dòng)小球向下移動(dòng)一個(gè)距離，表示球在下落。
（5）
（6）制作下落動(dòng)作的變化
重復(fù)上一步驟。
（6）
（7）小球變形
在下一幀的位置插入關(guān)鍵幀，利用任意變性工具把小球縱向壓縮。單擊“任意變形”按鈕,指針根據(jù)可實(shí)現(xiàn)的變形方式箭頭右下方的小圖形會(huì)有所變化；單擊小球，小球周圍出現(xiàn)8個(gè)黑色句柄框；把鼠標(biāo)指針移動(dòng)到4個(gè)中間句柄處，拖動(dòng)鼠標(biāo)，把圓球編程橢球形。
（7）
（8）多次重復(fù)上面步驟，在不同的幀中，制作小球被壓扁后又彈起的畫面。參照第9步，制作小球被壓扁后又彈起的畫面。重復(fù)上述步驟，直到小球靜止。4.fireworks 4.1fireworks簡介
Fireworks是Macromedia公司發(fā)布的一款專為網(wǎng)絡(luò)圖形設(shè)計(jì)的圖形編輯軟件，它大大簡化了網(wǎng)絡(luò)圖形設(shè)計(jì)的工作難度，無論是專業(yè)設(shè)計(jì)家還是業(yè)余愛好者，使用Fireworks都不僅可以輕松地制作出十分動(dòng)感的GIF動(dòng)畫，還可以輕易地完成大圖切割、動(dòng)態(tài)按鈕、動(dòng)態(tài)翻轉(zhuǎn)圖等，因此，對(duì)于輔助網(wǎng)頁編輯來說，F(xiàn)ireworks將是最大的功臣。借助于 Macromedia Fireworks 8，您可以在直觀、可定制的環(huán)境中創(chuàng)建和優(yōu)化用于網(wǎng)頁的圖像并進(jìn)行精確控制。Fireworks 業(yè)界領(lǐng)先的優(yōu)化工具可幫助您在最佳圖像品質(zhì)和最小壓縮大小之間達(dá)到平衡。它與 Macromedia Dreamweaver? 和 Macromedia Flash? 共同構(gòu)成的集成工作流程可以讓您創(chuàng)建并優(yōu)化圖像，同時(shí)又能避免由于進(jìn)行 Roundtrip 編輯而丟失信息或浪費(fèi)時(shí)間。利用可視化工具，無需學(xué)習(xí)代碼即可創(chuàng)建具有專業(yè)品質(zhì)的網(wǎng)頁圖形和動(dòng)畫，如變換圖像和彈出菜單等。
4.2fireworks在網(wǎng)頁中的應(yīng)用
眾所周知，在網(wǎng)頁上的jpg圖片如果過大，會(huì)嚴(yán)重影響頁面的打開速度，F(xiàn)ireworks提供優(yōu)化圖片的功能，即縮小圖片的KB，而且不影響畫面的質(zhì)量（除非放大了與原圖對(duì)比）。由于很多人喜歡用photoshop制作jpg圖片，所以它的容量會(huì)很大（因?yàn)樗沁m合處理印刷品，要求比較清晰），最終還是要用Fireworks來處理一下。
在優(yōu)化面板里有“導(dǎo)出jpg較高品質(zhì)”，導(dǎo)出默認(rèn)的80品質(zhì)（可以用“2幅”畫面對(duì)比之前之后的大?。?。
4.3fireworks的重要性
為Macromedia家族的一員，三劍客之一的fireworks，她的主要任務(wù)和特色就是制作矢量圖為網(wǎng)頁服務(wù),FW也是Flash的最佳伴侶,在三劍客的MX系列中,FW和Flash的聯(lián)系更為緊密,所以無論是網(wǎng)頁制作和Flash制作,Fw都是不可或缺的利器.在Fw3年的應(yīng)用實(shí)踐過程中,我無時(shí)無刻不在感受她的卓越和便利。的確,網(wǎng)頁制作看重的是效果和速度,并不是你用的軟件專業(yè)與否,你用了多少個(gè)軟件作出的網(wǎng)頁,設(shè)計(jì)師作出的網(wǎng)頁是為了讓大家接受而不是顯示自己的本領(lǐng),在這樣的前提下,Fw的確是最好的選擇,最好的矢量圖效果,最快的速度。
4.4fireworks制作流程
1.準(zhǔn)備素材 如圖
2、因?yàn)檫@幅圖片是位圖，我們可以用魔術(shù)棒將電視機(jī)中間的畫面選取成選區(qū)
2.選擇菜單——將選取框轉(zhuǎn)換為路徑，得到電視畫面的輪廓路徑。當(dāng)然，也可以用鋼筆工具勾勒
出
電
視
畫
面的路
徑
4.將選中區(qū)域填充成折疊漸變
顏色可以自己選擇：
5.用選取工具拖動(dòng)漸變方向手柄，接近垂直或接近水平方向：
6.將調(diào)整手柄以初選中區(qū)域 并在幀屬性，選取重制幀命令：選擇三幀 或在多些
7.依次選擇其他幀，拖動(dòng)漸變調(diào)整手柄將其改變位置：柄以初選中區(qū)域 并在幀屬性幀命令：
最后保存 導(dǎo)出gif圖片 即可完成。
1.在Fireworks中打開一個(gè)新的畫布，調(diào)整畫布大小，選擇工具欄中的文本工具，輸入第一個(gè)數(shù)字，并設(shè)置好文字的字體、像素大小等樣式
2.輸入文本 1 然后再打開幀屬性 選擇重置幀 9 因?yàn)閿?shù)字0-9 一共是十個(gè)
3.然后選擇每一幀，并修改畫布中的相應(yīng)數(shù)字。
4.幀面板中右手邊顯示的是默認(rèn)的幀延時(shí)值7毫秒，即7/100秒的速度。如果速度過快 可以修改值 選擇頂部幀，按住Shift鍵，點(diǎn)擊底部的最后一幀，全選這些幀，在幀延時(shí)值處雙擊，在顯示的對(duì)話框中設(shè)置一個(gè)更高的值。更高值將減慢動(dòng)畫的播放速度。5.最后一步，打開優(yōu)化面板，設(shè)置導(dǎo)出文件格式為“Gif動(dòng)畫”，如圖：
6.也可以在幀面板的底部設(shè)置Gif動(dòng)畫循環(huán)，默認(rèn)為“永久”選項(xiàng)
7.畫布顏色可以隨意更改 再按f12 預(yù)覽就可以了，最后導(dǎo)出文件
5.參考文獻(xiàn)
[1]劉宇.Flash短片輕松學(xué)中國大陸.電子工業(yè)出版社，2009-01.[2]章精設(shè)，胡登濤.Flash Action Script 3.0從入門到精通.清華大學(xué)出版設(shè)，2008-10.[3]陳冰.Flash第1步:ActionScript編程篇(珍藏版).清華大學(xué)出版社，2006-03
第三篇：網(wǎng)頁制作期末作品要求
網(wǎng)頁設(shè)計(jì)制作期末作品
一、制作規(guī)則要求
1.設(shè)計(jì)制作靜態(tài)網(wǎng)頁，擴(kuò)展名htm或html，作品主題隨意，但以健康、積極向上的主題為選題。
2.網(wǎng)頁要求布局合理、頁面美觀、選材精當(dāng)、規(guī)模適宜。
3.恰當(dāng)運(yùn)用表格、框架、CSS、行為等設(shè)計(jì)頁面，但不要求實(shí)用所有的布局方式，可使用以上布局的某一種或多種。
4.能靈活運(yùn)用圖片處理軟件制作網(wǎng)頁元素，全部網(wǎng)頁必須原創(chuàng)，使用他人的圖片必須把原圖級(jí)你所處理的圖都保存到images文件夾中。
5.網(wǎng)站有一個(gè)一級(jí)頁面，至少有4個(gè)二級(jí)子頁面，三級(jí)子頁面數(shù)量不限，并保證超級(jí)鏈接能順利執(zhí)行，網(wǎng)站主頁命名為：index.html
6.設(shè)計(jì)一個(gè)與主題貼切的網(wǎng)站標(biāo)志logo，并且設(shè)計(jì)導(dǎo)航，與各網(wǎng)頁正確鏈接。
7.網(wǎng)站根文件夾名為” 學(xué)號(hào)+姓名”，內(nèi)建images文件夾，將所有的圖形圖像素材放在該文件夾內(nèi)。
8.網(wǎng)頁中至少有一個(gè)動(dòng)畫素材或圖形圖像素材為選手制作。源文件一并上傳。所有文件名（包括圖片、視頻、音頻、動(dòng)畫、文本、網(wǎng)頁）都必須使用英文小寫字母或阿拉伯?dāng)?shù)字。
二、作品上傳要求
1.將站點(diǎn)打包上傳，并以網(wǎng)站根文件夾名稱命名。
2.在上傳的壓縮包以自己的學(xué)號(hào)、姓名命名。
3.上傳下自己的班級(jí)里。
第四篇：網(wǎng)頁設(shè)計(jì)與制作-論文（本站推薦）
第一章
緒論
摘 要
本論文將對(duì)個(gè)人網(wǎng)頁設(shè)計(jì)與制作的方法、工具等展開研究和探討。在介紹網(wǎng)頁設(shè)計(jì)與制作語言的基礎(chǔ)上，著重使用JavaScript作為工具語言進(jìn)行網(wǎng)頁設(shè)計(jì)與制作的實(shí)際操作，分別對(duì)基于對(duì)象的JavaScript語言、內(nèi)部對(duì)象系統(tǒng)的使用及WEB頁面信息交互——窗口和框架進(jìn)行詳細(xì)描述，并利用具體的實(shí)例進(jìn)行驗(yàn)證。
本論文主要章節(jié)如下，第一章：緒論，本章主要介紹網(wǎng)頁設(shè)計(jì)的相關(guān)知識(shí)。第二章：網(wǎng)頁設(shè)計(jì)語言概述，本章主要介紹網(wǎng)頁設(shè)計(jì)的語言——HTML，以及用于編輯HTML語言的軟件，為后續(xù)工作奠定基礎(chǔ)。第三章：基于對(duì)象的JavaScript語言，本章介紹了基于對(duì)象的JavaScript中常用內(nèi)部對(duì)象屬性、方法的使用。第四章：內(nèi)部對(duì)象系統(tǒng)的使用，本章主要介紹使用瀏覽器的內(nèi)部對(duì)象系統(tǒng)，可實(shí)現(xiàn)與HTML文檔進(jìn)行交互。第五章：WEB頁面信息的交互——窗體與框架，本章主要介紹實(shí)現(xiàn)網(wǎng)頁的動(dòng)態(tài)交互，必須掌握有關(guān)窗體對(duì)象（Form）和框架對(duì)象（Frames）更為復(fù)雜的知識(shí)。
關(guān)鍵詞： 網(wǎng)頁制作；網(wǎng)頁設(shè)計(jì)；HTML；ASP
第一章
緒論
第一章 緒論
隨著21世紀(jì)的到來，人們更深切地感受到計(jì)算機(jī)在生活和工作中的作用越來越重要，越來越來的職業(yè)需要具有計(jì)算機(jī)的應(yīng)用技能。掌握計(jì)算機(jī)是職業(yè)的需要，更是事業(yè)發(fā)展的需要。網(wǎng)頁設(shè)計(jì)與制作是計(jì)算機(jī)能力的具體表現(xiàn)，本章主要介紹網(wǎng)頁設(shè)計(jì)的相關(guān)知識(shí)。
1.1 網(wǎng)頁設(shè)計(jì)概述
網(wǎng)站是企業(yè)向用戶和網(wǎng)民提供信息(包括產(chǎn)品和服務(wù))的一種方式,是企業(yè)開展電子商務(wù)的基礎(chǔ)設(shè)施和信息平臺(tái)，離開網(wǎng)站（或者只是利用第三方網(wǎng)站）去談電子商務(wù)是不可能的。企業(yè)的網(wǎng)址被稱為“網(wǎng)絡(luò)商標(biāo)”，也是企業(yè)無形資產(chǎn)的組成部分，而網(wǎng)站是INTERNET上宣傳和反映企業(yè)形象和文化的重要窗口。
1.2 網(wǎng)頁設(shè)計(jì)的要素
網(wǎng)頁設(shè)計(jì)的兩大要素是：整體風(fēng)格和色彩搭配。
一、確定網(wǎng)站的整體風(fēng)格
在這里，我提供給大家一些參考經(jīng)驗(yàn)：
1．將你的標(biāo)志logo，盡可能的放在每個(gè)頁面上最突出的位置。2．突出你的標(biāo)準(zhǔn)色彩。
3．總結(jié)一句能反映貴站精髓的宣傳標(biāo)語！
4．相同類型的圖像采用相同效果，比如說標(biāo)題字都采用陰影效果，那么在網(wǎng)站中出現(xiàn)的所有標(biāo)題字的陰影效果的設(shè)置應(yīng)該是完全一致的！
二、網(wǎng)頁色彩的搭配
1．用一種色彩。這里是指先選定一種色彩，然后調(diào)整透明度或者飽和度，這樣的頁面看起來色彩統(tǒng)一，有層次感。
2．用兩種色彩。先選定一種色彩，然后選擇它的對(duì)比色。
3．用一個(gè)色系。簡單的說就是用一個(gè)感覺的色彩，例如淡藍(lán)，淡黃，淡綠；或者土黃，土灰，土藍(lán)。
1.3 大作業(yè)目的和意義
本大作業(yè)主要是對(duì)網(wǎng)頁設(shè)計(jì)與制作的語言基礎(chǔ)上進(jìn)行探討，主要內(nèi)容如下：通過已經(jīng)做好的網(wǎng)頁，分析html網(wǎng)頁設(shè)計(jì)技術(shù)、XML技術(shù)、Java Applet技術(shù)和Javascript技術(shù)在網(wǎng)頁設(shè)計(jì)中的應(yīng)用。
第一章
緒論
1.4 要分析的網(wǎng)頁
第一章
緒論
第一章
緒論
第二章
HTML網(wǎng)頁設(shè)計(jì)技術(shù)的應(yīng)用
第二章 HTML網(wǎng)頁設(shè)計(jì)技術(shù)的應(yīng)用
2.1 HTML語言介紹
HTML（HyperText Mark-up Language）即超文本標(biāo)記語言或超文本鏈接標(biāo)示語言，是目前網(wǎng)絡(luò)上應(yīng)用最為廣泛的語言，也是構(gòu)成網(wǎng)頁文檔的主要語言。
HTML文本是由HTML命令組成的描述性文本，HTML命令可以說明文字、圖形、動(dòng)畫、聲音、表格、鏈接等。HTML的結(jié)構(gòu)包括頭部（Head）、主體（Body）兩大部分，其中頭部描述瀏覽器所需的信息，而主體則包含所要說明的具體內(nèi)容。
2.1.1 HTML語言的特點(diǎn)
HTML文檔制作不是很復(fù)雜，且功能強(qiáng)大，支持不同數(shù)據(jù)格式的文件鑲?cè)?，這也是WWW盛行的原因之一，HTML語言的特點(diǎn)如下：
1、簡易性，HTML版本升級(jí)采用超集方式，從而更加靈活方便。
2、可擴(kuò)展性，HTML語言的廣泛應(yīng)用帶來了加強(qiáng)功能，增加標(biāo)識(shí)符等要求，HTML采取子類元素的方式，為系統(tǒng)擴(kuò)展帶來保證。
3、平臺(tái)無關(guān)性。雖然PC機(jī)大行其道，但使用MAC等其他機(jī)器的大有人在，HTML可以使用在廣泛的平臺(tái)上，這也是WWW盛行的另一個(gè)原因。
2.1.2 HTML語言的編輯軟件
HTML的本質(zhì)是文本，需要瀏覽器的解釋，HTML的編輯器大體可以分為三種：
1、基本編輯軟件，使用WINDOWS自帶的記事本或?qū)懽职娑伎梢跃帉?，?dāng)然，如果你用WPS來編寫，也可以。不過存盤時(shí)請(qǐng)使用.htm或.html作為擴(kuò)展名，這樣瀏覽器就可以解釋執(zhí)行了。
2、半所見即所得軟件，這種軟件能大大提高開發(fā)效率，它可以使你在很短的時(shí)間內(nèi)做出Homepage，且可以學(xué)習(xí)HTML，這種類型的軟件主要有HOTDOG，還有國產(chǎn)的軟件網(wǎng)頁作坊。
3、所見即所得軟件，使用最廣泛的編輯器，完全可以一點(diǎn)不懂HTML的知識(shí)就可以做出網(wǎng)頁，這類軟件主要有Frontpage，DREAMWEAVER、Delphi、Eclipse、UltraEdit。
2.1.4 html語言在網(wǎng)頁設(shè)計(jì)中的應(yīng)用
第二章
HTML網(wǎng)頁設(shè)計(jì)技術(shù)的應(yīng)用
2.2.3JavaScript技術(shù)在網(wǎng)頁設(shè)計(jì)中應(yīng)用
一、JavaScript概述
JavaScript是一種基于對(duì)象(Object)和事件驅(qū)動(dòng)(Event Driven)并具有安全性能的腳本語言。使用它的目的是與HTML超文本標(biāo)記語言、Java 腳本語言（Java小程序）一起實(shí)現(xiàn)在一個(gè)Web頁面中鏈接多個(gè)對(duì)象，與Web客戶交互作用。從而可以開發(fā)客戶端的應(yīng)用程序等。它是通過嵌入或調(diào)入在標(biāo)準(zhǔn)的HTML語言中實(shí)現(xiàn)的。它的出現(xiàn)彌補(bǔ)了HTML語言的缺陷，它是Java與HTML折衷的選擇，具有以下幾個(gè)基本特點(diǎn)：
1、是一種腳本編寫語言
JavaScript是一種腳本語言，它采用小程序段的方式實(shí)現(xiàn)編程。像其它腳本語言一樣,JavaScript同樣已是一種解釋性語言,它提供了一個(gè)易的開發(fā)過程。
它的基本結(jié)構(gòu)形式與C、C++、VB、Delphi十分類似。但它不像這些語言一樣，需要先編譯，而是在程序運(yùn)行過程中被逐行地解釋。它與HTML標(biāo)識(shí)結(jié)合在一起，從而方便用戶的使用操作。
2、基于對(duì)象的語言。
JavaScript是一種基于對(duì)象的語言，同時(shí)以可以看作一種面向?qū)ο蟮?。這意味著它能運(yùn)用自己已經(jīng)創(chuàng)建的對(duì)象。因此，許多功能可以來自于腳本環(huán)境中對(duì)象的方法與腳本的相互作用。
3、簡單性
JavaScript的簡單性主要體現(xiàn)在：首先它是一種基于Java基本語句和控制流之上的簡單而緊湊的設(shè)計(jì), 從而對(duì)于學(xué)習(xí)Java是一種非常好的過渡。其次它的變量類型是采用弱類型，并未使用嚴(yán)格的數(shù)據(jù)類型。
4、安全性
JavaScript是一種安全性語言，它不允許訪問本地的硬盤，并不能將數(shù)據(jù)存入到服務(wù)器上，不允許對(duì)網(wǎng)絡(luò)文檔進(jìn)行修改和刪除，只能通過瀏覽器實(shí)現(xiàn)信息瀏覽或動(dòng)態(tài)交互。從而有效地防止數(shù)據(jù)的丟失。
5、動(dòng)態(tài)性的
JavaScript是動(dòng)態(tài)的，它可以直接對(duì)用戶或客戶輸入做出響應(yīng)，無須經(jīng)過Web服務(wù)程序。它對(duì)用戶的反映響應(yīng)，是采用以事件驅(qū)動(dòng)的方式進(jìn)行的。所謂事件驅(qū)動(dòng)，就是指在主頁(Home Page)中執(zhí)行了某種操作所產(chǎn)生的動(dòng)作，就稱為“事件”(Event)。比如按下鼠標(biāo)、移動(dòng)窗口、選擇菜單等都可以視為事件。當(dāng)事件發(fā)生后，可能會(huì)引起相應(yīng)的事件響應(yīng)。
6、跨平臺(tái)性
JavaScript是依賴于瀏覽器本身，與操作環(huán)境無關(guān)，只要能運(yùn)行瀏覽器的計(jì)算機(jī)，并支持JavaScript的瀏覽器就可正確執(zhí)行。從而實(shí)現(xiàn)了“編寫一次,走遍天下”的夢(mèng)想。
實(shí)際上JavaScript最杰出之處在于可以用很小的程序做大量的事。無須有高性能的電腦，軟件僅需一個(gè)字處理軟件及一瀏覽器，無須WEB服務(wù)器通道，通過自己的電腦即可完成所有的事情。
總之，JavaScript 是一種新的描述語言，它可以被箝入到 HTML 的文件之中。JavaScript語言可以做到回應(yīng)使用者的需求事件(如：form的輸入)，而不用任何的網(wǎng)路來回傳輸資料，所以當(dāng)一位使用者輸入一項(xiàng)資料時(shí)，它不用經(jīng)過傳給伺服端(server)處理，再傳回來的過程，而直接可以被客戶端(client)的應(yīng)用程式所處理。
第二章
HTML網(wǎng)頁設(shè)計(jì)技術(shù)的應(yīng)用
第五章
色彩在網(wǎng)頁中的應(yīng)用
第五章 色彩在網(wǎng)頁中的應(yīng)用
5.1色彩在網(wǎng)頁中的應(yīng)用
色彩是藝術(shù)表現(xiàn)的要素之一。在網(wǎng)頁設(shè)計(jì)中，我們的設(shè)計(jì)師根據(jù)和諧、均衡和重點(diǎn)突出的原則，將不同的色彩進(jìn)行組合．搭配來構(gòu)成美麗的頁面。根據(jù)色彩對(duì)人們心理的影響，合理地加以運(yùn)用。
先選定一種色彩，然后調(diào)整透明度或者飽和度，這樣的頁面看起來色彩統(tǒng)一，有層次感。簡單的說就是用一個(gè)感覺的色彩，例如淡藍(lán)，淡黃，淡綠；或者土黃，土灰，土藍(lán)。
在網(wǎng)頁配色中不要將所有顏色都用到，盡量控制在三至五種色彩以內(nèi)。背景和前文的對(duì)比盡量要大以便突出主要文字內(nèi)容。
5.2主頁色彩的處理
色彩是人的視覺最敏感的東西。主頁的色彩處理得好，可以錦上添花，達(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)、退的效果等。另外，色彩還有民族性，各個(gè)民族由于環(huán)境、文化、傳統(tǒng)等因素的影響，對(duì)于色彩的喜好也存在著較大的差異。充分運(yùn)用色彩的這些特性，可以使我們的主頁具有深刻的藝術(shù)內(nèi)涵，從而提升主頁的文化品位。
5.3常用的配色方案
1.暖色調(diào)。即紅色、橙色、黃色、赭色等色彩的搭配。這種色調(diào)的運(yùn)用，可使主頁呈現(xiàn)溫馨、和煦、熱情的氛圍。
2.冷色調(diào)。即青色、綠色、紫色等色彩的搭配。這種色調(diào)的運(yùn)用，可使主頁呈現(xiàn)寧靜、清涼、高雅的氛圍。
3.對(duì)比色調(diào)。即把色性完全相反的色彩搭配在同一個(gè)空間里。例如：紅與綠、黃與紫、橙與藍(lán)等。這種色彩的搭配，可以產(chǎn)生強(qiáng)烈的視覺效果，給人亮麗、鮮艷、喜慶的感覺。
第五章
色彩在網(wǎng)頁中的應(yīng)用
最后，還要考慮主頁底色（背景色）的深、淺，這里借用攝影中的一個(gè)術(shù)語，就是“高調(diào)”和“低調(diào)”。底色淺的稱為高調(diào)；底色深的稱為低調(diào)。底色深，文字的顏色就要淺，以深色的背景襯托淺色的內(nèi)容（文字或圖片）；反之，底色淡的，文字的顏色就要深些，以淺色的背景襯托深色的內(nèi)容（文字或圖片）。這種深淺的變化在色彩學(xué)中稱為“明度變化”。當(dāng)然，色彩的明度也不能變化太大，否則屏幕上的亮度反差太強(qiáng)，同樣也會(huì)使讀者的眼睛受不了。
5.4合理搭配網(wǎng)頁色彩
網(wǎng)頁的色彩是樹立網(wǎng)站形象的關(guān)鍵之一，網(wǎng)頁的背景、文字、圖標(biāo)、邊框、超鏈接等都要用到色彩。不同的色彩會(huì)使瀏覽者有不同的心理感受。合理的搭配色彩，會(huì)更好的表現(xiàn)主題，吸引用戶的注意力。網(wǎng)頁色彩涉及到藝術(shù)知識(shí)，讓美術(shù)教師參加網(wǎng)頁色彩設(shè)計(jì)，可能會(huì)出現(xiàn)比較理想的效果。在色彩搭配上要注意色彩的鮮明性、獨(dú)特性、合適性、聯(lián)想性。背景色和前景色對(duì)比要大，以突出主要內(nèi)容
網(wǎng)站給人的第一印象來自視覺沖擊，不同的色彩搭配產(chǎn)生不同的效果，并可能影響到訪問者的情緒?！皹?biāo)準(zhǔn)色彩”是指能體現(xiàn)網(wǎng)站形象和延伸內(nèi)涵的色彩，要用于網(wǎng)站的標(biāo)志，標(biāo)題，主菜單和主色塊。給人以整體統(tǒng)一的感覺。至于其它色彩也可以使用，但應(yīng)當(dāng)只是作為點(diǎn)綴和襯托，絕不能喧賓奪主。一般來說，一個(gè)網(wǎng)站的標(biāo)準(zhǔn)色彩不超過3種，太多則讓人眼花繚亂。適合于網(wǎng)頁標(biāo)準(zhǔn)色的顏色有：藍(lán)色，黃/橙色，黑/灰/白色三大系列色。
第五章
色彩在網(wǎng)頁中的應(yīng)用
第六章 WEB頁面信息的交互——窗體與框架
要實(shí)現(xiàn)網(wǎng)頁的動(dòng)態(tài)交互，必須掌握有關(guān)窗體對(duì)象（Form）和框架對(duì)象（Frames）更為復(fù)雜的知識(shí)。
6.1窗體基礎(chǔ)知識(shí)
窗體對(duì)象可以使設(shè)計(jì)人員能用窗體中不同的元素與客戶機(jī)用戶相交互，而用不著在之前首先進(jìn)行數(shù)據(jù)輸入，就可以實(shí)現(xiàn)動(dòng)態(tài)改變Web文檔的行為。
6.1.1窗體對(duì)象
窗體（Form）：它構(gòu)成了Web頁面的基本元素。通常一個(gè)Web頁面有一個(gè)窗體或幾個(gè)窗體，使用Forms[]數(shù)組來實(shí)現(xiàn)不同窗體的訪問。
在Forms[0]中共有三個(gè)基本元素，而Forms[1]中只有兩個(gè)元素。窗體對(duì)象最主要的功能就是能夠直接訪問HTML文檔中的窗體，它封裝了相關(guān)的HTML代碼：
6.1.2 窗體對(duì)象的方法窗體對(duì)象的方法只有一個(gè)--submit()方法，該方法主要功用就是實(shí)現(xiàn)窗體信息的提交。如提交Mytest窗體，則使用下列格式：
document.mytest.submit()
第五章
色彩在網(wǎng)頁中的應(yīng)用
6.1.3 窗體對(duì)象的屬性
窗體對(duì)象中的屬性主要包括以下：elements name action target encoding method。除Elements外，其它幾個(gè)均反映了窗體中標(biāo)識(shí)中相應(yīng)屬性的狀態(tài)，這通常是單個(gè)窗體標(biāo)識(shí)；而elements常常是多個(gè)窗體元素值的數(shù)組，例：
elements[0].Mytable.elements[1] 6.1.4 訪問窗體對(duì)象
在JavaScript中訪問窗體對(duì)象可由兩種方法實(shí)現(xiàn)：（1）通過訪問窗體
在窗體對(duì)象的屬性中首先必須指定其窗體名，而后就可以通過下列標(biāo)識(shí)訪問窗體如：document.Mytable()。
（2）通過數(shù)組來訪問窗體
除了使用窗體名來訪問窗體外，還可以使用窗體對(duì)象數(shù)組來訪問窗體對(duì)象。但需要注意一點(diǎn)，因窗體對(duì)象是由瀏覽器環(huán)境的提供的，而瀏覽器環(huán)境所提供的數(shù)組下標(biāo)是由0到n。所以可通過下列格式實(shí)現(xiàn)窗體對(duì)象的訪問：
document.forms[0] document.forms[1] document.forms[2]...6.1.5 引用窗體的先決條件
在JavaScript中要對(duì)窗體引用的條件是：必須先在頁面中用標(biāo)識(shí)創(chuàng)建窗體，并將定義窗體部分放在引用之前。
6.2 窗體中的基本元素
窗體中的基本元素由按鈕、單選按鈕、復(fù)選按鈕、提交按鈕、重置按鈕、文本框等組成。
在JavaScript中要訪問這些基本元素，必須通過對(duì)應(yīng)特定的窗體元素的數(shù)組下標(biāo)或窗體元素名來實(shí)現(xiàn)。每一個(gè)元素主要是通過該元素的屬性或方法來引用。其引用的基本格式見下：
formName.elements[].methadName(窗體名.元素名或數(shù)組.方法)formName.elemaent[].propertyName(窗體名.元素名或數(shù)組.屬性)下面分別介紹：
（1）Text單行單列輸入元素
功能：對(duì)Text標(biāo)識(shí)中的元素實(shí)施有效的控制?；緦傩裕?/p>
Name：設(shè)定提交信息時(shí)的信息名稱。對(duì)應(yīng)于HTML文檔中的Name。Value：用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息。defaultvalue：包括Text元素的默認(rèn)值 基本方法：
blur()：將當(dāng)前焦點(diǎn)移到后臺(tái)。
第五章
色彩在網(wǎng)頁中的應(yīng)用
select()：加亮文字。主要事件：
onFocus：當(dāng)Text獲得焦點(diǎn)時(shí)，產(chǎn)生該事件。OnBlur：從元素失去焦點(diǎn)時(shí)，產(chǎn)生該事件。Onselect：當(dāng)文字被加亮顯示后，產(chǎn)生該文件。onchange：當(dāng)Text元素值改變時(shí)，產(chǎn)生該文件。例：
...（2）textarea多行多列輸入元素功能：實(shí)施對(duì)Textarea中的元素進(jìn)行控制?；緦傩?/p>
name：設(shè)定提交信息時(shí)的信息名稱，對(duì)應(yīng)HTML文檔Textarea的Name。Value：用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息。Default value：元素的默認(rèn)值。方法：
blur()：將輸入焦點(diǎn)失去 select()：將文字加亮后 事件：
onBlur:當(dāng)失去輸入焦點(diǎn)后產(chǎn)生該事件 onFocus:當(dāng)輸入獲得焦點(diǎn)后，產(chǎn)生該文件 Onchange:當(dāng)文字值改變時(shí)，產(chǎn)生該事件 Onselect:當(dāng)文字加亮后，產(chǎn)生該文件（3）Select選擇元素
功能：實(shí)施對(duì)滾動(dòng)選擇元素的控制。屬性：
name:設(shè)定提交信息時(shí)的信息名稱，對(duì)應(yīng)文檔select中的name。Length:對(duì)應(yīng)文檔select中的length options:組成多個(gè)選項(xiàng)的數(shù)組 selectIndex;該下標(biāo)指明一個(gè)選項(xiàng)
select在中每一選項(xiàng)都含有以下屬性： Text:選項(xiàng)對(duì)應(yīng)的文字
selected:指明當(dāng)前選項(xiàng)是否被選中 Index:指明當(dāng)前選項(xiàng)的位置 defaultselected:默認(rèn)選項(xiàng) 事件：
第五章
色彩在網(wǎng)頁中的應(yīng)用
OnBlur：當(dāng)select選項(xiàng)失去焦點(diǎn)時(shí)，產(chǎn)生該文件。onFocas:當(dāng)select獲得焦點(diǎn)時(shí)，產(chǎn)生該文件。Onchange:選項(xiàng)狀態(tài)改變后，產(chǎn)生該事件。（4）Button按鈕
功能：實(shí)施對(duì)Button按鈕的控制。屬性：
Name:設(shè)定提交信息時(shí)的信息名稱，對(duì)應(yīng)文檔中button的Name。Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息。方法：
click()該方法類似于一個(gè)按下的按鈕。事件：
onclick當(dāng)單擊button按鈕時(shí)，產(chǎn)生該事件。例 ：
........（5）checkbox檢查框功能：實(shí)施對(duì)一個(gè)具有復(fù)選框中元素的控制。屬性：
name:設(shè)定提交信息時(shí)的信息名稱。
Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息。Checked:該屬性指明框的狀態(tài)true/false.defauitchecked:默認(rèn)狀態(tài) 方法：
click()該方法使得框的某一個(gè)項(xiàng)被選中。事件：
Onclick：當(dāng)框的選被選中時(shí)，產(chǎn)生該事件。（6）radio無線按鈕
功能：實(shí)施對(duì)一個(gè)具單選功能的無線按鈕控制。屬性：
Name：設(shè)定提交信息時(shí)的信息名稱，對(duì)應(yīng)HTML文檔中的radio的name相同 Value：用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息，對(duì)應(yīng)HTML文檔中的radio的name。
length：單選按鈕中的按鈕數(shù)目。defalechecked:默認(rèn)按鈕。
checked:指明選中還是沒有選中。
第五章
色彩在網(wǎng)頁中的應(yīng)用
index:選中的按鈕的位置。方法：
chick():選定一個(gè)按鈕。事件：
onclick:單擊按鈕時(shí)，產(chǎn)生該事件。（7）hidden:隱藏
功能：實(shí)施對(duì)一個(gè)具有不顯示文字并能輸入字符的區(qū)域元素的控制。屬性：
name:設(shè)定提交信息時(shí)的信息名稱，對(duì)應(yīng)HTML文檔的hidden中的Name。
Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息，對(duì)應(yīng)HTML文檔hidden中的value。
defaleitvalue:默認(rèn)值（8）Password口令
功能：實(shí)施對(duì)具有口令輸入的元素的控制。屬性：
Name:設(shè)定提交信息時(shí)的信息名稱，對(duì)應(yīng)HTML文檔中password中的name。Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息，對(duì)應(yīng)HTML文檔中password中的Value。
defaultvalu:默認(rèn)值 方法：
select():加亮輸入口令域。
blur():使這丟失passward輸入焦點(diǎn)。focus():獲得password輸入焦點(diǎn)。（9）submit提交元素
功能：實(shí)施對(duì)一個(gè)具有提交功能按鈕的控制。屬性：
name:設(shè)定提交信息時(shí)的信息名稱，對(duì)應(yīng)HTML文檔中submit。
Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息，對(duì)應(yīng)HTML文檔中value。
方法
click()相當(dāng)于按下submit按鈕。事件：
onclick()當(dāng)按下該按鈕時(shí)，產(chǎn)生該事件。
6.3窗體對(duì)象實(shí)例
下面我們演示通過點(diǎn)擊一個(gè)按鈕（red）來改變窗口顏色，點(diǎn)擊“調(diào)用動(dòng)態(tài)按鈕文檔”調(diào)用一個(gè)動(dòng)態(tài)按鈕文檔。
test8_1.htm
調(diào)用動(dòng)態(tài)按鈕文檔第五篇：個(gè)人網(wǎng)站網(wǎng)頁制作論文
個(gè)人網(wǎng)站網(wǎng)頁
制 作 論 文
學(xué)院： 專業(yè)： 姓名： 學(xué)號(hào)：
摘要
本文就個(gè)人網(wǎng)站的規(guī)劃與建設(shè)，以軟件工程的方法對(duì)全過程進(jìn)行了分析與研究。本文的主要工作集中在：
1.對(duì)Web頁進(jìn)行概述，主要是對(duì)Internet的歷史和發(fā)展作了回顧，并對(duì)Web頁的定義和特性進(jìn)行闡述。并對(duì)網(wǎng)站開發(fā)過程中使用的開發(fā)工具和技術(shù)作了簡要的介紹。
2.對(duì)網(wǎng)站建設(shè)中提及到的術(shù)語進(jìn)行了解釋，并對(duì)個(gè)人網(wǎng)站的由來和發(fā)展進(jìn)行了討論。
3.對(duì)自己的個(gè)人網(wǎng)站從規(guī)劃到建設(shè)進(jìn)行了詳細(xì)的分析。
4.使用ASP＋I(xiàn)IS＋Access技術(shù)實(shí)現(xiàn)了我的網(wǎng)站的各種功能，其中和數(shù)據(jù)庫的連接使用到了ODBC技術(shù)。
5.就網(wǎng)站建設(shè)提出了自己的觀點(diǎn)與建議。
【關(guān)鍵詞】 網(wǎng)站 ASP SQL Server 風(fēng)格 創(chuàng)意
一、引言
在已跨入21世紀(jì)的今天，人類使用和學(xué)習(xí)信息的方式以及信息的包裝方式正在進(jìn)行著不可阻擋的革命，這次革命將比印刷術(shù)的出現(xiàn)所產(chǎn)生的影響以及對(duì)社會(huì)發(fā)展的推動(dòng)遠(yuǎn)為復(fù)雜而巨大。目前，我國上網(wǎng)的人口已近一個(gè)億，成立世界上網(wǎng)民最多的國家，許多人在需要查詢信息，首先想到的就是上網(wǎng)。網(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)格。
（一）Web頁概述
1、認(rèn)識(shí)Web
Web(World Wide Web，簡稱，其意思就是采用http超文本傳輸協(xié)議訪問新浪網(wǎng)的首頁，由于網(wǎng)頁均是通過http超文本傳輸協(xié)議進(jìn)行訪問，默認(rèn)下，“http://”可以省略不輸。
5、IP地址
為了使互聯(lián)網(wǎng)上的電腦主機(jī)在通信時(shí)能夠相互識(shí)別，每臺(tái)主機(jī)都分配一個(gè)能表示其位置的IP（Internet Protocol）地址，這如同公用電話網(wǎng)中電話的號(hào)碼一樣。IP地址是由專門的互聯(lián)網(wǎng)機(jī)構(gòu)來分配。IP地址具有惟一性，是由32位二進(jìn)制數(shù)組成，分為四組，每組8位，每組之間用小數(shù)點(diǎn)分隔，在實(shí)際之中常轉(zhuǎn)換成十進(jìn)制數(shù)表示。
（二）個(gè)人網(wǎng)站的由來和發(fā)展
互聯(lián)網(wǎng)在中國的出現(xiàn)只有短短七年時(shí)間，1994年中國科學(xué)院高能物理研究所設(shè)立了國內(nèi)第一個(gè)Web服務(wù)器，推出一個(gè)叫做“中國之窗”的網(wǎng)頁，這可能是國內(nèi)Internet上出現(xiàn)的第一個(gè)Web網(wǎng)頁，1995年開始，中國教育科研網(wǎng)，中國科技網(wǎng)，中國公用計(jì)算機(jī)互聯(lián)網(wǎng)以及中國金橋網(wǎng)這構(gòu)成中國數(shù)字神經(jīng)系統(tǒng)的四大互聯(lián)網(wǎng)絡(luò)相繼建成，使互聯(lián)網(wǎng)在中國開始真正進(jìn)入社會(huì)生活之中。
這時(shí)期，個(gè)人網(wǎng)站出現(xiàn)的條件還很不成熟，國內(nèi)上網(wǎng)的人數(shù)很少，也缺乏支持個(gè)人建站的環(huán)境，用戶很難找到理想的個(gè)人主頁存放地。
個(gè)人網(wǎng)站發(fā)展的第二階段是從1997年初到1998年，這段時(shí)間，中國網(wǎng)民數(shù)量飛速增長，個(gè)人網(wǎng)站日漸繁榮，個(gè)人主頁的數(shù)量急劇增加。同時(shí)，越來越多的商業(yè)網(wǎng)站開始免費(fèi)提供個(gè)人主頁空間，這些良好的外部極大地促進(jìn)了個(gè)人網(wǎng)站的發(fā)展，涌現(xiàn)了一批很著名的個(gè)人網(wǎng)頁，從1998年下半年開始，隨著互聯(lián)網(wǎng)應(yīng)用的深入的普及，隨著眾多主頁制作工具的出現(xiàn)，使得建站成為一件非常容易的事，創(chuàng)建一個(gè)能充分體現(xiàn)自我風(fēng)格和特色的個(gè)人網(wǎng)站已經(jīng)成為互聯(lián)網(wǎng)用戶的新追求。
（三）我的個(gè)人網(wǎng)站的設(shè)計(jì)與規(guī)劃
1、明確架設(shè)網(wǎng)站的目的及客戶要求
通常情況下，架設(shè)個(gè)人網(wǎng)站主要是為了通過互聯(lián)網(wǎng)表達(dá)個(gè)人在商業(yè)、科技、交際、生活等方面的信息需求或者進(jìn)行信息的交流，具有較強(qiáng)的目的性，我的個(gè)人網(wǎng)站一般體現(xiàn)在：為了展示自己的風(fēng)采，讓大家和我一起分享我的心得與經(jīng)驗(yàn)，讓和我有共同愛好的朋友有一個(gè)傾訴的地方。
2、我的個(gè)人網(wǎng)站概貌
因?yàn)槭莻€(gè)人網(wǎng)站，所以只是選擇了自己擅長和喜愛的內(nèi)容，在突出自己的風(fēng)格和特點(diǎn)的同時(shí)，還應(yīng)用了現(xiàn)在流行的網(wǎng)站設(shè)計(jì)技術(shù)和數(shù)據(jù)庫技術(shù)。因此將網(wǎng)站設(shè)計(jì)分為前臺(tái)頁面展示平臺(tái)和后臺(tái)在線管理平臺(tái)。
3、功能劃分
網(wǎng)站設(shè)計(jì)有新聞更新，瀏覽者可以在首頁瀏覽自己喜歡的新聞，并且可以在留言板和大家交流，在后臺(tái)管理頁面中，通過身份認(rèn)證，管理員——我，可以對(duì)網(wǎng)站信息進(jìn)行管理。站內(nèi)的其它頁面均是我自己的精心收藏，與大家一起分享。
4、功能描述(1)新聞
嵌入百度新聞每日更新代碼，使用在本站首頁顯示今日國內(nèi)國際新聞和體育新聞，供瀏覽者瀏覽。
(2)留言板
是一個(gè)我與大家談心交流的地方，在留言板中，我們可以暢所欲言，和大家進(jìn)行交流。就我們感興趣的話題展開討論。和大家進(jìn)行溝通。
(3)后臺(tái)管理頁面 是我管理和添加到新內(nèi)容的地方，為了方便實(shí)現(xiàn)信息的經(jīng)常更新，我設(shè)計(jì)了這個(gè)管理頁面，經(jīng)過身份認(rèn)證后我可以進(jìn)入網(wǎng)站對(duì)其中的信息進(jìn)行管理。
(4)日記
在其中展示我喜愛的東西，包括我的日記、精品文章、社會(huì)文化和一些雜七雜八的文章。奇文共欣賞，疑義相與析。我只想起到拋磚引玉的作用，讓大家從中認(rèn)識(shí)我和了解我，讓一些美好的東西我們大家共同來欣賞。
(5)相冊(cè)
在其中展示漂亮的圖片，包括我的照片、我的同學(xué)、風(fēng)景照片、妹眉帥哥欄目。讓大家一起來欣賞人物、風(fēng)景風(fēng)采。
(6)音樂
在其中展示個(gè)人喜歡的歌曲，朋友們可以在里面點(diǎn)播自己喜歡的歌。(7)頁面組織和數(shù)據(jù)庫設(shè)計(jì)
在明確了我的個(gè)人網(wǎng)站的風(fēng)格和定位后，就是網(wǎng)站的材料組織以及網(wǎng)站的頁面設(shè)計(jì)和數(shù)據(jù)庫設(shè)計(jì)。
建立一個(gè)網(wǎng)站好比寫一篇文章，首先要擬好提綱，文章才能主題明確，層次清晰。如果網(wǎng)站結(jié)構(gòu)不清晰，目錄龐雜，內(nèi)容東一塊西一塊。結(jié)果不但瀏覽者看得糊涂，自己擴(kuò)充和維護(hù)網(wǎng)站也相當(dāng)困難。網(wǎng)站的題材確定后，并且收集和組織了許多相關(guān)的資料內(nèi)容，但如何組織內(nèi)容才能吸引網(wǎng)友們來瀏覽網(wǎng)站呢？欄目的實(shí)質(zhì)是一個(gè)網(wǎng)站的大綱索引，索引應(yīng)該將網(wǎng)站的主體明確顯示出來。因此我將自己的個(gè)人網(wǎng)站分為五個(gè)欄目，分別是關(guān)于我、相冊(cè)、日記、音樂、留言。
三、詳細(xì)設(shè)計(jì)
1、界面設(shè)計(jì)（1）相冊(cè)
是一個(gè)個(gè)人相片和精彩圖片展示的地方，在相冊(cè)中，我們可以了解到站長的個(gè)人風(fēng)采和自己喜歡的圖片。a、功能
利用ASP對(duì)象語句顯示圖片，讓大家可以看見所有圖片的縮略圖，同時(shí)每個(gè)圖片都有快照功能，可以瀏覽圖片的全圖。
b、組成構(gòu)造
相冊(cè)結(jié)果顯示頁面 photo.asp：用來顯示所有圖片，同時(shí)還具備圖片的分類功能和圖片單個(gè)瀏覽功能。
站長基本信息顯示頁面 include.asp： 數(shù)據(jù)庫連接頁面 conn.asp(2)日記
是一個(gè)記錄個(gè)人日記和精品收藏文章的地方，供給大家一起分享。a、功能
利用ASP對(duì)象語句分類顯示日記或文章記錄，讓大家瀏覽到最新的日記或文章
b、組成結(jié)構(gòu)
日記或文章顯示頁面 diary.asp：顯示所有日記或文章，同時(shí)還具備顯示不同子類日記或文章
站長基本信息顯示頁面 include.asp 數(shù)據(jù)庫連接頁面 conn.asp c、日記頁面瀏覽效果圖，如圖12。(3)、音樂
是一個(gè)音樂收藏和音樂欣賞的地方。a、功能
利用ASP對(duì)象語句來顯示歌曲曲目、演唱人和在線播放功能。b、組成結(jié)構(gòu)
歌曲顯示播放頁面 media.asp：完成曲目的顯示和播放功能的頁面。站長基本信息顯示頁面 include.asp 數(shù)據(jù)庫連接頁面 conn.asp(4)、留言本
是一個(gè)我與大家談心交流的地方，在留言板中，我們可以暢所欲言，和大家進(jìn)行交流。就我們感興趣的話題展開討論。和大家進(jìn)行溝通。
a、功能
利用SQL語法過濾特定的用戶留言意見，讓站長可以針對(duì)某位特定用戶所發(fā)表的意見作出獨(dú)立的回答，同時(shí)，用戶在發(fā)表個(gè)人意見時(shí)，若認(rèn)為意見內(nèi)容涉及敏感的話題或是意見內(nèi)容涉及私人隱私，都可用“悄悄話”的方式發(fā)言，這些“悄悄話”將不會(huì)被顯示出來讓大家看到，當(dāng)然，站長擁有管理的能力，只要以密碼登錄管理模式，就可以進(jìn)行各個(gè)用戶的單獨(dú)意見回復(fù)，而且還能看到用戶所留下的“悄悄話
b、組成構(gòu)造
意見留言結(jié)果網(wǎng)頁gbook.asp：用來顯示用戶發(fā)言與站長回復(fù)內(nèi)容，同時(shí)還具備查看留言和發(fā)表留言兩個(gè)功能。
站長基本信息顯示頁面 include.asp 數(shù)據(jù)庫連接頁面 conn.asp
(三)、關(guān)鍵代碼設(shè)計(jì)
1、分頁功能模塊代碼
<% if not rs.eof then rs.MoveFirst '注意放到前面來,否則到任何頁總是在第一個(gè)記錄上
end if rs.pagesize=MaxPerPage '設(shè)置每頁最多顯示多少條記錄
If trim(Request(“Page”))<>“" then '如果請(qǐng)求的頁次不為空
CurrentPage= CLng(request(”Page“))'clng是轉(zhuǎn)換成長整型數(shù)據(jù)類型,并賦值到當(dāng)前頁次上
If CurrentPage> rs.PageCount then '如果當(dāng)前頁次大于總頁數(shù),則將最大頁次賦值到當(dāng)前頁次上
CurrentPage = rs.PageCount
End If Else
CurrentPage= 1 '一切條件不成立,將當(dāng)前頁設(shè)為第一頁 End If totalPut=rs.recordcount '將總記錄賦值于TOTALPUT
if CurrentPage<>1 then '如果當(dāng)前頁數(shù)不等于第一頁
if(currentPage-1)*MaxPerPage rs.move(currentPage-1)*MaxPerPage '相對(duì)當(dāng)前記錄數(shù)向后移動(dòng) dim bookmark '定義書簽變量 bookmark=rs.bookmark '將當(dāng)前記錄的標(biāo)簽賦于變量BOOKMARK上 end if end if dim n,k if(totalPut mod MaxPerPage)=0 then '總記錄數(shù)與每頁最大記錄數(shù)求余的結(jié)果為零時(shí),則N返回整數(shù)頁次,否則再加一.n= totalPut MaxPerPage else n= totalPut MaxPerPage + 1 end if %> 2、圖片顯示功能模塊代碼 <% cid=request(”id“)if cid=”“ then sql=”select * from HN_pro order by id desc“ else sql=”select * from HN_pro where cstr(class)='“&cid&”' order by id desc“ end if else rsnews.AbsolutePage=ToPage intCurPage=ToPage end if else rsnews.AbsolutePage=1 intCurPage=1 end if intCurPage=CInt(intCurPage)k=1 do while Not rsnews.eof and k<6 %> <%for n=1 to 6%> <% rsnews.MoveNext if rsnews.eof then exit for if rsnews.eof then exit do next %>
日記、音樂顯示模塊代碼段相似。“ rel=”lightbox[plants]“> “ width=”49“ height=”49“ border=”0“>
3、發(fā)表留言提交內(nèi)容判斷模塊代碼 <% if request(”action“)=”“ then response.redirect”gbook.asp?action=show“ if request(”action“)=”post“ then dim bookname dim bookwhere dim bookpic bookname=request(”name“)bookwhere=request(”where“)bookpic=request(”pic“)bookface=request(”face“)bookip=request.ServerVariables(”REMOTE_ADDR“)if bookname=”“ then Response.Write ”“
Response.End %>
（四）、網(wǎng)站管理系統(tǒng)
1、完成站長對(duì)網(wǎng)站信息管理及更新的系統(tǒng)，包括以下幾部分：（1）管理登陸頁面Index.asp（2）相冊(cè)管理頁面Admin_pro.asp（3）日記管理頁面Admin_new.asp（4）音樂管理頁面Admin_down.asp（5）留言管理頁面GuestBook.asp
2、管理登陸
管理系統(tǒng)的登陸頁面，主要用于管理登陸和判斷用戶是否已注冊(cè)。（1）其中判斷是否是非法登陸的代碼為： <% admin_pass=md5(admin_pass)set rs=server.createobject(”adodb.recordset“)sql=”select * from admin where admin_name='“&admin_name&”' and admin_pass='“&admin_pass&”'“
rs.open sql,conn,1,3
if rs.eof then response.write”“
else
session(”admin_name“)=request(”admin_name“)
session(”loc“)=1
response.redirect ”admin.asp“ end if rs.close %>（2）其中驗(yàn)證碼驗(yàn)證代碼：
<% dim verifycode,verifycode2 if verifycode<>verifycode2 then response.write”“ founderr=true else session(”verifycode“)=”“ %>
3、主要功能程序段（1）打開數(shù)據(jù)庫 <% set conn = Server.CreateObject(”ADODB.Connection“)conn.open ”YourDSNName“,”username“,”password“ %>（2）數(shù)據(jù)庫查詢操作 大類查訊
setrs=server.CreateObject(adodb.recordset)小類查詢 dimrs2 setrs2=server.CreateObject(adodb.recordset)rs2.openselectnclass,nclassidfromnclasswhereanclassid=&rs(anclassid)&orderbynclassidorder,conn,1,1 dowhilenotrs2.eof response.writeAhref=class.aspaid=&rs(anclassid)&&nid=&rs2(nclassid)&&trim(rs2(nclass))&A rs2.movenext loop（3）添加記錄操作
setrs=server.CreateObject(adodb.recordset)可寫方式
rs.openselectbookid,username,zhuangtai,zongerfromactions,conn,1,3 rs.addnew 添加一條新記錄 rs(bookid)=bookid 添加相應(yīng)的記錄 rs(username)=username ???? rs(zhuangtai)=6 rs(zonger)=0 rs.update 更新數(shù)據(jù)庫（4）刪除記錄操作
從表actions中刪除actionid匹配的記錄 conn.executedeletefromactionswhereactionid= &request.QueryString(actionid)
四、編碼、測(cè)試與維護(hù)
（一）測(cè)試與維護(hù)
1、IIS(Internet 信息服務(wù))安裝配置
可以在”添加或刪除程序 >>添加/刪除Windows組件“對(duì)話框中把”Internet 信息服務(wù)(IIS)“前的勾選中，點(diǎn)”下一步“進(jìn)行安裝就行了(注：在這之前應(yīng)把系統(tǒng)安裝盤放到光驅(qū))。IIS 裝好之后再作一下簡單的配置。定位到”開始>>管理工具>>Internet 信息服務(wù)(IIS)管理器“，打開IIS管理器。在”本地計(jì)算機(jī)>>網(wǎng)站>>默認(rèn)網(wǎng)站“上右鍵單擊，在快捷菜單里選”屬性“(或者直接在操作菜單下選”屬性“)，彈出如下對(duì)話框圖16: 圖16 切換到”主目錄“標(biāo)簽(圖2)，重新選擇網(wǎng)站根目錄(我選擇的是E盤下的my web目錄)，默認(rèn)是”系統(tǒng)盤:Inetpubwwwroot“,因?yàn)橄到y(tǒng)盤不宜放太多的非系統(tǒng)文件，所以在這里重設(shè)默認(rèn)網(wǎng)站要目錄，如果嫌麻煩可以跳過這步。再切換到”文檔“標(biāo)簽，通過”添加“、”刪除“、”上移“、”下移 “，把站點(diǎn)的默認(rèn)文檔設(shè)置如圖17：
圖17 可能有些朋友會(huì)疑惑，設(shè)置默認(rèn)內(nèi)容文檔有什么作用？細(xì)心的朋友應(yīng)該會(huì)發(fā)現(xiàn)，在瀏覽一些大網(wǎng)站的首頁時(shí)用它的一級(jí)域名就行了，并不需要指定請(qǐng)求頁的文件名，這就是設(shè)置了默認(rèn)內(nèi)容文檔的緣故，它的作用就是在瀏覽器請(qǐng)求沒有指定文檔的名稱時(shí)，將默認(rèn)文檔提供給瀏覽器。要得到更詳盡的解釋說明，可以點(diǎn)擊圖3中的“幫助”。之所以有這步，是因?yàn)榫W(wǎng)站的默認(rèn)內(nèi)容頁中沒有index.asp，不大符合國人習(xí)慣。
2、Dream weaver測(cè)試站點(diǎn)和用IIS測(cè)試本地站點(diǎn)
Dream weaver MX提供了全面檢測(cè)站點(diǎn)的功能，它比檢測(cè)鏈接更全面。全面地檢測(cè)內(nèi)部、外部鏈接、去除錯(cuò)標(biāo)簽、空標(biāo)簽、多余的標(biāo)簽等，它的使用相當(dāng)簡單，使用全面檢測(cè)站點(diǎn)功能如下：
（1）、選擇菜單中【站點(diǎn)】的【報(bào)告】命令，打開一個(gè)窗口。
（2）、選擇檢測(cè)范圍，在【報(bào)告】選項(xiàng)中有四個(gè)內(nèi)容供選擇：Current Document、Entire Local Site、Select Files in site、Folder。
（3）、對(duì)工作流方面的信息進(jìn)行檢測(cè)。
（4）、對(duì)HTML文件的信息做出檢查。
把編好的網(wǎng)站文件復(fù)制到D:/my web文件夾中，可以打開瀏覽器，在地址欄中輸入http://localhost/my web/index.asp ,就會(huì)看見網(wǎng)站了。
3、維護(hù)
網(wǎng)站建成后并不意味著網(wǎng)站建設(shè)的結(jié)束，網(wǎng)站內(nèi)容需要不斷更新，這樣才會(huì)不斷的吸引更多的瀏覽者訪問，才能成為一個(gè)優(yōu)秀的網(wǎng)站。通過FTP軟件將更新過的網(wǎng)頁上傳到服務(wù)器或通過Dream weaver MX來遠(yuǎn)程管理站點(diǎn)，同時(shí)還要認(rèn)真回復(fù)瀏覽者的電子郵件和留言，做到有問比答。平時(shí)多收集資料，多聽聽別人建議，定期更新版面，還有推廣站點(diǎn)。
（二）設(shè)計(jì)技巧和解決方法
用服務(wù)器端包含技術(shù)實(shí)現(xiàn)對(duì)文件的引用
系統(tǒng)中有許多頁面都會(huì)引用相同的代碼文件，所以使用include語句將已完成代碼的文件包含進(jìn)來，就可以簡化代碼的縮寫。如首頁面indes.asp中第二行和第三行代碼。
結(jié)束語
經(jīng)過老師耐心細(xì)致的指導(dǎo)，及同學(xué)之間的相互交流，同時(shí)翻閱了大量的資料(包括網(wǎng)上資料，書本及學(xué)校的一些相關(guān)資料)經(jīng)過近一段時(shí)間的努力，個(gè)人網(wǎng)站的設(shè)計(jì)制作告一段落。總結(jié)這次“文武屋-個(gè)人網(wǎng)站”開發(fā)制作過程，我們綜合使用了目前因特網(wǎng)上比較流行的各種靜態(tài)制作方法及交互式動(dòng)態(tài)網(wǎng)站的制作設(shè)計(jì)手段，并對(duì)初步利用后臺(tái)程序完成了網(wǎng)站的動(dòng)態(tài)響應(yīng)與生成網(wǎng)頁的技術(shù)。同時(shí)也從中學(xué)習(xí)了對(duì)靜態(tài)頁面的處理風(fēng)格，色彩搭配，頁面導(dǎo)航方面有了一定經(jīng)驗(yàn)。對(duì)用Javascript語言制作動(dòng)態(tài)效果也有了更進(jìn)一步的認(rèn)識(shí)。在交互式網(wǎng)頁設(shè)計(jì)學(xué)會(huì)了如何使用Access建立數(shù)據(jù)庫，以及對(duì)數(shù)據(jù)庫瀏覽，修改，添加，查詢。如何用ASP編寫程序來方便用戶在網(wǎng)上查看網(wǎng)站各方面的信息和交流。本次設(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]吳濤主編，網(wǎng)站全程設(shè)計(jì)技術(shù)（修訂本），北京：清華大學(xué)出版社；北京交通大學(xué)出版社，2006.7 [2]龍馬工作室編，ASP+SQL Server組建動(dòng)態(tài)網(wǎng)站實(shí)例精講，北京：人民郵電出版社，2004.8 [3] 趙增敏編，ASP動(dòng)態(tài)網(wǎng)頁設(shè)計(jì)，電子工業(yè)出版社，2003.8 [4] 任學(xué)文、范嚴(yán)編, 網(wǎng)頁設(shè)計(jì)與制作，中國科學(xué)技術(shù)出版社，2006.8 [5] 武創(chuàng)、王惠,網(wǎng)頁設(shè)計(jì)探索之旅 ,電子工業(yè)出版社，2006.9 [6] 杜巧玲等編, 網(wǎng)頁設(shè)計(jì)超級(jí)夢(mèng)幻組合,清華大學(xué)出版社, 2003.3 [7] 吳黎兵、羅云芳編，網(wǎng)頁設(shè)計(jì)教程，武漢大學(xué)出版社，2006.2 [8] 莊王健編，網(wǎng)頁設(shè)計(jì)三劍客白金教程，電子工業(yè)出版社，2006.01
點(diǎn)擊咨詢 