最新網(wǎng)頁(yè)設(shè)計(jì)實(shí)訓(xùn)報(bào)告書(3篇)

隨著社會(huì)一步步向前發(fā)展，報(bào)告不再是罕見的東西，多數(shù)報(bào)告都是在事情做完或發(fā)生后撰寫的。那么，報(bào)告到底怎么寫才合適呢？下面是小編給大家?guī)淼膱?bào)告的范文模板，希望能夠幫到你喲!

網(wǎng)頁(yè)設(shè)計(jì)實(shí)訓(xùn)報(bào)告書篇一

2．掌握在本地環(huán)境下運(yùn)用asp技術(shù)實(shí)現(xiàn)一個(gè)簡(jiǎn)單的電子商務(wù)網(wǎng)站

二實(shí)驗(yàn)的方法和原理

三實(shí)驗(yàn)過程

1.資料的搜集。

組長(zhǎng)分配任務(wù)，大家從網(wǎng)站上搜集各種關(guān)于手機(jī)的資料。

2.熟悉制作軟件。

做網(wǎng)頁(yè)主要用的工具便是dremweaver、photoshop、flash軟件。在這些軟件我對(duì)dremweaver、photoshop相對(duì)比較熟悉，因?yàn)樵谄綍r(shí)上課是老師帶領(lǐng)我們運(yùn)用過。所以我還可以正常的運(yùn)用，但是出現(xiàn)的問題還是有很多。有很多不懂如何操作，只有通過在次去看書才能夠了解，這也體現(xiàn)了我學(xué)習(xí)方面的缺點(diǎn)，它是我平時(shí)不夠認(rèn)真的具體表現(xiàn)。

3.構(gòu)建站點(diǎn)框架。

打開dremweaver后第一步便是新建站點(diǎn)

4設(shè)計(jì)主頁(yè)及二級(jí)頁(yè)面。

5實(shí)現(xiàn)網(wǎng)頁(yè)間的鏈接

鏈接的過程其實(shí)很簡(jiǎn)單，主要是把要鏈接的文字選擇在選擇工具欄的鏈接按鈕最后選擇自己要鏈接的網(wǎng)頁(yè)單擊確定便可以了。

6向靜太網(wǎng)頁(yè)插入動(dòng)態(tài)效果

四實(shí)驗(yàn)心得

在經(jīng)濟(jì)迅速發(fā)展的今天，internet顯得更為重要它是人們發(fā)布信息與傳遞信息的重要渠道，為了與社會(huì)發(fā)展同步，為了讓我們成為真正的技術(shù)性人才。學(xué)校在本周為我們安排了維持三周的網(wǎng)頁(yè)制作專用周是實(shí)習(xí)，讓我們把平時(shí)所學(xué)知識(shí)運(yùn)用到實(shí)習(xí)中做到真正的學(xué)以致用而不只是紙上談兵。通過本周的實(shí)習(xí)使我獲得了更多的新知識(shí)同時(shí)也使我使我認(rèn)識(shí)到了自己在學(xué)習(xí)上的許多不足。

近三個(gè)星期的實(shí)訓(xùn)將要結(jié)束，其中的酸甜苦辣我會(huì)在今后的日子里不斷地去咀嚼，去回味，去探索。從制作網(wǎng)頁(yè)過程中，我學(xué)到了新的美化網(wǎng)頁(yè)的方法，運(yùn)用了更多以前未運(yùn)用的技巧。這使我學(xué)到了更多的知識(shí)，并且為我自己在制作網(wǎng)頁(yè)這方面積累了一些經(jīng)驗(yàn)。這些將是我人生中的一次重要的經(jīng)歷，將是我今后走上社會(huì)后的一筆巨大的財(cái)富。這次實(shí)習(xí)的收獲對(duì)我來說有不少，我自己感覺在知識(shí)、技能等方面都有了不少的收獲?？傮w來說這次是對(duì)我的綜合素質(zhì)的培養(yǎng)，鍛煉和提高。

網(wǎng)頁(yè)設(shè)計(jì)實(shí)訓(xùn)報(bào)告書篇二

《 網(wǎng)頁(yè)制作與網(wǎng)頁(yè)設(shè)計(jì) 》

教學(xué)

