第一篇：網頁設計與制作實驗過程及報告

網頁制作過程及報告

網頁設計與制作的一般實驗步驟：

1、確定網站主題

網站里的每一個網頁都要有統一的風格，以加強渲染自己性格的效果。最重要的是做出自己的風格，吸引瀏覽者的眼球。

2、搜集材料

主要在網站上搜集所要的網頁信息，包括圖片、文字、相關的新聞，同時，查詢相關的圖書、報紙、光盤、多媒體等，也可以得來更加有說服力的信息。

3、規劃網站

我的網站包括5個頁面。版面設計要靈活，根據各部分內容的不同適當的自由設計。但是每個頁面的主元素和位置不能變。用CSS設計一個樣式，以保證隨時、準確的調用。另外，為了網頁布局的協調，還可以加入flash動態圖片，會達到更好的效果。

4、選擇合適的制作工具

做網頁的首先工具當然為Dreamweaver。

5、認識網頁設計工具Dreamweaver

（1）Dreamweaver的啟動

（2）窗口組成的認識

6、新建站點

7、站點中首頁的創建

8、制作網頁

素材、風格、模板都設計好以后，下一步就是具體的制作網頁。制作網站時，首先要做的就是站點的規劃，建立一個本地站點。網頁中的css 樣式文件也應統一管理，做到有條不紊。

9、根據自己的網頁風格，在網上搜集合適的圖片。

最后還要制作各個頁面的鏈接，把整個網頁可憐起來，形成一個統一的整體，方便瀏覽者進行各個頁面間的跳轉。

10、上傳測試

網頁制作完畢以后，要進行測試，在瀏覽器上運行自己的網站，反復測試，以發現設計中的缺陷。

實驗結果及理論分析：

通過這簡短的三個周的學習，讓我有一個獨立設計，制作網頁的機會，通過這次試驗，我的收益頗多。首先，獨立的實踐了一個完整的網站設計的全過程，把設計中零散的注意點和要求在自己大腦中形成了一個完整的框架體系，使平時學到的知識點有了一個質的升華，并且合理的在試驗中進行了實踐。第二，在這次實驗的過程中，我搜集了大量的素材和網頁設計的技術技巧方面的書，擴大了知識面，給我在以后的設計過程中能博采眾長，制作出技術精湛的網頁打下了基礎。最后，我感受最深的是，技術方面的學習，最重要的是自己實踐做出東西，只通過自己的親身實踐，才能學會、學懂、學通技術。

朱禮明

信息管理與信息系統1301班

2014.07.23

第二篇：電子政務網頁設計與制作實驗教案

《電子政務網頁設計與制作》實驗教案

實驗名稱 IIS的安裝與調試

實驗類型：演示型√ 驗證型□ 綜合型□ 設計型□ 實驗類別：基礎√ 專業基礎□ 專業□ 實驗要求：必做√ 選做□ 實驗學時：2 實驗對象：本科生

一、實驗目的

1．掌握檢測不同版本Windows操作系統IIS的安裝與否； 2.掌握在Windows操作系統中安裝IIS的方法；

3．掌握利用IIS設置虛擬目錄調試ASP程序的初步方法。

二、實驗重點、難點

利用IIS設置虛擬目錄調試ASP程序

三、實驗原理

ASP模型的運行原理是：當瀏覽器向Web服務器請求.asp文件時，服務器端腳本開始運行，WEB服務器調用.asp文件，將運行結果發送到瀏覽器。

四、實驗設備、實驗教學軟件介紹

個人PC，Windows 2000,IIS 5.0,記事本

五、實驗分組及組織情況

無

六、實驗的基本操作與實驗重要步驟

1、實驗前先觀看指導老師的演示；

2、如果計算機未安裝IIS，使用安裝程序安裝IIS；

3、利用記事本編寫教材P13 1－1的ASP程序并存盤；

4、在IIS中建立虛擬目錄，調試ASP程序，找出并解決問題，確保調試成功，并相互訪問；

5、學生獨立完成相應的實驗報告。

七、實驗教學，如實驗教學內容設計、時間設計、實驗教學手段設計、實驗指導設計等；

參照上述實驗內容，分模塊講解各業務流程的作用和操作方法

