網(wǎng)頁(yè)設(shè)計(jì)與制作個(gè)人實(shí)訓(xùn)報(bào)告

1、一、實(shí)訓(xùn)目的：通過(guò)實(shí)訓(xùn)，掌握網(wǎng)頁(yè)制作系列軟件Dreamweaver、Fireworks、Flash和Photoshop的使用方法。達(dá)到全面理解、運(yùn)用網(wǎng)頁(yè)制作的知識(shí)，并使之得以融會(huì)貫通，在掌握理論的基礎(chǔ)上再加以實(shí)踐，進(jìn)一步提高、加強(qiáng)設(shè)計(jì)、制作網(wǎng)站的綜合能力。二、 實(shí)訓(xùn)過(guò)程1.資料的搜集：收集的資料主要是汽車圖片，以及運(yùn)用做頁(yè)面局部框架背景的圖片。2.熟悉制作軟件軟件： 軟件：Dreamweaver Firework Photoshop CS Flash 硬件： PC機(jī) 技術(shù)： HTMLCSS javascript特效代碼項(xiàng)目設(shè)計(jì)及運(yùn)行平臺(tái) ：Windows XP3.構(gòu)建站點(diǎn)框架：網(wǎng)站結(jié)構(gòu)圖如下：

2、Logo以及廣告寶駒網(wǎng)簡(jiǎn)介以及聯(lián)系方式說(shuō)明溫馨提示以及天氣實(shí)況查詢地圖留言板版權(quán)聲明4設(shè)計(jì)制作頁(yè)面： 網(wǎng)頁(yè)名稱:關(guān)于我們 網(wǎng)頁(yè)的色彩：最主要是以白色背景為主導(dǎo)色，字體的主要色彩是黑色。鏈接字體顏色鏈接前設(shè)為藍(lán)灰色，鼠標(biāo)覆蓋后為深紅色。 網(wǎng)頁(yè)富有動(dòng)感，通過(guò)GIF動(dòng)畫來(lái)展示，頁(yè)面的色彩好與首頁(yè)和欄目頁(yè)統(tǒng)一主要采取白色。 頁(yè)面的大小，在1024X768像素下顯示效果最佳。 顏色調(diào)配設(shè)計(jì)，網(wǎng)頁(yè)的色彩是樹立網(wǎng)站形象的關(guān)鍵之一，各版塊采用與網(wǎng)站首頁(yè)同一色系的顏色，整個(gè)版塊內(nèi)部也盡量保持風(fēng)格一致。網(wǎng)頁(yè)內(nèi)容的安排相互鏈接關(guān)系 如下概述最上面先放了一個(gè)724*100px的logo. 右邊放了一個(gè)1024*100

3、廣告如下圖：再下來(lái)的表格中里放了一個(gè)我們用GIF的輪換效果展示知名品牌汽車，效果如圖：右側(cè)是世界/中國(guó)地圖及天氣實(shí)況查詢圖。屬特效代碼。當(dāng)鼠標(biāo)覆蓋時(shí)顯示鏈接提示，點(diǎn)擊即可查詢各地當(dāng)日天氣情況，幫助駕車人員快速掌握天氣情況。效果如下：然后再表格里面分別放的是各種小版塊。分別記載有:QQ聯(lián)系方式，用戶只要單擊即可打開QQ聊天窗口與網(wǎng)站內(nèi)部人員進(jìn)行對(duì)話。此外，頁(yè)面載有客服熱線，留言板。也是對(duì)用戶提供的對(duì)話平臺(tái)，方便用戶咨詢更多消息。 5實(shí)現(xiàn)網(wǎng)頁(yè)間的鏈接：運(yùn)用的鏈接方式有：超鏈接、明鏈圖片鏈接, 錨點(diǎn)鏈接以及多媒體鏈接, 用以實(shí)現(xiàn)QQ聊天界面的打開，留言提交，以及天氣實(shí)況的顯示。6整體效果圖：三、實(shí)訓(xùn)心得與體會(huì)：在這次實(shí)訓(xùn)之后，我們對(duì)網(wǎng)站的設(shè)計(jì)與制作有了進(jìn)一步的了解，我對(duì)flash的制作，圖片的處理，表單的制作，css樣式，模版的應(yīng)用等技術(shù)有了更深層次的了解，并且能夠很好的應(yīng)用它們。在網(wǎng)站的制作過(guò)程中，我碰到了不少的問(wèn)題，但是通過(guò)老師的耐心指導(dǎo)以及與隊(duì)友的協(xié)商，這些問(wèn)題最終都得到了較為完美的解決。所以我認(rèn)為，團(tuán)隊(duì)的力量是強(qiáng)大的！而一個(gè)人的力量和想法是有限的，唯有集思廣益，才能使得我們的