《網(wǎng)絡(luò)設(shè)計(jì)與開發(fā)》實(shí)驗(yàn)指導(dǎo)書

1、網(wǎng)絡(luò)設(shè)計(jì)與開發(fā)實(shí)驗(yàn)指導(dǎo)書 東北大學(xué)秦皇島分校經(jīng)濟(jì)管理系二零零三年八月目 錄實(shí)驗(yàn)一 搜索引擎的使用實(shí)驗(yàn)二 使用記事本編寫一個(gè)簡(jiǎn)單的HTML文檔實(shí)驗(yàn)三 使用Frontpage和Dreamwaver等工具軟件制作網(wǎng)站實(shí)驗(yàn)四 利用Photoshop處理圖像實(shí)驗(yàn)五 網(wǎng)站建設(shè)綜合實(shí)驗(yàn)實(shí)驗(yàn)一搜索引擎的使用實(shí)驗(yàn)?zāi)康耐ㄟ^使用瀏覽器提高同學(xué)們對(duì)目前廣為應(yīng)用的幾種搜索引擎的使用，使同學(xué)們掌握如何從網(wǎng)絡(luò)中查找自己所需資料的能力。實(shí)驗(yàn)設(shè)備與軟件需求可上互聯(lián)網(wǎng)PC機(jī)一臺(tái)，安裝有Windows操作系統(tǒng)，使用IE瀏覽器。實(shí)驗(yàn)內(nèi)容及步驟打開計(jì)算機(jī)使用IE上網(wǎng)。在地址欄當(dāng)中鍵入搜索引擎的地址，如 HYPERLINK ，見圖1-1

2、。在搜索欄中鍵入“網(wǎng)頁(yè)制作”后按google搜索，搜索結(jié)果會(huì)如圖1-2。圖1-1 HYPERLINK 的頁(yè)面大家發(fā)現(xiàn)滿足條件的網(wǎng)頁(yè)可能太多，我們可以使用高級(jí)搜索來進(jìn)行更加細(xì)化的搜索。圖1-2搜索“網(wǎng)頁(yè)制作”圖1-3使用高級(jí)搜索5、在高級(jí)搜索中鍵入HTML，我們將可以搜索到一些與網(wǎng)頁(yè)設(shè)計(jì)中HTML文檔制作相關(guān)的一些網(wǎng)站。注意事項(xiàng)1、高級(jí)搜索的正確使用。2、如何判斷是否為所要查找的網(wǎng)頁(yè)制作的相關(guān)資料。預(yù)習(xí)要求熟練使用瀏覽器。選擇幾個(gè)搜索引擎。實(shí)驗(yàn)二 HYPERLINK /department/xxx/syzds/SYZDS_WY2.HTM 使用記事本編寫一個(gè)HTML文檔實(shí)驗(yàn)?zāi)康耐ㄟ^使用記事本編寫一

3、個(gè)簡(jiǎn)單的HTML文檔使同學(xué)們對(duì)HTML文檔有一個(gè)初步的了解，初步掌握一個(gè)最簡(jiǎn)單的HTML文檔所應(yīng)該包含的內(nèi)容。實(shí)驗(yàn)設(shè)備與軟件需求PC機(jī)一臺(tái)，安裝有Windows操作系統(tǒng)，使用IE瀏覽器。實(shí)驗(yàn)內(nèi)容文檔使用Windows操作系統(tǒng)自帶的記事本程序編寫。要求窗體標(biāo)題為“Welcome to NCWRC” 使用*HTML文檔由head和body兩部分組成 使用*和* 用瀏覽器閱讀時(shí)要看見4段文字，每段文字的size分別是8、6、4、2 使用* 其中要求每段文字的顏色不同，分別為#00ffff、#882299、#ff0088、#55ccaa 使用* 每段文字要求居中排列 使用*編寫完成后用HTML為文件擴(kuò)

4、展名存盤，存在桌面上就可。使用瀏覽器瀏覽我們用記事本編寫的HTML文檔結(jié)果應(yīng)該如圖2-1。注意事項(xiàng)HTML文檔應(yīng)該以開頭，以結(jié)尾。記事本存盤時(shí)應(yīng)注意存盤的方式。預(yù)習(xí)要求對(duì)HTML文檔的基本構(gòu)成要有一個(gè)全面的了解。可閱讀簡(jiǎn)單的HTML文檔。圖2-1瀏覽html文檔實(shí)驗(yàn)三 HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM 使用Frontpage和Dreamwaver等軟件制作網(wǎng)站實(shí)驗(yàn)?zāi)康氖褂?HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM Frontpage和Dreamwaver等工具軟件制作網(wǎng)站，練習(xí)工具軟件的

