動(dòng)態(tài)網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)綜合性設(shè)計(jì)性實(shí)驗(yàn)報(bào)告

本科學(xué)生設(shè)計(jì)性實(shí)驗(yàn)報(bào)告實(shí)驗(yàn)項(xiàng)目名稱＿＿動(dòng)態(tài)網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)

學(xué)生實(shí)驗(yàn)報(bào)告學(xué)生姓名學(xué)號(hào)0088225實(shí)驗(yàn)項(xiàng)目動(dòng)態(tài)網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)■必修□選修□演示性實(shí)驗(yàn)□驗(yàn)證性實(shí)驗(yàn)□操作性實(shí)驗(yàn)■設(shè)計(jì)性實(shí)驗(yàn)實(shí)驗(yàn)地點(diǎn)薈蘆樓110實(shí)驗(yàn)儀器臺(tái)號(hào)32指導(dǎo)教師實(shí)驗(yàn)日期及節(jié)次2010-12-17一、實(shí)驗(yàn)綜述（1）實(shí)驗(yàn)?zāi)康模和ㄟ^一個(gè)個(gè)人網(wǎng)站或商業(yè)網(wǎng)站的制作，使學(xué)生對(duì)之前學(xué)到的HTML、Dreamweaver、PhotoShop、Fireworks、Flash等知識(shí)進(jìn)一步鞏固加強(qiáng)；掌握網(wǎng)站的設(shè)計(jì)、開發(fā)、架設(shè)等知識(shí)。（2）實(shí)驗(yàn)要求：以小組的方式完成整個(gè)網(wǎng)站的設(shè)計(jì)，四人一組。小組需討論網(wǎng)站的選題、內(nèi)容以及頁面的規(guī)劃，然后給每個(gè)成員分配相應(yīng)的工作。每個(gè)小組成員以個(gè)人獨(dú)立完成的方式其工作。網(wǎng)站應(yīng)不少于10個(gè)頁面，兩個(gè)以上的Flash動(dòng)畫，頁面中要清晰的寫出網(wǎng)頁的制作人。（3）實(shí)驗(yàn)報(bào)告中應(yīng)體現(xiàn)小組對(duì)網(wǎng)站設(shè)計(jì)的思路以及規(guī)劃方案；另外實(shí)驗(yàn)報(bào)告中也要詳細(xì)介紹小組成員每個(gè)人的工作。提交實(shí)驗(yàn)報(bào)告時(shí)要附帶完成的網(wǎng)站的打包文件。2、實(shí)驗(yàn)儀器、設(shè)備或軟件計(jì)算機(jī)，Dreamweaver，Photoshop，F(xiàn)ireworks，F(xiàn)lash，IIS等軟件。實(shí)驗(yàn)過程（實(shí)驗(yàn)步驟、記錄、數(shù)據(jù)、分析）Step1.設(shè)計(jì)網(wǎng)站主題和名稱。這次設(shè)計(jì)的網(wǎng)站是獅子之家的網(wǎng)站，主題是希望我們的友誼地久天長(zhǎng)，希望大家都能實(shí)現(xiàn)自己的夢(mèng)想走向幸福之路。因?yàn)槲覀兯膫€(gè)來自不同的學(xué)校，不同的地方，巧合的相遇，巧合的在一個(gè)班，巧合的在一個(gè)寢室，最最巧合的是我們都是獅子座，為了紀(jì)念我們之間的友情，所以做了設(shè)定了這個(gè)主題。網(wǎng)站板塊設(shè)計(jì)以及菜單目錄的設(shè)計(jì)圍繞于此，主要是生活中由我們四個(gè)構(gòu)成的這個(gè)集體獅子之家。，從我們的主頁-->我們的印記-->留言星星河-->leo's萬花筒。如圖所示：Step2.設(shè)計(jì)網(wǎng)站的Logo，因?yàn)槭且杂颜x夢(mèng)想為主題，所以選擇的是簡(jiǎn)單的英文表示，設(shè)置了下字體。簡(jiǎn)單明了，更容易讓瀏覽者記住。如圖所示：Step3.設(shè)計(jì)網(wǎng)站的框架。上下的結(jié)構(gòu)。菜單+對(duì)應(yīng)的內(nèi)容。如圖所示：獅子之家，夢(mèng)想樂園獅子之家，夢(mèng)想樂園我們的首頁我們的印記留言板LEO'S萬花筒我們的首頁我們的印記留言板LEO'S萬花筒陳貝貝羅玉龍尚麗娟丁雪輝陳貝貝羅玉龍尚麗娟丁雪輝Step4.確定網(wǎng)站的主體顏色。因?yàn)槭怯颜x所以主要頁面的主色基調(diào)是白色，表示純潔，友誼至上。因?yàn)槲覀冊(cè)趬?mèng)想的路上，所以主頁面以藍(lán)色為主，Step5.建立站點(diǎn)。Step6.根據(jù)目錄結(jié)構(gòu)設(shè)計(jì)與制作獅子之家，夢(mèng)想樂園的網(wǎng)站的主頁網(wǎng)頁及其子頁面。為了條理化，開始規(guī)定了每個(gè)人做的頁面的圖片等元素文件夾名稱，如圖：=1\*GB3①主頁面index.html,使用了背景音樂，flash,CSS樣式以及字幕圖片滾動(dòng)來增加網(wǎng)站的美感與動(dòng)感。