八、預期的實驗效果

多數學生能獨立完成實驗，掌握基本原理和方法。

九、實驗中應注意事項

對于因操作系統本身的原因，無法安裝調試好IIS，需重新安裝系統。

十、課外實驗或思考題

教材P13 練習1-1

十一、實驗教材及實驗參考資料

《ASP網頁數據庫短訓教程》、劉瑞新主編，機械工業出版社，2005年出版

十二、實驗后記

學生獨立完成實驗報告

實驗名稱 HTML網頁編輯

實驗類型：演示型√ 驗證型□ 綜合型□ 設計型□ 實驗類別：基礎√ 專業基礎□ 專業□ 實驗要求：必做√ 選做□ 實驗學時：2 實驗對象：本科生

一、實驗目的

1．掌握HTML基本標記的使用； 2.掌握HTML中超級鏈接的使用方法；

3．掌握HTML中特殊符號、圖片鏈接的使用方法。

二、實驗重點、難點

HTML中特殊符號、圖片鏈接的使用方法

三、實驗原理 HTML標記語言

四、實驗設備、實驗教學軟件介紹

個人PC，Windows 2000,IIS 5.0,記事本

五、實驗分組及組織情況 無

六、實驗的基本操作與實驗重要步驟

1.實驗前先觀看指導老師的演示；

2.利用記事本編寫教材P34 2－1的HTML程序并存盤； 3.調試；

4.學生獨立完成相應的實驗報告。

七、實驗教學，如實驗教學內容設計、時間設計、實驗教學手段設計、實驗指導設計等；

參照上述實驗內容，分模塊講解各業務流程的作用和操作方法

八、預期的實驗效果

多數學生能獨立完成實驗，掌握基本原理和方法。

九、實驗中應注意事項

注意熱點鏈接的使用，調試出問題時，多從連接文件的上下級目錄上找原因。

十、課外實驗或思考題

教材P34 練習2-1

十一、實驗教材及實驗參考資料

《ASP網頁數據庫短訓教程》、劉瑞新主編，機械工業出版社，2005年出版

十二、實驗后記

學生獨立完成實驗報告

實驗名稱 Vbscript對象編程

實驗類型：演示型√ 驗證型□ 綜合型□ 設計型□ 實驗類別：基礎√ 專業基礎□ 專業□ 實驗要求：必做√ 選做□ 實驗學時：2 實驗對象：本科生

一、實驗目的

1．掌握Vbscript的基本數據類型、常量、變量、表達式和常用函數； 2.掌握在HTML中插入Vbscript編碼的方法； 3．掌握事件驅動程序的編制。

二、實驗重點、難點

事件驅動程序的編制，面向對象的程序設計思想的掌握。

三、實驗原理

Vbscript事件驅動程序編制。

四、實驗設備、實驗教學軟件介紹

個人PC，Windows 2000,IIS 5.0,記事本

五、實驗分組及組織情況

無

六、實驗的基本操作與實驗重要步驟

1.實驗前先觀看指導老師的演示；

2.利用記事本編寫教材P74練習4－1題的程序并存盤； 3.調試；

4.學生獨立完成相應的實驗報告。

七、實驗教學，如實驗教學內容設計、時間設計、實驗教學手段設計、實驗指導設計等；

參照上述實驗內容，分模塊講解各業務流程的作用和操作方法

八、預期的實驗效果

多數學生能獨立完成實驗，掌握基本原理和方法。

九、實驗中應注意事項

對象編程的思想，對象事件的編程方法。

十、課外實驗或思考題

教材P74 練習4-1

十一、實驗教材及實驗參考資料

《ASP網頁數據庫短訓教程》、劉瑞新主編，機械工業出版社，2005年出版

十二、實驗后記

學生獨立完成實驗報告

實驗名稱 表單設計

實驗類型：演示型√ 驗證型□ 綜合型□ 設計型□ 實驗類別：基礎√ 專業基礎□ 專業□ 實驗要求：必做√ 選做□ 實驗學時：2 實驗對象：本科生

一、實驗目的

1．掌握DHTML中INPUT控件的使用； 2.掌握DHTML中SELECT控件的使用； 3．掌握DHTML中TextArea控件的使用。