實(shí)習(xí)目的1、通過實(shí)習(xí)，使學(xué)生加深對(duì)所學(xué)課程內(nèi)容的認(rèn)識(shí)、理解、掌握，達(dá)到對(duì)所學(xué)知 識(shí)、技能系統(tǒng)化、條理化的目的，鞏固、提高學(xué)習(xí)效果。

2、通過綜合應(yīng)用實(shí)習(xí)，熟練掌握 dreamwervermx8、flash mx8、fireworks 8 的各項(xiàng)操作并能夠掌握制作網(wǎng)頁(yè)的技能，根據(jù)所學(xué)技能學(xué)以致用，解決實(shí)際問 題，提高操作應(yīng)用熟練程度。

知道 dreamwervermx8 是 及網(wǎng)頁(yè)制作和網(wǎng)站管理于一身的網(wǎng)頁(yè)制作軟件，它是專門為網(wǎng)頁(yè)設(shè)計(jì)師量身定制的可視化網(wǎng)頁(yè)制作軟件，利用它可以為方便、快捷地制作跨平臺(tái)話瀏覽的動(dòng)感網(wǎng)業(yè)。

了解 fireworks 是處理圖片的軟件，使用它可以創(chuàng)建和編輯位圖、矢量圖 形，還可以非常輕松的做出各種網(wǎng)頁(yè)設(shè)計(jì)中常見的效果，例如動(dòng)畫、轉(zhuǎn)換圖像、導(dǎo)航條、下拉菜單等。設(shè)計(jì)完成以后，如果要在網(wǎng)頁(yè)設(shè)計(jì)中使用，可將它輸出 為 teml 文件，還能輸出在 photoshop、illustrator 和 flash 等軟件中編輯的 格式。

通過對(duì) flash 的學(xué)習(xí)，掌握如何處理矢量圖形，制作矢量動(dòng)畫，掌握如何 添加音樂、時(shí)動(dòng)作控制在 flash 內(nèi)容和集成 flash 影片，了解 actionscript 腳 本語言創(chuàng)建交換形式、在實(shí)習(xí)的過程中鞏固了對(duì)前面的知識(shí)的學(xué)習(xí)，加深對(duì)知識(shí)的了解，進(jìn)一步 對(duì)網(wǎng)頁(yè)設(shè)計(jì)的見解，也突出了個(gè)人的特點(diǎn)，運(yùn)用所學(xué)的知識(shí)做出了讓自己滿意 的作品。

四、實(shí)習(xí)內(nèi)容及方法

一、實(shí)習(xí)任務(wù)：

1、通過仔細(xì)閱讀網(wǎng)頁(yè)設(shè)計(jì)及網(wǎng)站規(guī)劃課程教材、網(wǎng)上資料、教參等相關(guān) 內(nèi)容，加深對(duì)相關(guān)概念的理解、理論的理解、掌握、運(yùn)用。

2、嚴(yán)格按照實(shí)習(xí)指導(dǎo)書的相關(guān)要求，完成了各項(xiàng)綜合操作，并將相應(yīng)圖像制作、動(dòng)畫制作和頁(yè)面設(shè)計(jì)的作品進(jìn)行了保存。 3、及時(shí)積極完成各項(xiàng)實(shí)習(xí)報(bào)告的撰寫。

4、實(shí)習(xí)結(jié)果及實(shí)習(xí)項(xiàng)目嚴(yán)格按照要求及時(shí)保存、展示。

二、實(shí)習(xí)內(nèi)容：

（一）、使用 dreamwervermx8、flash mx8、fireworks 8 完成惠爾公司網(wǎng) 站。（二）、dreamwervermx8、flash mx8、fireworks 8 的使用方法和制作技 巧。

1、創(chuàng)建一個(gè)站點(diǎn)：

站點(diǎn)的名稱就是“惠兒網(wǎng)站”,站點(diǎn)創(chuàng)建成功命一個(gè)首頁(yè)是 再下面創(chuàng)建了 5 、、、、。其示意圖如下：

2、網(wǎng)頁(yè)中的圖像處理：

利用 photoshop、和 fireworks 通過處理風(fēng)景圖

在里面運(yùn)用到濾鏡的工具目的是讓圖片更加的形象逼真，處理后的圖 片效果如圖所示：

3、布局與表格的編排：