5、使用。熟練掌握網(wǎng)頁(yè)制作的一個(gè)工具來制作網(wǎng)站。實(shí)驗(yàn)設(shè)備與軟件需求PC機(jī)一臺(tái)，安裝有Windows操作系統(tǒng)， HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM Frontpage和Dreamwaver等工具軟件。實(shí)驗(yàn)內(nèi)容自己設(shè)計(jì)一個(gè)的網(wǎng)站，畫出系統(tǒng)結(jié)構(gòu)圖及流程圖。根據(jù)自己設(shè)計(jì)的網(wǎng)站，使用Frontpage和Dreamwaver等工具軟件，來完成。瀏覽、測(cè)試并發(fā)布自己制作的網(wǎng)站。注意事項(xiàng)一定要注意網(wǎng)頁(yè)的名稱，不要使用漢字。發(fā)布出現(xiàn)問題，要自習(xí)檢查。預(yù)習(xí)要求設(shè)計(jì)出自己的網(wǎng)站。參考相關(guān)的網(wǎng)頁(yè)制作工具書。實(shí)驗(yàn)四 HYPERLINK /department/xxx/

6、syzds/SYZDS_WY0.HTM 利用Photoshop處理圖像實(shí)驗(yàn)?zāi)康耐ㄟ^ HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM 利用Photoshop來處理圖像，了解圖形圖像處理的一般過程，并會(huì)簡(jiǎn)單的圖形圖像處理。實(shí)驗(yàn)設(shè)備與軟件需求PC機(jī)一臺(tái)，安裝有Windows操作系統(tǒng)和 HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM Photoshop圖像處理軟件。實(shí)驗(yàn)內(nèi)容搜集一些圖片，也可以 HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM Photoshop的相關(guān)實(shí)例中

7、獲得。啟動(dòng)Photoshop 6.0，單擊，指向程序，指向Adobe，然后再單擊Photoshopshop6.0就啟動(dòng)Photoshopshop6.0了。Photoshop6.0的桌面環(huán)境打開后的Photoshop6.0的界面環(huán)境如圖4-1所示。圖4-1 Photoshop6.0的界面環(huán)境文件的建立和存取。單擊，單擊，彈出如圖4-2所示對(duì)話框。輸入文件名，Photoshop6.0的缺省文件名是Untitled-1，也可以再保存文件時(shí)再鍵入文件名。設(shè)置文件的寬度、高度，單位可以為象素、厘米、英寸、點(diǎn)、派卡。文件的分辨率。分辨率越搞，圖像越精細(xì)，同時(shí)文件也越大。圖4-2 新建文件設(shè)置色彩模式。單擊

8、右邊的下拉黑三角符號(hào)，出現(xiàn)列表如圖4-3所示RGB、CMYK、Lab、灰度、位圖模式可以選擇。文檔背景區(qū)域有三個(gè)選項(xiàng)，可以選擇白色、背景色、透明色。單擊按鈕，完成新文件的創(chuàng)建。圖4-3設(shè)置色彩模式打開圖像。單擊，單擊，彈出如圖4-4所示對(duì)話框。單擊搜尋列表，找到文件所在磁盤和文件目錄。單擊要打開的文件名，或者在輸入文件名。單擊，即可打開所需的文件。也可在第三步直接雙擊也能打開文件。圖4-4 打開圖像對(duì)話框當(dāng)處理完一幅圖像，如何保存起來呢？就像保存任何文件一樣，只需將圖像改為你想要當(dāng)格式即可。單擊，單擊，如果文件已經(jīng)命名或是編輯原有的文件，則系統(tǒng)直接保存。否則彈出如圖4-5所示對(duì)話框。圖4-5

9、保存圖像在下的列表中找到對(duì)應(yīng)的文件夾，在鍵入文件名。在下拉列表中找到相應(yīng)的圖像格式。單擊，圖像即被保存在相應(yīng)的目錄下。 具體的可參考相關(guān)的Photoshop書籍和資料，自己學(xué)習(xí)和練習(xí)，掌握Photoshop圖像處理的基礎(chǔ)知識(shí)。預(yù)習(xí)要求參考Photoshop6.0的圖書。注意隨時(shí)存盤。實(shí)驗(yàn)五 網(wǎng)站建設(shè)綜合實(shí)驗(yàn)實(shí)驗(yàn)?zāi)康耐ㄟ^本次實(shí)驗(yàn)，學(xué)生應(yīng)具有規(guī)劃、設(shè)計(jì)電子商務(wù)網(wǎng)站的能力；掌握至少一門開發(fā)網(wǎng)站的技術(shù)；掌握學(xué)習(xí)工具軟件的方法。實(shí)驗(yàn)設(shè)備與軟件需求PC機(jī)一臺(tái)，安裝有Windows操作系統(tǒng)，IIS，JSP的開發(fā)和發(fā)布的環(huán)境（J2DK,TOMCAT），網(wǎng)頁(yè)制作工具Dreamweaver、Frontpage。實(shí)驗(yàn)內(nèi)容自己選擇一個(gè)網(wǎng)站題目，規(guī)劃出系統(tǒng)開發(fā)報(bào)告，寫出詳細(xì)的設(shè)計(jì)文檔。根據(jù)自己的設(shè)計(jì)方案，進(jìn)行開發(fā)網(wǎng)站，開發(fā)出前臺(tái)，設(shè)計(jì)后臺(tái)數(shù)據(jù)庫(kù)、表，開發(fā)出的網(wǎng)站具有交互式的功能，例如注冊(cè)系統(tǒng)、聊天室、BBS論壇等等。開