二、實驗重點、難點

掌握DHTML中INPUT控件的使用

三、實驗原理 DHTML語言

四、實驗設備、實驗教學軟件介紹

個人PC，Windows 2000,IIS 5.0,記事本

五、實驗分組及組織情況

無

六、實驗的基本操作與實驗重要步驟 1.實驗前先觀看指導老師的演示；

2.利用記事本或Dreamweaver等軟件編寫表單程序并存盤； 3.調試；

4.學生獨立完成相應的實驗報告。

七、實驗教學，如實驗教學內容設計、時間設計、實驗教學手段設計、實驗指導設計等；

參照上述實驗內容，分模塊講解各業務流程的作用和操作方法

八、預期的實驗效果

多數學生能獨立完成實驗，掌握基本原理和方法。

九、實驗中應注意事項 Dreamweaver集成化工具的使用

十、課外實驗或思考題

教材P121 練習6-1

十一、實驗教材及實驗參考資料

《ASP網頁數據庫短訓教程》、劉瑞新主編，機械工業出版社，2005年出版

十二、實驗后記

學生獨立完成實驗報告

實驗名稱 Response對象應用

實驗類型：演示型√ 驗證型□ 綜合型□ 設計型□ 實驗類別：基礎√ 專業基礎□ 專業□ 實驗要求：必做√ 選做□ 實驗學時：2 實驗對象：本科生

一、實驗目的

1．掌握Response對象中Write方法的使用； 2.掌握Response對象中Redirect方法的使用； 3．掌握Response對象中End方法的使用。

二、實驗重點、難點

Response對象中Write方法的使用

三、實驗原理

ASP中Response對象應用

四、實驗設備、實驗教學軟件介紹

個人PC，Windows 2000,IIS 5.0,記事本

五、實驗分組及組織情況

無

六、實驗的基本操作與實驗重要步驟

1.實驗前先觀看指導老師的演示；

2.利用記事本或Dreamweaver等軟件編寫程序并存盤； 3.打開IIS并設置虛擬目錄進行調試； 4.學生獨立完成相應的實驗報告。

七、實驗教學，如實驗教學內容設計、時間設計、實驗教學手段設計、實驗指導設計等；

參照上述實驗內容，分模塊講解各業務流程的作用和操作方法

八、預期的實驗效果

多數學生能獨立完成實驗，掌握基本原理和方法。

九、實驗中應注意事項

對于ASP的內置對象，注意代碼的編寫規范性。

十、課外實驗或思考題

教材P142 練習7-1

十一、實驗教材及實驗參考資料

《ASP網頁數據庫短訓教程》、劉瑞新主編，機械工業出版社，2005年出版

十二、實驗后記

學生獨立完成實驗報告

實驗名稱 交互式表單程序設計

實驗類型：演示型√ 驗證型□ 綜合型□ 設計型□ 實驗類別：基礎√ 專業基礎□ 專業□ 實驗要求：必做√ 選做□ 實驗學時：2 實驗對象：本科生

一、實驗目的

1．掌握交互式表單程序設計的方法； 2.掌握Response對象中Write方法的使用； 3.掌握Request對象中Form集合的應用。

二、實驗重點、難點

Request對象中Form集合的應用

三、實驗原理

ASP交互式表單程序設計

四、實驗設備、實驗教學軟件介紹

個人PC，Windows 2000,IIS 5.0,記事本

五、實驗分組及組織情況

無

六、實驗的基本操作與實驗重要步驟 1.實驗前先觀看指導老師的演示；

2.利用記事本或Dreamweaver等軟件編寫程序并存盤； 3.打開IIS并設置虛擬目錄進行調試； 4.學生獨立完成相應的實驗報告。

七、實驗教學，如實驗教學內容設計、時間設計、實驗教學手段設計、實驗指導設計等；

參照上述實驗內容，分模塊講解各業務流程的作用和操作方法

八、預期的實驗效果

多數學生能獨立完成實驗，掌握基本原理和方法。

九、實驗中應注意事項

注意對于Form集合的運用，代碼要規范。

十、課外實驗或思考題

教材P163 練習8-1