在網(wǎng)頁(yè)設(shè)計(jì)中我偏好用表單編排一般情況下我的布局是在一個(gè)大的表 單里寫很多文字插入許多圖片。其版面如圖所示：

1.

二級(jí)頁(yè)面制作方法如法炮制。4、網(wǎng)頁(yè)的鏈接

網(wǎng)站中重要的就是各個(gè)子網(wǎng)頁(yè)與主頁(yè)面之間的鏈接，如果沒連接好或 者鏈接錯(cuò)誤就會(huì)影響整個(gè)網(wǎng)站運(yùn)行的效果。列如 我要把產(chǎn)品列表這 個(gè)二級(jí)網(wǎng)頁(yè)跟主網(wǎng)頁(yè) 鏈接方法如下：

回到 /點(diǎn)擊頁(yè)面右下方的鏈接文件夾，找到我要鏈接的二級(jí) 網(wǎng)頁(yè)。

打開/鏈接后我的鏈接字體會(huì)變成我所設(shè)置的字體顏色，這樣表明我的 鏈接成功。

預(yù)覽后在主頁(yè)面點(diǎn)擊“產(chǎn)品列表”就會(huì)顯示到我的產(chǎn)品列表二級(jí)頁(yè)面。

其他頁(yè)面方法同上。

產(chǎn)品列表：將“產(chǎn)品列表”同 首頁(yè)進(jìn)行鏈接，然后預(yù)覽成 功！郵箱登陸：將“郵箱登陸”同 首頁(yè)進(jìn)行鏈接，然后預(yù)覽成 功！

聯(lián)系我們：將“聯(lián)系我們”同 首頁(yè)進(jìn)行鏈接，然后預(yù)覽成 功！

公司簡(jiǎn)介：將“公司簡(jiǎn)介”同 首頁(yè)進(jìn)行鏈接，然后預(yù)覽成 功！

5、層與行為的應(yīng)用

層在網(wǎng)頁(yè)中相當(dāng)于一張張的膠片，通常用來確定網(wǎng)絡(luò)元素在瀏覽器中 的起止位置層最重要的用途是動(dòng)態(tài)效果設(shè)計(jì)。層可以包括文本、圖 像、表格，甚至其他圖層

而且層對(duì)于制作網(wǎng)頁(yè)部分重疊更是有特殊的效果。步驟如下： 1）打開一個(gè)頁(yè)面，打開“修改”，“頁(yè)面屬性”，在頁(yè)面屬性中，選擇

“跟蹤圖像”。這個(gè)跟蹤圖像將作為“層”布局頁(yè)面的參照對(duì)象。

2)選擇“查看”----“標(biāo)尺”----“顯示，打開標(biāo)尺 ”

3)選擇“查看”----“網(wǎng)絡(luò)”----“顯示網(wǎng)絡(luò)”，4）在“網(wǎng)格設(shè)置”對(duì)話框中，選中“顯示網(wǎng)格”和“靠齊到網(wǎng)格”

5）為了防止層的重疊，需要打開“層”面板。選擇“窗口”，“層”，打開層面板。

6）在“層”面板中，選中“防止重疊”選項(xiàng)。6、使用 flash mx8 制作動(dòng)態(tài)文字

1）打開 flash 軟件，在里面建立 8 個(gè)圖層。并且準(zhǔn)備一副適合做標(biāo)示的圖片。

2）在圖層 1 上做 1 幀到 160 幀的普通幀、在圖層 2 上從第十幀開始

插入關(guān)鍵幀 25 幀結(jié)束，在第 10 幀上寫入“同”字，在 25 幀上寫 “心”字，再回到第 10 幀創(chuàng)建補(bǔ)間動(dòng)畫。在圖層 3 上創(chuàng)建幀從 25 幀到 40 幀結(jié)束在 25 幀上寫“協(xié)”字創(chuàng)建關(guān)鍵幀到 40 幀寫“力” 字，再返回到 25 幀創(chuàng)建補(bǔ)間動(dòng)畫。在圖層 4 上從 40 幀到 55 幀結(jié) 束在 40 幀上寫“共”創(chuàng)建關(guān)鍵幀到 55 幀寫“創(chuàng)”字，在圖層 7 上從第十幀開始插入關(guān)鍵幀 25 幀結(jié)束，在第 10 幀上寫入“輝” 字，在 25 幀上寫“煌”依次而下做到 160 幀。