如下圖所細(xì)節(jié)圖：使網(wǎng)站更加美觀和多元化，使用了一些媒體元素和特效：插入了音樂<embedsrc="music/NorahJones-NewYorkCity.mp3"hidden="true"></embed>；插入flash導(dǎo)航，使用<objectclassid="c"codebase="/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"width="837"height="312">

<paramname="movie"value="flash/flash.swf">

<paramname="quality"value="high">

<embedsrc="flash/flash.swf"quality="high"pluginspage="/go/getflashplayer"type="application/x-shockwave-flash"width="837"height="312"></embed></object>使用文字特效和圖片滾動(dòng)。利用的<MARQUEEbehavior=“value”bgcolor=“color”direction=“value”height=“value”width=“value”

loop=“value”scrollamount=“value”scrolldelay=“value”hspace=“value”vspace=“value”>滾動(dòng)文字</MARQUEE>。=2\*GB3②利用flash,Css樣式，背景音樂等元素，做成的子頁面如下：【關(guān)于我們】的子頁面【留言板】子頁面【Leoes'萬花筒】的子頁面獅子之家成員【陳貝貝】子頁面1信息簡(jiǎn)介獅子之家成員【陳貝貝】子頁面2印記獅子之家成員【陳貝貝】子頁面3日志文章獅子之家成員【陳貝貝】子頁面獅子之家成員【陳貝貝】子頁面獅子之家成員【陳貝貝】子頁面獅子之家成員【羅玉龍】子頁面獅子之家成員【羅玉龍】子頁面獅子之家成員【羅玉龍】子頁面獅子之家成員【尚麗娟】子頁面獅子之家成員【丁雪輝】子頁面Step7.將頁面超鏈接起來后發(fā)布。三、結(jié)論1.實(shí)驗(yàn)結(jié)果服務(wù)器與客戶端的IIS的Windows系統(tǒng)組件安裝=1\*GB3①WindowsXP默認(rèn)安裝時(shí)不安裝IIS組件，需要手工添加安裝。進(jìn)入控制面板，找到“添加／刪除程序”，打開后選擇“添加／刪除Windows組件”，在彈出的“Windows組件向?qū)А贝翱谥?，將“Internet信息服務(wù)（IIS）”項(xiàng)選中。在該選項(xiàng)前的“√”背景色是灰色的，這是因?yàn)閃indowsXP默認(rèn)并不安裝FTP服務(wù)組件。再點(diǎn)擊右下角的“詳細(xì)信息”，在彈出的“Internet信息服務(wù)（IIS）”窗口中，找到“文件傳輸協(xié)議（FTP）服務(wù)”，選中后確定即可。安裝完后需要重啟。WindowsNT／2000和WindowsXP的安裝方法相同。詳情如圖所示：=2\*GB3②出現(xiàn)如下圖組件安裝向?qū)?，選擇“Intnetnet信息服務(wù)（IIS）”，單擊“下一步”開始安裝，單擊“完成”結(jié)束。安裝IIS后，配置DNS以及WEB站點(diǎn)，發(fā)布網(wǎng)站，我們是獅子之家，所以我們?nèi)〉玫挠蛎?，效果如下：主頁面發(fā)布后的效果子頁面發(fā)布效果，作者陳貝貝，羅玉龍子頁面留言板發(fā)布效果，作者陳貝貝，尚麗娟子頁面萬花筒發(fā)布效果，作者陳貝貝，丁雪輝子頁面成員信息發(fā)布效果，作者陳貝貝子頁面成員信息發(fā)布效果，作者陳貝貝子頁面成員信息發(fā)布效果，作者羅玉龍子頁面成員信息發(fā)布效果，作者尚麗娟子頁面成員信息發(fā)布效果，作者丁雪輝分析與討論1．這應(yīng)該是個(gè)很值得大家注意的問題，也就是說，在全屏狀態(tài)下瀏覽網(wǎng)頁內(nèi)容時(shí)，一點(diǎn)問題也沒有。當(dāng)我們使用窗口的最小化命令或手動(dòng)的調(diào)整窗口的大小時(shí)，問題就慢慢出現(xiàn)了。網(wǎng)頁內(nèi)容會(huì)把當(dāng)前窗口作為顯示范圍，依次下挫。舉個(gè)例子，和在記事本中有“自動(dòng)換行”和“沒換行”的差別是完全一樣的。