十一、實驗教材及實驗參考資料

《ASP網頁數據庫短訓教程》、劉瑞新主編，機械工業出版社，2005年出版

十二、實驗后記

學生獨立完成實驗報告

第三篇：個人網頁制作過程

個人網頁制作過程：

制作個人網頁的目的就是向大家介紹自己，我制作個人網頁的過程如下

（1）首先是熟悉并熟練一款網頁制作軟件的使用方法，這樣制作出來的個人主

頁才不會顯得粗糙，我選擇的是frontpage，這款軟件比較適合于初學者來使用。雖然在制作效果上也許會遜色一點，但是其優點的是比較容易上手。

（2）其次就是選擇素材了，網頁上那些好看的背景還有點綴以及一些裝飾，標

志性的圖片，元素都是需要自己來選擇的。選擇好了這些圖片元素會為你的網頁增添很多生氣。這里介紹一個比較好的網站。我的所有圖片元素以及背景都是從這里面找的。

（3）所需要介紹的當然是自己的個人信息，包括自己的基本信息以及自己的愛

好，工作以及一些零碎的感悟。這些都是要在網頁里面表達出來的文本信息，所以必須要實現準備好。

（4）現在就是需要布置自己的網站了，我的計劃是用多頁面網站來介紹自己，制作個人主頁。首先必須有一個主頁，里面是我的基本信息，然后有幾個選項，分別超鏈接我的愛好，我的工作以及我的感悟。在下面會有三個子網頁，分別就是我的愛好，我的工作以及我的感悟。出去剩下的兩個不在超鏈接以外，我的愛好會再向下借三個子網頁，分別是我喜歡的歌，我喜歡的書和我喜歡的電影。

（5）有了明確的目標就開始著手制作，在上面那個網站里下載的背景和矢量圖

都是需要加工的，需要利用繪圖工具把需要的元素從整個照片里摳出來，把不需要的多余的部分擦除，在這個時候什么圖片需要放置在什么地方用來做什么已經有一個大致的想法。

（6）沒有用其他的網頁制作工具，frontpage里面需要事先插入表格，將圖片

文本信息填到適合的表格里，這里面的布局工作就需要自己動手了，以個人愛好而定，里面遇到了不少問題，但都最終被我解決了。這里面插入圖片需要在插入選項里面選擇插入圖片，設置背景則是在格式選項里選擇背景，背景圖片也要在繪圖工具里設定好尺寸。一開始我選擇的網頁形式是新建一個只有一個網頁的網站，后面的子網頁可以在網站里新建網頁來實現。

第四篇：網頁設計及制作 實習報告

中原工學院信息商務學院畢業實習報告專用紙

網頁設計及制作

【實習目的】

熟悉和掌握計算機網頁設計的基本技巧及網頁制作相關工具軟件等內容。通過網頁設計理論聯系實際操作，鞏固所學的知識，提高處理問題的能力。充分學習網頁設計實踐中的操作理論，提高自己網頁設計水平，并為能順利與社會環境接軌做準備。

【實習時間】

2012年2月15日至2012年3月15日

【實習地點】

未來路錦江國際花園9棟501室

【實習單位】

鄭州市托斯卡納餐飲有限公司

【實習內容和過程】

實習內容：

我在托斯卡納餐飲公司旗下的56°網絡蛋糕店一個月的實習，我的工作就是負責設計整個網站的頁面部分。為其一個月的實習，使我第一次親身感受到了所學知識與實際的應用，作為一個網站美工除了要求網頁三劍客,ps,這些必會的軟件以外，還要對Html用的很熟,對ASP或PHP或jsp要有初步的了解。通過這次實習，進一步鞏固和深化所學的理論知識，為以后的工作打好基礎。以下是我做的一些實習過程中的經驗總結：

（1）表達一定的藝術效果

一個成功的網站應該把網頁設計得吸引人，同時又要傳達設計思想和情感。網頁作為一種媒體，它必須具有一定的藝術感染力，一個平淡無奇、雜亂無章或毫無美感的網頁很難會有瀏覽者喜歡，更不要說讓瀏覽者去注意它的內容了。

（2）使頁面結構清晰可讀性強

