第一篇：《網(wǎng)頁設計實訓》大一實訓報告

網(wǎng)頁設計實訓報告

二零一零年一月 網(wǎng)站主題： 左手倒影右手年華

本次實訓歷時五天，首先上網(wǎng)查看他人網(wǎng)站，之后規(guī)劃自己的網(wǎng)站，然后收集文字和圖片資料，打開dreamweaver 8軟件，選擇新建站點，著手自己的網(wǎng)頁制作，有時在做網(wǎng)頁時會遺忘掉以前學過的知識，我還翻了以前的學過的知識點。這個網(wǎng)站，我多次使用到跑馬燈，我還上網(wǎng)查了一些資料，本想找些代碼運用到這個網(wǎng)站中，可是有些失敗，就用了跑馬燈的鏈接。

一、網(wǎng)站的主題說明

本次實訓我是以郭敬明的小說集《左手倒影右手年華》為網(wǎng)頁題材內(nèi)容，網(wǎng)頁分有五個類別，包括主頁、小說集、留言板、作者簡介和映像圖畫。主頁主要是小說的序言，用跑馬燈鏈接了郭敬明的新浪博客，小說集包含了《左手倒影右手年華》的一本小說文章：回首又見它、揚花、天下、一個仰望天空的小孩、莊周夢蝶、天亮說晚安、桃成蹊里的雙子座人、劇本、冬日的幻覺、關于《生活在別處》的別處、思想的聲音、畢業(yè)驪歌、某年某個春末夏初、八月天高人浮躁、猜火車、四季歌。

二、網(wǎng)站的總體規(guī)劃

這個網(wǎng)站結(jié)合了小說安靜、憂郁的內(nèi)容，是以暗色格調(diào)為主，主要是黑色和灰色，由主頁、小說集、留言板、作者簡介和映像圖畫五個標題欄構(gòu)成，分別用唯美的小圖片做標題按鈕，用黃色的字體突出鮮明。小說集里利用新頁面的鏈接小說內(nèi)容，運用的背景圖像大多都是暗色的，為了形成鮮明的對比，比如：暗色的背景，我就使用白色文字；亮色的背景，我就使用黑色文字。有幾篇文章，由于文字較少，我就把他們放在一個網(wǎng)頁里，運用了錨點鏈接，以減少空間。

二、網(wǎng)站的設計、制作

（圖1）

1.我在首頁之前加入了一張進入頁面（如圖1），我的網(wǎng)站是類似于空間類型，在這里，我用一張圖片就說明了我的網(wǎng)站主題，寫出了小說名。

2.我的主頁（如圖2），運用跑馬燈鏈接了郭敬明的博客，插入了時間，運用浮動框架插入了小說的序言。小說集、留言板、作者簡介和映像圖畫，是保存了首頁的模版來制作的，再制作相應的頁面，進行相應的浮動框架插入界面。

? 小說集里的每篇文章都鏈接到三級頁面（如圖3），在新的窗口打開，三級頁面里都運用了CSS樣板固定了背景圖像。? 留言板里，運用了表單。

? 作者簡介里著重介紹了作者的生平，圖片運用了跑馬燈。? 映像圖畫主要運用跑馬燈來播放圖片。

（圖2）

（圖3）

四、心得體會

五天的實訓課程結(jié)束了，此次實訓檢驗了這一學期的學習，且對知識進行了匯總，通過本次實訓我已基本掌握了制作簡單網(wǎng)頁的過程，基本學會運用dreamweaver 8的一些簡單操作。

在這五天的學習當中我覺得在制作過程中，發(fā)現(xiàn)自己學的東西太欠缺了，學習要有條不紊，要冷靜思索，所以我想以后課上課下一定要認真學習，虛心聽取別人意見，多去學習一點網(wǎng)頁制作的技術。掌握網(wǎng)頁設計基本概念和HTML的基本結(jié)構(gòu)，了解網(wǎng)頁技術概況、HTML的編輯和運行環(huán)境。掌握文字版面的編輯，掌握網(wǎng)頁的超鏈接技術的應用，了解圖像的處理，包括背景圖案、圖形、圖象及其超鏈接等的設定和應用。了解列表的各種使用，了解表格的基本語法，掌握表格的定義、控制、分組、標題等的應用。了解表單在網(wǎng)頁中的應用，了解如何在網(wǎng)頁中加入各種動態(tài)效果，了解網(wǎng)頁中CSS的基礎知識，掌握CSS的各種屬性應用。

