網(wǎng)頁(yè)設(shè)計(jì)與制作課程設(shè)計(jì)報(bào)告_第1頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)與制作課程設(shè)計(jì)報(bào)告_第2頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)與制作課程設(shè)計(jì)報(bào)告_第3頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)與制作課程設(shè)計(jì)報(bào)告_第4頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)與制作課程設(shè)計(jì)報(bào)告_第5頁(yè)
已閱讀5頁(yè),還剩11頁(yè)未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

1、精選優(yōu)質(zhì)文檔-傾情為你奉上學(xué)號(hào)2014-2015學(xué)年 第一學(xué)期*網(wǎng)頁(yè)設(shè)計(jì)與制作課程設(shè)計(jì)報(bào)告題目:維影影視公司網(wǎng)頁(yè)設(shè)計(jì)專(zhuān)業(yè):數(shù)字媒體技術(shù)班級(jí):12(1)班姓名:*指導(dǎo)教師:*成績(jī):計(jì)算機(jī)與信息工程系二0一四年六月二十日目 錄 專(zhuān)心-專(zhuān)注-專(zhuān)業(yè)1 設(shè)計(jì)內(nèi)容及要求1.1設(shè)計(jì)內(nèi)容維影影視網(wǎng)站主要根據(jù)課程設(shè)計(jì)要求進(jìn)行設(shè)計(jì),并了解了維影公司的基本情況,該網(wǎng)站主要包括六大模塊:1)導(dǎo)航欄模塊,主要有首頁(yè)、產(chǎn)品展示、新聞動(dòng)態(tài)、留言板、關(guān)于我們、聯(lián)系我們。2)新聞動(dòng)態(tài)模塊,最近的一些影視方面的信息。 3)產(chǎn)品分類(lèi)模塊,主要是些電影的類(lèi)型分類(lèi)。4)在線客服模塊,為來(lái)訪者提供一些我們公司的在線服務(wù)。5)公司簡(jiǎn)介模塊

2、,介紹公司的一些基本情況。6)熱銷(xiāo)產(chǎn)品模塊,向大家介紹一些我們公司的一些熱銷(xiāo)電影。 1.2設(shè)計(jì)任務(wù)及具體要求主要利用Photoshop和Dreamweaver進(jìn)行一個(gè)小型的影視公司網(wǎng)站開(kāi)發(fā),網(wǎng)站內(nèi)容涵蓋了維影影視公司的一些最基本情況,以及維影公司的最新電影出臺(tái)情況,并且提供一系列的人工在線服務(wù)為我們的來(lái)訪者解答這種問(wèn)題。 要求:明確課程設(shè)計(jì)的目的,能根據(jù)課程設(shè)計(jì)的要求,查閱相關(guān)文獻(xiàn),為完成設(shè)計(jì)準(zhǔn)備必要的知識(shí); 提高學(xué)生用Photoshop和Dreamweaver進(jìn)行程序設(shè)計(jì)的能力,重點(diǎn)提高用Dreamweaver進(jìn)行網(wǎng)頁(yè)制作技術(shù)水平;初步了解軟件開(kāi)發(fā)的一般方法和步驟; 提高撰寫(xiě)技術(shù)文檔的能力。

3、2 總體設(shè)計(jì)2.1該網(wǎng)站的功能簡(jiǎn)介該網(wǎng)站的主要功能是介紹維影公司的基本情況,并作為一個(gè)功能型的網(wǎng)站展示給我們大家,包括一些最新電影展示,最終目的還是為一些想做影視的公司提供一些服務(wù),宣傳自己。2.2 網(wǎng)站設(shè)計(jì)概括圖圖1 總體布局圖3設(shè)計(jì)過(guò)程3.1各個(gè)模塊的設(shè)計(jì)流程 1)主頁(yè)模塊設(shè)計(jì)該模塊主要是是展示我們網(wǎng)頁(yè)的基本框架,以及有什么基本功能,通過(guò)主頁(yè)我們可以很清晰的看到我們維影網(wǎng)站的整體布局,以及我們來(lái)訪者可以從我們網(wǎng)站上獲得什么相關(guān)的信息,一目了然看到我們是一個(gè)實(shí)力雄厚的大公司,從網(wǎng)站我們就可以看到該公司是一個(gè)結(jié)構(gòu)分明,管理有條不紊。 圖2 主頁(yè)模塊設(shè)計(jì)圖2)產(chǎn)品展示模塊設(shè)計(jì) 該模塊主要是展示維