經常可以看到這樣的頁面，上面堆砌了許多內容，卻沒有考慮它的空間框架，讓人看了無法知曉哪些內容才是最具發言權的。沒有流暢的視覺流程，這是典型的沒有注意到編排清晰度、可讀性的表現。

（3）實現不同的功能

在網絡這條信息高速公路上，網頁最主要的功能就是一種傳遞信息的手段。因此，它一切內容都是為了這個目的而服務，都是要圍繞這個中心進行設計的。然而，要實現這個功能，網頁的美工設計和內容都必須有針對性。所謂針對性，就是指對不同類別的網頁要求采用不同的美工藝術效果。

（4）網頁的內容

網頁設計人員美化網頁，增加網頁設計的藝術感，都是為了網頁設計的內容服務的。一般來說，網頁的幾項基本內容：標題、網站標志、主體內容、導航、廣告欄等。

（5）確定網站的類型

在設計網頁之需要做大量的準備工作，需要思考以下幾個問題：

1、網站的類型：站點屬于新聞、娛樂、商務類的綜合站點，還是個人主頁；

（6）確定網站的風格

如果瀏覽者主要是年輕人，頁面就要設計得基調明快，活潑富有朝氣；如果針對的群體是政府工作者或科學工作者，那么頁面就要設計得嚴謹、嚴肅、理性、科學；如果針對的群體是婦女兒童，頁面則要設計得溫馨、友愛、輕松；如果針對的群體是戀人或從事藝術工作的人，頁面就要設計得浪漫并有藝術感

（7）確定網頁之間的鏈接關系

在網站的總體規劃列出來后，就必須要考慮各個網頁之間的關系，是星型、樹型、網型還是直線鏈接。

實習過程：

1．我所在的公司是托斯卡納餐飲公司旗下的56°蛋糕部門，主要項目是蛋糕類。而我主要是負責網頁設計制作這一塊。

2.因為是有關蛋糕的網站，我首先從網上了解了一些有關項目和一些基本常識。接下來我就應該考慮配色與構圖了。這在做食品網頁上是最關鍵的環節。考慮配色與構圖：對整個內容有了一了解后，現在要思考作品的色彩和具體的構圖，先用筆畫出草圖，也可以直接在腦海里構思。色彩要活潑健康，所以選擇粉色作為主色調。

查找素材：其實素材這種東西總是數量大于質量，我可以很輕易的下載到許多許多的素材，但卻很少用的到它。為了使網頁看上去質量更好，要對圖片的進

行篩選，加上拍攝的蛋糕圖片。

開始設計：設計的時間是最多的，有的時候，在設計時原先找到的素材就不能用了，甚至全部用不到。所以后來我就先設計，想用什么圖的時候再找。加上去拍攝蛋糕的照片使用PS進行加工，讓的圖片上的蛋糕更加誘人。做一張首頁效果圖一般用兩天的時間。然后把效果圖給領導看，等到領導通過才能進行下一步工作。

做子頁：子頁一般需要五六張效果圖。不過，對于這一步驟來將，我們就輕松多了。時間一般也需要兩天。

切圖：所有的效果圖做好了之后就開始切圖，切圖其實就是把效果圖變成網頁。一般需要兩天。切圖之中其實會遇到好多匪夷所思的事情，不過當你熟練這后就好了。當然，一開始我經常會遇到，比如代碼的意思是使網頁正題居中，但結果卻是整個網頁偏移到了左邊。等等這樣的事情在我初期切圖的時候經常遇到。現在好多了。

完成：做到這一步我的任務就完成了。

工作這么長時間，對一切越來越熟習之后，總想找到一些別的感覺。每天我會去不同風格的網站，會觀察他們出彩的地方，然后不斷加強自身的職業素質。

【實習體會和收獲】

光陰似箭，日月如梭。轉眼間，愉快而又充實的網頁實習結束了，在這一個月的時間里，讓我嘗試了理論與實踐相結合。網頁設計理論一點點轉化為實踐經驗。豐富的實習生活充滿了驚喜，快樂和充實，當然也少不了網頁設計過程中的困難。實習結束了，覺得腦袋里又注入了新的知識，對網頁設計也有了新的了解，在以后的工作中，希望能用自己了解的東西去處理相關問題，在探究新的問題，使自己不斷進步。