但有些可惜，沒有運用上音頻，和視頻的運用，希望在下次的實訓中，能使用上，再接再厲了哈。

實踐出真理，實訓的日子過去了，從理論和操作中融合了我們平時所學的知識，為我們的學習和工作鋪墊了精彩的一幕。因此，我堅信，用心去做自己認為應該做的事，努力的開拓我們的極限，沒有什么是不可能的，我們要更加的去努力。

第二篇：網(wǎng)頁設計實訓報告

天津電子信息職業(yè)技術學院 暨國家示范性軟件職業(yè)技術學院

網(wǎng)頁制作實訓報告

姓名：系別：專業(yè)：班級：指導教師：完成時間：2012 年 6 月 1日

第三篇：網(wǎng)頁設計實訓報告

重慶科創(chuàng)職業(yè)學院

《靜態(tài)網(wǎng)站建設》 實 訓 報 告

題目：

專業(yè)：班級：學號：姓名：成績：指導教師：

完成日期：年月日

目錄

一、課程設計目的....................1

二、課程設計題目描述和要求.....................1

三、課程設計報告內(nèi)容...................1

3.1總體功能介紹...............................1

3.2總體框架結(jié)構(gòu)設計..............................2

3.3頁面設計.........................2

3.4總體測試與發(fā)布...........................2

四、結(jié)論......................2

五、結(jié)束語.........................3

六、主要參考資料....................3一、課程設計目的本課程是一門計算機科學與技術及相關專業(yè)實踐性環(huán)節(jié)。以HTML和CSS為基礎，全面介紹與網(wǎng)頁設計制作有關的知識，向?qū)W生闡明Web基本工作機制，并使學生具有一般網(wǎng)頁制作的能力。與此同時，通過對Web頁制作技術和制作工具的學習，使學生對網(wǎng)頁設計中所涉及的相關知識有一個全面的了解。通過本課程的學習，使學生全面了解網(wǎng)站建設與網(wǎng)頁設計的基本概念、基本理論及業(yè)務運作模式，了解網(wǎng)站建設與網(wǎng)頁設計的特點及工作過程，掌握網(wǎng)站的建立及網(wǎng)頁設計制作的方法，能夠完成一般性網(wǎng)站的建設，因此要求利用網(wǎng)頁設計方法，設計一個網(wǎng)站，提高綜合應用所學知識的能力，積累 Web 程序的編程經(jīng)驗，提高編程與調(diào)試能力，培養(yǎng)獨立學習、吸取他人的經(jīng)驗、探討技術的習慣和團隊協(xié)作能力。

二、課程設計題目描述和要求

每個設計人員設計制作利用DIV+CSS網(wǎng)頁布局方法制作的任意類型的網(wǎng)站（主題不限），制作網(wǎng)站所需的相關文字資料、圖片資料等可以到相關類型的網(wǎng)站上進行采集或自行采集。

要求：根據(jù)上面指定的網(wǎng)站開發(fā)項目內(nèi)容進行開發(fā)設計，網(wǎng)站欄目設置、網(wǎng)站要表達的具體內(nèi)容和網(wǎng)站的風格根據(jù)小組確定的課題進行設計；要求根據(jù)網(wǎng)站設計規(guī)范和常用網(wǎng)制作頁技術進行設計；設計的網(wǎng)站要求結(jié)構(gòu)合理，版面美觀大方，顏色合理，風格一致，并運用適當?shù)膭討B(tài)網(wǎng)頁技術進行修飾。

三、課程設計報告內(nèi)容

3.1總體功能介紹

制作該網(wǎng)站的時代背景？該網(wǎng)站主要的功能是什么？可以實現(xiàn)哪些用途？主要使用的技術是什么？利用了哪些語言實現(xiàn)哪些效果……

3.2總體框架結(jié)構(gòu)設計

該網(wǎng)站有多少個模塊？層次關系是什么樣子的？并且可以繪制一個流程圖來進行進一步說明。