解決這個(gè)問題，我們必須從網(wǎng)頁的布局說起，一般情況下，網(wǎng)頁內(nèi)容的定位大多是通過表格來實(shí)現(xiàn)的。因此問題的“毛病”也就出在表格上。

你可能已經(jīng)注意到了，在表格的高寬設(shè)定選擇上提供了兩種不同的類型，百分比和像素。其中百分比的使用將會(huì)產(chǎn)生前面說到的那個(gè)毛病，將其全部更正為Pixels單位的實(shí)際大小就可以了。2．在微軟的網(wǎng)頁工具-Frontpage中，有關(guān)于背景音樂的設(shè)置功能，那么DW顯然沒有作到這點(diǎn)，因此要使用的話，只能在源代碼中手動(dòng)添加了。在使用前，注意一點(diǎn)，使用背景音樂一定要注意網(wǎng)頁文件的大小，不能顧此失彼。代碼如下：<EMBEDsrc=“music.MP3”autostart=“true”loop=“2”width=“80”height=“30”>其中src指定音樂文件的位置，autostart為音樂文件上傳后的動(dòng)作，true表示自動(dòng)開始播放，false不播放（默認(rèn)值）。3.整個(gè)頁面的設(shè)計(jì)最主要的莫過于主題的確定。以及頁面結(jié)構(gòu)的構(gòu)思。在這方面，也只能說把自己的興趣帶到作業(yè)中來，和往常的作業(yè)一樣，主題是自己喜歡的風(fēng)格以及主題。4.在整個(gè)dreamweaver設(shè)計(jì)中，最大的問題就是層上面。擺放的時(shí)候，要時(shí)刻要求自己精確，不然很容易無法顯現(xiàn)效果。壓邊的時(shí)候最需要重視。以及行為的設(shè)定，要警惕。不要混淆。一開始的時(shí)候，弄反了不少的行為，使得頁面顯示的不是預(yù)想的效果。重新做了很多次，才算圓滿完成。5.在外加自己需要的效果時(shí)，有的是難以達(dá)到的。譬如插入的flash底色透明和插入音樂；不得不說，在這上面，沒有frontpage來得簡(jiǎn)單。只有自己在代碼欄中鍵入相應(yīng)的代碼。方可顯示想要的結(jié)果?！?】使之透明：<paramname="wmode"value="transparent"/>…………wmode="transparent">【2】背景音樂：<BGSOUNDsrc="歌曲路徑"loop="-1">6.在使用框架集的時(shí)候?？梢栽诰W(wǎng)頁的屬性，點(diǎn)擊框架，設(shè)置其屬性，比如框架的透明或者框架的顏色。在使用表格的時(shí)候一定要把border的屬性改成0，使表格變成透明。在放入音樂和圖片的時(shí)候一定選好路徑，不然在制作好的網(wǎng)頁在別人的電腦上flash，音樂后者圖片不能夠播放，可能是路徑的原因。在試驗(yàn)的時(shí)候電腦上的分辨率是1280*720，大多數(shù)電腦是1024的分辨率，可能在瀏覽器上會(huì)有一定的偏差。7.實(shí)驗(yàn)開始前就要先建立一個(gè)根文件夾，在實(shí)驗(yàn)的過程中把主頁存放在自己建的文件夾里面，這樣才能使實(shí)驗(yàn)條理化，不至于在實(shí)驗(yàn)后找不到自己的主頁。在實(shí)驗(yàn)過程中會(huì)出現(xiàn)一些選項(xiàng)，計(jì)算機(jī)一般會(huì)有一些默認(rèn)的選擇，最后不要去更改，如果更改的話要充分了解清楚該選項(xiàng)的含義，以及它會(huì)造成的效果，否則會(huì)使實(shí)驗(yàn)的結(jié)果失真，實(shí)驗(yàn)前先熟悉好操作軟件是做好該實(shí)驗(yàn)的關(guān)鍵。這次大家分工合作一起討論主題確定主要色調(diào)，一起不僅僅運(yùn)用了學(xué)習(xí)到的知識(shí)，更體會(huì)到團(tuán)隊(duì)合作的意義。感謝老師給予這次機(jī)會(huì)，讓我們更好的成長(zhǎng)。四、指導(dǎo)教師評(píng)語及成績(jī)：成績(jī)：指導(dǎo)教師簽名：批閱日期：基于C8051F單片機(jī)直流電動(dòng)機(jī)反饋控制系統(tǒng)的設(shè)計(jì)與研究基于單片機(jī)的嵌入式Web服務(wù)器的研究MOTOROLA單片機(jī)MC68HC（8）05PV8/A內(nèi)嵌EEPROM的工藝和制程方法及對(duì)良率的影響研究基于模糊控制的電阻釬焊單片機(jī)溫度控制系統(tǒng)的研制基于MCS-51系列單片機(jī)的通用控制模塊的研究基于單片機(jī)實(shí)現(xiàn)的供暖系統(tǒng)最佳啟停自校正（STR）調(diào)節(jié)器單片機(jī)控制的二級(jí)倒立擺系統(tǒng)的研究基于增強(qiáng)型51系列單片機(jī)的TCP/IP協(xié)議棧的實(shí)現(xiàn)基于單片機(jī)的蓄電池自動(dòng)監(jiān)測(cè)系統(tǒng)基于32位嵌入式單片機(jī)系統(tǒng)的圖像采集與處理技術(shù)的研究基于單片機(jī)的作物營養(yǎng)診斷專家系統(tǒng)的研究基于單片機(jī)的交流伺服電機(jī)運(yùn)動(dòng)控制系統(tǒng)研究與開發(fā)基于單片機(jī)的泵管內(nèi)壁硬度測(cè)試儀的研制基于單片機(jī)的自動(dòng)找平控制系統(tǒng)研究基于C8051F040單片機(jī)的嵌入式系統(tǒng)開發(fā)基于單片機(jī)的液壓動(dòng)力系統(tǒng)狀態(tài)監(jiān)測(cè)儀開發(fā)模糊Smith智能控制方法的研究及其單片機(jī)實(shí)現(xiàn)一種基于單片機(jī)的軸快流CO〈,2〉激光器的手持控制面板的研制基于雙單片機(jī)沖床數(shù)控系統(tǒng)的研究基于CYGNAL單片機(jī)的在線間歇式濁度儀的研制基于單片機(jī)的噴油泵試驗(yàn)臺(tái)控制器的研制基于單片機(jī)的軟起動(dòng)器的研究和設(shè)計(jì)基于單片機(jī)控制的高速快走絲電火花線切割機(jī)床短循環(huán)走絲方式研究基于單片機(jī)的機(jī)電產(chǎn)品控制系統(tǒng)開發(fā)基于PIC單片機(jī)的智能手機(jī)充電器基于單片機(jī)的實(shí)時(shí)內(nèi)核設(shè)計(jì)及其應(yīng)用研究基于單片機(jī)的遠(yuǎn)程抄表系統(tǒng)的設(shè)計(jì)與研究基于單片機(jī)的煙氣二氧化硫濃度檢測(cè)儀的研制基于微型光譜儀的單片機(jī)系統(tǒng)單片機(jī)系統(tǒng)軟件構(gòu)件開發(fā)的技術(shù)研究基于單片機(jī)的液體點(diǎn)滴速度自動(dòng)檢測(cè)儀的研制基于單片機(jī)系統(tǒng)的多功能溫度測(cè)量?jī)x的研制基于PIC單片機(jī)的電能采集終端的設(shè)計(jì)和應(yīng)用基于單片機(jī)的光纖光柵解調(diào)儀的研制氣壓式線性摩擦焊機(jī)單片機(jī)控制系統(tǒng)的研制基于單片機(jī)的數(shù)字磁通門傳感器基于單片機(jī)的旋轉(zhuǎn)變壓器-數(shù)字轉(zhuǎn)換器的研究基于單片機(jī)的光纖Bragg光柵解調(diào)系統(tǒng)的研究單片機(jī)控制的便攜式多功能乳腺治療儀的研制基于C8051F020單片機(jī)的多生理信號(hào)檢測(cè)儀基于單片機(jī)的電機(jī)運(yùn)動(dòng)控制系統(tǒng)設(shè)計(jì)Pico專用單片機(jī)核的可測(cè)性設(shè)計(jì)研究基于MCS-51單片機(jī)的熱量計(jì)基于雙單片機(jī)的智能遙測(cè)微型氣象站MCS-51單片機(jī)構(gòu)建機(jī)器人的實(shí)踐研究基于單片機(jī)的輪軌力檢測(cè)基于單片機(jī)的GPS定位儀的研究與實(shí)現(xiàn)基于單片機(jī)的電液伺服控制系統(tǒng)用于單片機(jī)系統(tǒng)的MMC卡文件系統(tǒng)研制基于單片機(jī)的時(shí)控和計(jì)數(shù)系統(tǒng)性能優(yōu)化的研究基于單片機(jī)和CPLD的粗光柵位移測(cè)量系統(tǒng)研究單片機(jī)控制的后備式方波UPS提升高職學(xué)生單片機(jī)應(yīng)用能力的探究基于單片機(jī)控制的自動(dòng)低頻減載裝置研究基于單片機(jī)控制的水下焊接電源的研究基于單片機(jī)的多通道數(shù)據(jù)采集系統(tǒng)基于uPSD3234單片機(jī)的氚表面污染測(cè)量?jī)x的研制基于單片機(jī)的紅外測(cè)油儀的研究96系列單片機(jī)仿真器研究與設(shè)計(jì)基于單片機(jī)的單晶金剛石刀具刃磨設(shè)備的數(shù)控改造基于單片機(jī)的溫度智能控制系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)基于MSP430單片機(jī)的電梯門機(jī)控制器的研制基于單片機(jī)的氣體測(cè)漏儀的研究基于三菱M16C/6N系列單片機(jī)的CAN/USB協(xié)議轉(zhuǎn)換器基于單片機(jī)和DSP的變壓器油色譜在線監(jiān)測(cè)技術(shù)研究基于單片機(jī)的膛壁溫度報(bào)警系統(tǒng)設(shè)計(jì)基于AVR單片機(jī)的低壓無功補(bǔ)償控制器的設(shè)計(jì)基于單片機(jī)船舶電力推進(jìn)電機(jī)監(jiān)測(cè)系統(tǒng)基于單片機(jī)網(wǎng)絡(luò)的振動(dòng)信號(hào)的采集系統(tǒng)基于單片機(jī)的大容量數(shù)據(jù)存儲(chǔ)技術(shù)的應(yīng)用研究基于單片機(jī)的疊圖機(jī)研究與教學(xué)方法實(shí)踐基于單片機(jī)嵌入式Web服務(wù)器技術(shù)的研究及實(shí)現(xiàn)基于AT89S52單片機(jī)的通用數(shù)據(jù)采集系統(tǒng)基于單片機(jī)的多道脈沖幅度分析儀研究機(jī)器人旋轉(zhuǎn)電弧傳感角焊縫跟蹤單片機(jī)控制系統(tǒng)基于單片機(jī)的控制系統(tǒng)在PLC虛擬教學(xué)實(shí)驗(yàn)中的應(yīng)用研究基于單片機(jī)系統(tǒng)的網(wǎng)絡(luò)通信研究與應(yīng)用基于PIC16F877單片機(jī)的莫爾斯碼自動(dòng)譯碼系統(tǒng)設(shè)計(jì)與研究基于單片機(jī)的模糊控制器在工業(yè)電阻爐上的應(yīng)用研究基于雙單片機(jī)沖床數(shù)控系統(tǒng)的研究與開發(fā)基于Cygnal單片機(jī)的μC/OS-Ⅱ的研究基于單片機(jī)的一體化智能差示掃描量熱儀系統(tǒng)研究基于TCP/IP協(xié)議的單片機(jī)與Internet互聯(lián)的研究與實(shí)現(xiàn)變頻調(diào)速液壓電梯單片機(jī)控制器的研究基于單片機(jī)γ-免疫計(jì)數(shù)器自動(dòng)換樣功能的研究與實(shí)現(xiàn)基于單片機(jī)的倒立擺控制系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)單片機(jī)嵌入式以太網(wǎng)防盜報(bào)警系統(tǒng)基于51單片機(jī)的嵌入式Internet系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)單片機(jī)監(jiān)測(cè)系統(tǒng)在擠壓機(jī)上的應(yīng)用MSP430單片機(jī)在智能水表系統(tǒng)上的研究與應(yīng)用基于單片機(jī)的嵌入式系統(tǒng)中TCP/IP協(xié)議棧的實(shí)現(xiàn)與應(yīng)用單片機(jī)在高樓恒壓供水系統(tǒng)中的應(yīng)用基于ATmega16單片機(jī)的流量控制器的開發(fā)基于MSP430單片機(jī)的遠(yuǎn)程抄表系統(tǒng)及智能網(wǎng)絡(luò)水表的設(shè)計(jì)基于MSP430單片機(jī)具有數(shù)據(jù)存儲(chǔ)與回放功能的嵌入式電子血壓計(jì)的設(shè)計(jì)基于單片機(jī)的氨分解率檢