3）幀做好后敲擊 enter 鍵就可以播放 flash 動(dòng)畫，如果想插入網(wǎng)頁(yè)就

按步驟走，文件—導(dǎo)出—導(dǎo)出影片，/最后點(diǎn)擊保存。

7、網(wǎng)頁(yè)特效設(shè)計(jì)

在這里我給自己的網(wǎng)頁(yè)設(shè)計(jì)的特效是 讓一行字體在來回跑動(dòng)方法如下：

1）選中你要設(shè)計(jì)特效的字體選擇工具欄上的標(biāo)“簽選擇器”，“html” 插入,關(guān)閉

2）然后預(yù)覽就會(huì)出現(xiàn)從右到左的字幕。8、控制多個(gè)影片的播放

制作的方法：

先看自己的影片里的幀長(zhǎng)度，比如說：第一個(gè)影片剪輯的時(shí)間軸長(zhǎng)是 20，那么你第 2 個(gè)影片剪輯就放在主場(chǎng)景的第 21 貞）第 2 個(gè)影片剪 輯就放在它的后一貞就可以了。無論幾個(gè)影片剪輯都是一樣的。9、制作動(dòng)態(tài)分隔條

網(wǎng)頁(yè)分隔線可以說是網(wǎng)頁(yè)中不可缺少的元素，它主要用于分隔網(wǎng)頁(yè)內(nèi) 容也可以用于裝飾網(wǎng)頁(yè)。在網(wǎng)頁(yè)中插入一個(gè)層，然后在層中插入一 個(gè)表格，設(shè)置表格的間距，然后在表格的單元格中插入圖片，設(shè)置 時(shí)間軸。調(diào)出時(shí)間軸，在時(shí)間軸必要的地方添加改變屬性行為，并 設(shè)置層對(duì)象的屬性添加行為和改變屬性。

五、結(jié)論

1、收獲

在新疆停網(wǎng)的狀態(tài)下，我們只用了一周實(shí)習(xí)時(shí)間。在這一周的實(shí)習(xí)里 我學(xué)到了很多也收獲了很多，在老師和同學(xué)的幫助下順利的完成了實(shí)習(xí)內(nèi)容。對(duì)前面的知識(shí)精心的進(jìn)行整理，把這一學(xué)期的知識(shí)作了復(fù)習(xí)和訓(xùn)練，更加牢固地掌握了學(xué)過的東西對(duì)

photoshop、fireworks、dreamweaver、flash 的應(yīng)運(yùn)更加熟練.在制作網(wǎng)站的過程中，我們參照老師給的惠爾公司網(wǎng)站圖片，盡可 能地想把我們自己的網(wǎng)站做的美觀、內(nèi)容豐富。網(wǎng)頁(yè)制作需要有很多 的色調(diào)搭配能力和很好的布局能力，再加上自己的風(fēng)格創(chuàng)新能力，才 能做出精美的網(wǎng)站。在這幾天的實(shí)習(xí)中，我學(xué)到無論作什么事都要有 細(xì)心有耐心。尤其是在新疆停網(wǎng)的狀態(tài)下，搜集不到素材，所以，在 網(wǎng)頁(yè)的制作上還是有一定的局限性。網(wǎng)站的布局上我也突出了自己的 特點(diǎn)。尤其是在制作 flash 的時(shí)候老師給予了很大及時(shí)的幫助，讓我 在制作的時(shí)候不至于給我?guī)砗艽舐闊?。同時(shí)，也希望我們能利用我們學(xué)習(xí)的知識(shí)技能更好的為學(xué)院，為同學(xué)們服務(wù)，也希望我們能夠互 相學(xué)習(xí)，互相取長(zhǎng)補(bǔ)短，使我們每個(gè)同學(xué)能夠更好的進(jìn)步。

2、不足

在實(shí)習(xí)中我發(fā)覺網(wǎng)站的制作過程中，1、自己腦袋里沒有裝東西（網(wǎng)站的綜合布局、網(wǎng)頁(yè)的構(gòu)思和編排）

甚至老師把作業(yè)布置下來自己還不知道該從那個(gè)地方著手很是茫 然。

2、自己的閱歷不夠，自己的網(wǎng)站應(yīng)該是一個(gè)怎樣的網(wǎng)站，里面要放