3.3頁面設計

3.3.1首頁（頁面、設計思路、主要代碼）

1．進行截圖；

2．對設計思路進行說明。

3．將主要代碼復制粘貼。

3.3.2各子頁（頁面、設計思路、主要代碼）

1．進行截圖；

2．對設計思路進行說明。

3．將主要代碼復制粘貼。

3.4總體測試與發(fā)布

使用的測試方法是什么？

測試中遇到的問題以及解決的方法。

四、結(jié)論

寫法要求：

1、概括地說明所進行工作的情況和價值，分析其優(yōu)點和特色，指出創(chuàng)新所在，性能達到何種水平，并應指出其中存在的問題和今后的改進方向，特別是對工作中遇到的重要問題要著重指出，并提出自己的見解。篇幅不宜過長。

2、結(jié)論要簡單、明確。在措辭上應嚴密，容易被人領會。應實事求是地介紹自己的工作成果，忌言過其實，在無充分把握時，應留有余地。

五、結(jié)束語

要求：在文章結(jié)尾處，通常以簡短的文字，對設計過程中自己的收獲，及工作過程中曾給自己以直接幫助的人員，例如指導老師、答疑老師及其他人員，表示自己的謝意。這不僅是一種禮貌，也是對他人勞動的尊重，是治學者應有的品質(zhì)。

六、主要參考資料

[1]吳東偉等，《網(wǎng)頁設計三劍客》，北京，清華大學出版社，2004年

[2]李宏，張敏，《網(wǎng)頁設計與制作》，北京，化學工業(yè)出版社，2006年

[3]李桂杰，《網(wǎng)頁設計與制作》，大連，大連理工大學出版社，2008年

[4]李英俊，《網(wǎng)頁設計與制作》，大連，大連理工大學出版社，2010年

…………………………………………………………………………..(要求:五號字，宋體，1.5倍行距。按作者、書名、出版社、地點、出版時間格式逐一列出，中間用逗號格開)

第四篇：網(wǎng)頁設計實訓報告

《網(wǎng)頁設計與制作》實訓報告

實訓題目:

專業(yè):

班級：

學號:

姓名：

實訓時間：

實訓地點：

指導教師:

一、實訓目的二、實訓環(huán)境(軟、硬件環(huán)境)

三、實訓內(nèi)容及相關技術

(具體的設計步驟及所使用的關鍵技術，要求附有圖表說明)

四、實訓結(jié)果及分析

五、實訓收獲、體會和問題

第五篇：《網(wǎng)頁設計》實訓報告

溫州科技職業(yè)學院信息技術系

《網(wǎng)頁設計》實訓報告

班級：數(shù)字媒體12-2班

學號:120309215指導教師：李余黨

姓名:李敏梓

一、實訓目的與要求

通過實訓使學生能夠更進一步的領會網(wǎng)站建設和網(wǎng)頁設計的基本知識，熟悉和掌握網(wǎng)站建設的基本流程和注意事項，熟練運用常用的網(wǎng)頁制作和設計工具的使用，熟練掌握DIV+CSS網(wǎng)頁布局設計技術,希望通過對網(wǎng)站的規(guī)劃與設計來培養(yǎng)學生綜合運用所學知識來建立網(wǎng)站的能力，掌握相關網(wǎng)頁制作軟件，為今后從事網(wǎng)站規(guī)劃、設計和開發(fā)工作打下基礎。

二.實訓內(nèi)容

制作好心情科技網(wǎng)頁，要求該網(wǎng)站能基本滿足該類型企業(yè)的某些需求能展示公司或產(chǎn)品的相關信息、宣傳企業(yè)形象與產(chǎn)品性能。網(wǎng)站設計和開發(fā)過程中，可以采用網(wǎng)絡素材，技術以靜態(tài)為主，積極支持和鼓勵使用動態(tài)技術

三.實訓過程中出現(xiàn)的主要問題和解決辦法

主要問題：在網(wǎng)頁創(chuàng)作中，網(wǎng)站主頁分布不規(guī)范，解決問題：利用div根據(jù)網(wǎng)頁所需的內(nèi)容 創(chuàng)建大致網(wǎng)站的框架，使之網(wǎng)頁美觀，干凈，整潔