4、影公司最近一段時(shí)間的所拍攝的電影,通過(guò)電影展示我們維影公司的影視實(shí)力。圖3 產(chǎn)品展示模塊設(shè)計(jì)圖3)留言板模塊設(shè)計(jì)該模塊主要為供我們來(lái)訪者提一些關(guān)于影視方面的意見(jiàn),以及他們對(duì)電影的看法,以及喜歡看什么類(lèi)型的電影,好讓我們公司通過(guò)這些寶貴意見(jiàn)做的更好,是項(xiàng)吸納民意的好辦法。圖4 旅游寶典模塊設(shè)計(jì)圖4)聯(lián)系我們模塊設(shè)計(jì)該模塊主要為將我們的地理坐標(biāo)告訴來(lái)訪者,如果有人愿意找我們公司做一些什么關(guān)于欄目包裝、宣傳片什么之類(lèi)的可以通過(guò)該地址找到我們公司。 圖5 聯(lián)系我們頁(yè)面設(shè)計(jì)圖5)在線客服模塊設(shè)計(jì)該模塊主要為來(lái)訪者提供一些在線服務(wù),為他們解答一些先關(guān)的疑難問(wèn)題,是我們?cè)诰€交流的必要手段,不管來(lái)訪者有什么問(wèn)

5、題,我們公司都可以一一解答,這是一個(gè)仁智的服務(wù)。圖6 旅游景點(diǎn)模塊設(shè)計(jì)圖3.2對(duì)關(guān)鍵代碼和效果處理加以分析說(shuō)明1)主頁(yè)部分設(shè)計(jì)代碼<html><head><title>wangye</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><style type="text/css">body,td,th font-size: 14px;color: #FFF;a:link

6、text-decoration: none;a:visited text-decoration: none;color: #003;a:hover text-decoration: none;a:active text-decoration: none;#_01 tr td strong a color: #FFF;</style></head><body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" ma

7、rginheight="0"><!- Save for Web Slices (wangye.psd) -><table width="1823" height="1258" border="0" align="center" cellpadding="0" cellspacing="0" id="_01"><tr><td colspan="28"><img

8、 src="images/index_01.jpg" width="1822" height="114" alt=""></td><td width="1"><img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="1" height="114" alt=""></td></tr>

9、;<tr><td width="447" rowspan="25"><img src="images/index_02.jpg" alt="" width="447" height="1143" usemap="#Map5" border="0"></td><td colspan="3" rowspan="2"><a href=&q

10、uot;index.html"><img src="images/index_03.jpg" width="57" height="35" alt=""></a></td><td colspan="2" rowspan="5"><img src="images/index_04.jpg" width="37" height="379" alt=&q

11、uot;"></td><td colspan="3" rowspan="2"><a href="cpzs.html"><img src="images/index_05.jpg" width="58" height="35" alt=""></a></td><td colspan="2" rowspan="5"><

12、;img src="images/index_06.jpg" width="30" height="379" alt=""></td><td colspan="2"><a href="xwdt.html"><img src="images/index_07.jpg" width="65" height="27" alt=""></a>

13、;</td><td width="22" rowspan="6"><img src="images/index_08.jpg" width="22" height="381" alt=""></td><td width="69"><a href="lyb.html"><img src="images/index_09.jpg" width=

