【文章內(nèi)容簡介】 .............................................................................................................1 實訓性質(zhì)、實訓地點、實習時間安排，適用專業(yè)班級...............................................................2 實訓一 站點的規(guī)劃設計..................................................................................................................3 實訓二 設計案例網(wǎng)站LOGO.........................................................................................................4 實訓三 設計案例網(wǎng)站BANNER...................................................................................................5 實訓四 設計案例網(wǎng)站導航條.........................................................................................................6 實訓五 設計案例網(wǎng)站網(wǎng)頁內(nèi)容和網(wǎng)頁版權(quán)聲明.........................................................................7 實訓六 對案例網(wǎng)站版面切圖.........................................................................................................8 實訓七 制作完成案例網(wǎng)站首頁.....................................................................................................9 實訓八 案例網(wǎng)站模板的制作.......................................................................................................10 實訓九 案例網(wǎng)頁超級鏈接的添加...............................................................................................11 實訓十 案例網(wǎng)站加入動態(tài)元素...................................................................................................12第2頁 《網(wǎng)頁設計與制作綜合實訓》實訓指導書實訓目的在前一階段，學生完成了《網(wǎng)頁設計與制作》、《圖形圖像處理》、《CSS設計》、等專業(yè)課程的學習，為了讓學生將前期的專業(yè)課程學以致用，融會貫通，特開設本系統(tǒng)化實訓。本次綜合實訓基于學生的興趣，選取專業(yè)建設網(wǎng)站開發(fā)為主題，基于網(wǎng)頁開發(fā)的流程，把實訓周期當做是一個項目的開發(fā)周期，嚴格把握項目進度，最終要求學生完成網(wǎng)站的前臺設計。通過本次實訓希望達到以下目的：； ； ； +DIV做網(wǎng)頁布局； 實訓內(nèi)容及要求本實訓的內(nèi)容簡述： （1）專業(yè)概況（2）專業(yè)建設規(guī)劃（3）展示最新動態(tài)文章標題（8條）（4）專業(yè)建設成效的文章標題（8項）（5）專業(yè)建設特色文章標題（8項）點擊項目概況，顯示相關文本 點擊項目申報書菜單，顯示flashpaper格式的申報書內(nèi)容 顯示專業(yè)建設特色的文章標題列表，點擊標題進入內(nèi)容 顯示專業(yè)建設動態(tài)的標題列表，點擊標題進入成果詳細展示 顯示專業(yè)建設成效的標題列表，點擊標題進入成果詳細展示。本實訓的要求：（div+css）技術完成至少4個頁面，其中必須包括網(wǎng)站主頁面設計、欄目頁設計、管理員管理登陸頁面、管理員登錄以后的頁面。：網(wǎng)頁視覺效果應采用Internet Explorer ，顯示分辨率以1024768狀態(tài)為準。第1頁 《網(wǎng)頁設計與制作綜合實訓》實訓指導書：網(wǎng)頁總量原則上不應超過10M，且必須要是不連接互聯(lián)網(wǎng)就可以進行展示的作品。：要求結(jié)構(gòu)清晰，文件有清晰的分類，比如圖片都放在images文件夾下等。、顏色搭配協(xié)調(diào)；，下學期或下一階段繼續(xù)完善、開發(fā)。實訓性質(zhì)、實訓地點、實習時間安排，適用專業(yè)班級該實訓為校內(nèi)模擬實訓。根據(jù)高等教育教學大綱規(guī)定和學院教學計劃安排及培養(yǎng)學生職業(yè)技能的要求，軟微班的學生于第一學期進行為期4周的校內(nèi)實訓，項目名稱為《網(wǎng)頁設計與制作綜合實訓》。實訓時間：20132014學年第一學期第1518周 實訓班級：軟件1301班、軟件1302班 實訓地點： 學校機房第2頁 《網(wǎng)頁設計與制作綜合實訓》實訓指導書實訓一 站點的規(guī)劃設計學時分配：6學時實訓目的（1）熟悉Dreamweaver軟件的界面布局和工作環(huán)境。（2）熟練掌握本地站點創(chuàng)建和管理的方法。實訓任務（1）創(chuàng)建一個靜態(tài)網(wǎng)站站點。（2）從網(wǎng)絡上收集網(wǎng)頁素材。（3）根據(jù)提供的網(wǎng)站策劃方案范本，結(jié)合自己要制作完成的網(wǎng)站，開始著手書寫網(wǎng)站策劃方案。實訓內(nèi)容（1）打開Dreamweaver 軟件，熟悉軟件的界面布局和工作面板的擺放，能夠熟練使用Dreamweaver 軟件。（2）在本機D盤上創(chuàng)建文件夾“home”，在“home”文件夾下根據(jù)網(wǎng)站的規(guī)劃設計，創(chuàng)建相關的文件夾，用來放置不同的文件。（3）在Dreamweaver 軟件中，將D盤 “home” 文件夾定義成靜態(tài)網(wǎng)站站點，站點名稱任意。實訓要求（1）由指導教師講清實訓的基本原理，要求，實訓目的。（2）實訓不分小組，要求每位同學均能獨立地完全相關實訓的設計與制作。（3）教學實訓除了驗證課程理論外，還要求學生掌握網(wǎng)絡資源的搜索與應用。（4）除了教師的指導外，還要著重培養(yǎng)學生自學的能力。第3頁 《網(wǎng)頁設計與制作綜合實訓》實訓指導書實訓二 設計案例網(wǎng)站LOGO學時分配：6學時實訓目的（1）熟悉Photoshop軟件的界面布局和工作環(huán)境。（2）熟練掌握網(wǎng)站LOGO的設計方法。（3）創(chuàng)建項目案例網(wǎng)站的LOGO。實訓任務（1）掌握Photoshop軟件文字工具工具的使用方法。（2）查看網(wǎng)絡上相關網(wǎng)站LOGO。（3）根據(jù)小組討論結(jié)果，實際動手完成網(wǎng)站的LOGO。實訓內(nèi)容（1）打開Photoshop軟件，熟悉軟件的界面布局和工作面板的擺放，能夠熟練使用Photoshop軟件。（2）新建Photoshop文件，大小為980*600像素，分辨率為72像素/英寸，顏色模式為RGB顏色8位，背景顏色為白色或者透明都可以。（3）使用文字工具，輸入MZD三個字母，設置文字屬性。（4）柵格化文字圖層，將柵格化后的圖層上的3個字母分別移動到不同的3個圖層上。（5）分別對3個字母進行藝術化處理。（6）輸入其他的文字。（7）為輸入的文字圖層設置“混合選項”。（8）保存文件。實訓要求（1）由指導教師講清實訓的基本原理，要求，實訓目的。（2）實訓不分小組，要求每位同學均能獨立地完全相關實訓的設計與制作。（3）教學實訓除了驗證課程理論外，還要求學生掌握網(wǎng)絡資源的搜索與應用。（4）除了教師的指導外，還要著重培養(yǎng)學生自學的能力。第4頁 《網(wǎng)頁設計與制作綜合實訓》實訓指導書實訓三 設計案例網(wǎng)站BANNER學時分配：6學時實訓目的（1）熟悉Photoshop軟件的使用方法。（2）熟練掌握網(wǎng)站BANNER的設計方法。（3）創(chuàng)建項目案例網(wǎng)站的BANNER。實訓任務（1）掌握Photoshop軟件漸變工具的使用方法。（2）查看網(wǎng)絡上相關網(wǎng)站BANNER。（3）根據(jù)小組討論結(jié)果，實際動手完成網(wǎng)站的BANNER。實訓內(nèi)容（1）打開Photoshop軟件，熟悉軟件的界面布局和工作面板的擺放，熟練使用Photoshop軟件。（2）打開上次保存好的Photoshop源文件，在上次完成的LOGO基礎上，準備開始制作本次的BANNER。（3）根據(jù)網(wǎng)站策劃方案里的主色調(diào)和主題的要求，開始設計網(wǎng)站的BANNER，首先去選擇一張適合的圖片。（4）使用矩形選框工具選擇要使用的圖片部分，圖片的其他部分刪除。（5）根據(jù)設計要求，在BANNER上添加其他元素，比如文字或者其他能夠表達網(wǎng)站主題的圖片。（6）使用魔術棒工具將要放置到BANNER上的圖片的某一部分扣出來，然后設置適合的大小，旋轉(zhuǎn)好方向后放好。（7）設置圖層的樣式，以及文字的混合選項等。（8）保存文件。實訓要求（1）由指導教師講清實訓的基本原理，要求，實訓目的。（2）實訓不分小組，要求每位同學均能獨立地完全相關實訓的設計與制作。（3）教學實訓除了驗證課程理論外，還要求學生掌握網(wǎng)絡資源的搜索與應用。（4）除了教師的指導外，還要著重培養(yǎng)學生自學的能力。第5頁 《網(wǎng)頁設計與制作綜合實訓》實訓指導書實訓四 設計案例網(wǎng)站導航條學時分配：6學時實訓目的（1）熟悉Photoshop軟件的使用方法。（2）熟練掌握網(wǎng)站導航條的設計方法。（3）創(chuàng)建項目案例網(wǎng)站的導航條。實訓任務（1）掌握Photoshop軟件圓角矩形工具的使用方法。（2）查看網(wǎng)絡上相關網(wǎng)站導航條。（3）根據(jù)小組討論結(jié)果，實際動手完成網(wǎng)站的導航條。實訓內(nèi)容（1）打開Photoshop軟件，熟悉軟件的界面布局和工作面板的擺放，熟練使用Photoshop軟件。（2）查看網(wǎng)上其它網(wǎng)站的導航條，了解導航條的基本情況。（3）打開上次保存好的Photoshop源文件，在上次完成的基礎上，準備開始制作本次的導航條。（4）根據(jù)網(wǎng)站策劃方案里的主色調(diào)和主題的要求，開始設計網(wǎng)站的導航條，首先去選擇一張適合的圖片。（5）使用圓角矩形工具繪制一個圓角矩形，顏色與大小要與整個網(wǎng)站的風格與主題相一致。（6）選中繪制好的圓角矩形，使用漸變工具，繪制立體感導航條背景。（7）輸入導航條文字，輸入導航條文字間的豎線間隔。（8）設置文字和豎線的混合選項，增加立體感。（9）保存文件。實訓要求（1）由指導教師講清實訓的基本原理，要求，實訓目的。（2）實訓