在實習生涯中影響了我很多，就像我用兩天的時間制作出一張首頁效果圖，他人往往只能看到完成品。而這并不是最重要的，最重要的是別人沒有經歷的我卻在珍惜的創作過程。也許這個過程還遠遠不能稱之為創造，但我會努力的。做了一個月的美工，終于體會到網頁設計無非是圖文混排的那點事。不過，當你真正的去努力的創造了之后，結果卻并不會每次都是好的。太多自己精心設計的東西，被別人一眼就否定了。當時心情真的很糟糕。不過，現在想想，這都些都沒

有什么，這也無非是成長中常常要遇到的事罷了。

在實習過程中，我發現社會比校園更殘酷，在工作的單位我學會了，凡事第一反應是找方法，而不是找借口；凡事先訂立目標，并且盡量制作“夢想板”；凡事預先做計劃，盡量前目標視覺化；六點優先工作制，每一分，每一秒做生產力的事情；把重要的觀念，方法寫下來，并貼起來，以隨時提示自己；每天提前30分鐘上班，推遲30分鐘下班。

工作是人生活的重要部分，不論是消極還是積極，都會給人帶來不同感受。而精彩的生活往往有來源于有意義的工作中，所以我不會讓自己因工作的煩惱、困難和壓力，困擾自己，使自己工作情緒化、生活情緒化。遇到困難我會用平常的心態實際看待問題，告自己凡事要先做人、后做事。

第五篇：網頁設計與制作期末設計報告

網頁設計與制作

---個人網站設計報告

指導老師：盛加林 學號：20082809 姓名：杜才偉 班級：信管0802

一． 概述

隨著網絡技術的迅速發展，網絡應用越來越趨于平凡化，無論是企業還是其他組織機構或者是個人，都希望利用計算機網絡技術開發對自己有價值的東西。關于個人網站，現在越來越多的人通過個人網站記錄自己的故事，與朋友分享生活的點滴，同時還可以通過個人網站廣交朋友。

本次的個人網站設計是網頁設計與制作的期末檢測，同時也是對自己學習的檢驗。本次設計運用平臺是windows，運用的工具是Macromedia Dreamweaver 8，主要語言是html語言和javascript，樣式設計采用的是css樣式。

在個人網站的設計中，我采用了通常iframe網頁框架，風格源于自己瀏覽其他網站的靈感，網頁flash的設計借鑒了網上優秀flash動畫，首頁還采用了網頁音樂播放器控件。照片的處理用到了photoshop和Macromedia Fireworks 8。

二． 設計結構圖

個人空間我們的故事

相冊關于我首頁 三． 設計主題

歲月如梭，年華似水。默默流逝的青春給我們每個人留下了不同的回憶，我的個人空間的設計主要是記錄大學生活。有學校的剪影，有寢室的合影??每一張記錄都是未來的我最美好的回憶。設計的主要以懷念為主題。曾經的那些花兒，曾經的那些故事都是生命里美的轉彎。

四． 模塊介紹

（一）、首頁介紹

首頁是個人網站的入口，大概的設計框架是頭是一個部分、頭以下分為左右兩個部分。頭部如下圖：

導航條：

導航條主要是“我們的故事”、“相冊”、“關于我”三個模塊的超鏈接點擊三個連接即可跳轉到不同頁面。頭部以下部分：

這部分的設計主要有圖片處理、文字從下往上滾動、音樂播放器、時鐘的設計、flash設計

(二)、我們的故事

我們的故事主要是文字描述，整體樣式如下：

這個部分主要是記錄一些故事，每一段故事中都會存在一些悲傷的插曲，背景漂浮的flash動畫加上背景音樂，還有略帶傷感的文字，整體呈現淡淡的傷感而又不失積極向上。

(三)、相冊 相冊主要是展示大學四年中的記錄，有關于學校的，有我們寢室的，有自己的：整天樣式如下圖：

相冊頁面上面是大學里照片的輪換，中間是自己處理后的照片，下面是文字大概描述照片的故事：

(四)、關于我 五． 主要設計

(一)、首頁主體框架