14、"69" height="27" alt=""></a></td><td width="27" rowspan="6"><img src="images/index_10.jpg" width="27" height="381" alt=""></td><td colspan="2" rowspan="2"

15、><a href="gywm.html"><img src="images/index_11.jpg" width="63" height="35" alt=""></a></td><td width="15" rowspan="6"><img src="images/index_12.jpg" width="15" height="3

16、81" alt=""></td><td width="71" rowspan="2"><a href="lxwm.html"><img src="images/index_13.jpg" width="71" height="35" alt=""></a></td><td colspan="8" rowspan="

17、3"><img src="images/index_14.jpg" width="861" height="339" alt=""></td><td><img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="1" height="27" alt=""></td></tr><

18、;tr><td colspan="2" rowspan="5"><img src="images/index_15.jpg" width="65" height="354" alt=""></td><td rowspan="5"><img src="images/index_16.jpg" width="69" height="354"

19、alt=""></td><td><img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="1" height="8" alt=""></td></tr>4設(shè)計(jì)結(jié)果與分析在進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)與制作的過(guò)程中,并不是一帆風(fēng)順的,總會(huì)遇到很多在想象不到的錯(cuò)誤。1.首先在ps里進(jìn)行設(shè)計(jì)時(shí)要事先想好各個(gè)模塊該怎么擺放,怎么設(shè)置,整個(gè)頁(yè)面是否傾斜等都應(yīng)考慮,否則在Dreamwe

20、aver里會(huì)帶來(lái)很多的麻煩。2.要為每個(gè)頁(yè)面添加居中操作。3.應(yīng)先把所有頁(yè)面在ps里設(shè)計(jì)好,再導(dǎo)入到Dreamweaver里進(jìn)行代碼設(shè)計(jì),否則會(huì)為后來(lái)增加更多的工作量。4.修改頁(yè)面的背景顏色,可以在修改-頁(yè)面屬性進(jìn)行設(shè)置。5.在對(duì)頁(yè)面添加鏈接時(shí),切記要使用鏈接的相對(duì)地址,否則會(huì)使網(wǎng)站傳送到服務(wù)器端將無(wú)法顯示的問(wèn)題。6.最好將所有網(wǎng)頁(yè)中使用到的圖片放置在同一個(gè)文件夾下,這樣便于后期查錯(cuò)的管理和修改。7. 在使用ps導(dǎo)出為web格式時(shí),要事先將各個(gè)模塊切割好,便于到Dreamweaver里進(jìn)行代碼設(shè)計(jì)。8.設(shè)計(jì)好后要對(duì)整個(gè)網(wǎng)站進(jìn)行調(diào)試與測(cè)試。5 小 結(jié)隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展和日益更新,網(wǎng)絡(luò)為人們的生活帶來(lái)了各種各樣的便利,人們足不出戶便可以買(mǎi)到自己想要的東西,看自己想看的視頻,瀏覽各種各樣的新聞,這一切都?xì)w功于互聯(lián)網(wǎng),但是僅僅有互聯(lián)網(wǎng)是遠(yuǎn)遠(yuǎn)不夠的,如果只有互聯(lián)網(wǎng)人們并不能獲得自己想要的東西,所以網(wǎng)站作為互聯(lián)網(wǎng)中的一個(gè)關(guān)鍵節(jié)點(diǎn)起著至關(guān)重要的作用,通過(guò)各種網(wǎng)站人們才能找到自己想要的東西,而網(wǎng)頁(yè)作為網(wǎng)站的內(nèi)容與載體更是起到了不可小覷的作用。一個(gè)網(wǎng)站的網(wǎng)頁(yè)制作的是否精美,是否符合網(wǎng)站主題,關(guān)系到客戶的直接感受,關(guān)系到人們是否愿意訪問(wèn)并停留在這個(gè)頁(yè)面,最終的是關(guān)系到網(wǎng)站最后的整體收益,當(dāng)

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

最新文檔

評(píng)論

0/150

提交評(píng)論