些啥內(nèi)容，該怎樣去組織這些內(nèi)容，心里沒底。

3、尤其是老師在前面教過的內(nèi)容自己沒有及時(shí)的練習(xí)和鞏固，以至

于在實(shí)習(xí)的時(shí)候自己的速度跟不上，做出來的 flash 和 gif 小動(dòng)畫 不令人滿意。4、不能熟練掌握工具，不了解好多工具的屬性和用途，導(dǎo)致好多圖

片都不能做出自己想要的效果。最重要的是在制作網(wǎng)頁(yè)的時(shí)候，色彩搭配特別重要，而我自己對(duì)顏色的搭配不是很了解，感覺做 出的東西老是顏色深的地方特別深，淡的地方特別淡，感覺不協(xié) 調(diào)。

5、新疆停網(wǎng)的原因，使我們?cè)谒夭牡乃鸭献兊煤鼙粍?dòng)，所以導(dǎo)致

做出的東西很簡(jiǎn)單，所以我覺得，知識(shí)應(yīng)用的全部全還要看準(zhǔn)備 是否充分。

6、在以后的學(xué)習(xí)中我會(huì)更加認(rèn)真地去學(xué)習(xí)，去掌握這些軟件的用法，便于在以后做東西的時(shí)候能更好地運(yùn)用。

六、致謝

在網(wǎng)頁(yè)實(shí)習(xí)結(jié)束的時(shí)候我要感謝辛勤的班主任老師，在這個(gè)學(xué)期代我 們的網(wǎng)頁(yè)設(shè)計(jì)以外還代了很多別的課，所以很辛苦，在上課期間和實(shí)習(xí)期 間同學(xué)在學(xué)習(xí)中遇到問題都耐心的為他們講解直到他們聽懂為止。正是在 老師的號(hào)召下我們對(duì)網(wǎng)頁(yè)設(shè)計(jì)的興趣也非常的濃厚，在實(shí)習(xí)中我發(fā)現(xiàn)很多 同學(xué)的網(wǎng)站做的很好很有特色，這都少不了老師的指導(dǎo)。在老師的帶領(lǐng)下 我們學(xué)到很多書本上學(xué)不到的東西，相信在以后找工作中我們會(huì)多了一個(gè) 籌碼。

其次，要感謝學(xué)校給我們安排了期末的課程實(shí)習(xí)，讓我們能在學(xué)期末 重新溫習(xí)和總結(jié)整個(gè)一學(xué)期以來學(xué)習(xí)的知識(shí)，并且總結(jié)自己的不足，在以 后的學(xué)習(xí)中能夠加以改正和補(bǔ)充。

最后，再次感謝學(xué)校和指導(dǎo)的老師！

網(wǎng)頁(yè)設(shè)計(jì)實(shí)訓(xùn)報(bào)告書篇三

實(shí)習(xí)目的：熟悉和掌握計(jì)算機(jī)網(wǎng)頁(yè)設(shè)計(jì)的基本技巧及網(wǎng)頁(yè)制作相關(guān)工具軟件等內(nèi)容。培養(yǎng)我們利用計(jì)算機(jī)進(jìn)行商務(wù)網(wǎng)頁(yè)設(shè)計(jì)的 基本思路和應(yīng)用開發(fā)能力，提高我們的計(jì)算機(jī)文化素質(zhì)。

網(wǎng)頁(yè)是世界上最有價(jià)值的不動(dòng)產(chǎn)之一。人們?cè)谶@個(gè)不足0.1平米的空間內(nèi)投資達(dá)數(shù)百萬美元。網(wǎng)頁(yè)對(duì)公司的影響比簡(jiǎn)單的電子商務(wù)增收方法大得多；網(wǎng)頁(yè)也是公司對(duì)外的臉面。web站點(diǎn)就像一棟房子，它的每一個(gè)窗口都可以看成一扇門，人們可以沿著搜索引擎其他web站點(diǎn)的鏈接，繞過主頁(yè)而進(jìn)入web的深層。

一．網(wǎng)站的整體規(guī)劃

1.討論網(wǎng)站主題：因?yàn)樽约簩?duì)普羅旺斯很感興趣，于是就想到要是一下為心中的仙境設(shè)計(jì)一個(gè)旅游網(wǎng)站。

2.定位網(wǎng)站ci形象：旅游網(wǎng)站最重要的就是是瀏覽者產(chǎn)生想去親身體驗(yàn)一下的共鳴。于是在網(wǎng)頁(yè)設(shè)計(jì)上面，根據(jù)普羅旺斯夢(mèng)幻般的意境，我采用的是清新雋永的ci形象。使瀏覽者有賓至如歸的感受。

3.確定欄目和板塊：

1]首先要考慮整個(gè)網(wǎng)頁(yè)的長(zhǎng)和寬，以及長(zhǎng)度和寬度之間的比例。

2]其次就應(yīng)該考慮導(dǎo)航條的設(shè)置了。

3]正文的框架設(shè)置（橫向因素和縱向因素交錯(cuò)）

在瀏覽了很多精美的旅游網(wǎng)站之后，再結(jié)合自己的想法，我先在草紙上畫出了大體的欄目和板塊。

4.網(wǎng)站的整體風(fēng)格和創(chuàng)意：建立一個(gè)浪漫的旅行網(wǎng)站，走映像派路線，目的務(wù)必使瀏覽者留下映像。

二．網(wǎng)頁(yè)制作的前期策劃與準(zhǔn)備

1.資料的搜集：由于個(gè)人的愛好，我很早以前就收集了許多普羅旺斯的美圖，這次就方便多了。接著就搜集了一些有夢(mèng)幻效果的網(wǎng)頁(yè)背景，fiash源代碼、小圖標(biāo)和一些gif的動(dòng)畫等。

2.熟悉制作工具軟件：

主頁(yè)制作的基本條件有：

硬件：

一臺(tái)電腦(64mb以上內(nèi)存，當(dāng)然越大越好啦)；可以撥號(hào)上網(wǎng)；如果你有條件的話,建議:配置掃描儀,這將大大方便圖像和文字的輸入;

軟件：

html編輯軟件：常用的有frontpage、hotdog等，本文重點(diǎn)介紹 dreamweaver；

圖像處理軟件：常用的有photoshop、flash、fireworks 等；

文件上傳軟件：常用的有cuteftp、wsftp等。

三．網(wǎng)頁(yè)制作

真的是萬事開頭難啊，遇到了很多問題，比如：插入的圖片不符合規(guī)格，一下子把其他內(nèi)容的框架擠開；插入的層太多，大一點(diǎn)的就把小一點(diǎn)的給覆蓋掉了；插入的flash不能產(chǎn)生效果?？傊畣栴}一籮筐。實(shí)踐出真知，原來自己還有那么多欠缺的知識(shí)。于是回歸本源，先把課本上的東西弄通再談其他。然后又到圖書管里借了幾本網(wǎng)頁(yè)制作方面的書籍來參考。

在對(duì)基本知識(shí)有了詳細(xì)的了解之后，做起東西來就得心應(yīng)手多了，知道引導(dǎo)頁(yè)能過加映像之后，我決定為我的網(wǎng)頁(yè)設(shè)計(jì)一個(gè)引導(dǎo)頁(yè)。

然后是主頁(yè)和二級(jí)頁(yè)面的設(shè)置。要注意,網(wǎng)上只能使用jpg和gif兩種圖象格式，其他諸如bmp和tif等很通用的格式都不能用在網(wǎng)上,因?yàn)樗鼈兲罅?但可以用圖象軟件進(jìn)行轉(zhuǎn)換，比如office 97的照片編輯器。把準(zhǔn)備在主頁(yè)上出現(xiàn)的圖象放進(jìn)相應(yīng)的目錄里后.在一步一步的邊學(xué)邊做的過程中，看著心中的東西一點(diǎn)一點(diǎn)的出來，真的很有成就感。雖然自己的網(wǎng)頁(yè)技術(shù)還差的遠(yuǎn)，但是回顧一下這周真的學(xué)到了很多的東西。

四．網(wǎng)頁(yè)的調(diào)試

之前把作過的東西放到u盤里，發(fā)生過圖片顯示不出來的狀況，還好即使找到了解救的方法，把源文件和web頁(yè)面放到一起這樣就算路徑改變的話也不會(huì)影響頁(yè)面的效果。

總結(jié)

【本文地址：http://www.aiweibaby.com/zuowen/1058736.html】