1、河南XXXX學(xué)院信息技術(shù)系畢業(yè)設(shè)計(jì)任務(wù)書名稱:動(dòng)態(tài)網(wǎng)頁(yè)制作(ASP) 專業(yè): 信 息 應(yīng) 用 技 術(shù) 姓名: X X X 學(xué)號(hào):0 9 4 2 4 x x x指導(dǎo)老師:X X X小組其他成員姓名:_2012年4月（一）本設(shè)計(jì)的依據(jù)和意義（包括本畢業(yè)設(shè)計(jì)的必要性、可行性、國(guó)內(nèi)外同類設(shè)計(jì)產(chǎn)品現(xiàn)狀、發(fā)展趨勢(shì)、已到達(dá)的水平以及存在的問(wèn)題和本設(shè)計(jì)的特點(diǎn)）：網(wǎng)絡(luò)在中國(guó)的發(fā)展是非常迅猛的，隨著信息網(wǎng)絡(luò)技術(shù)的應(yīng)用，我們每一個(gè)人都感應(yīng)到了網(wǎng)絡(luò)給我們的工作、學(xué)習(xí)、生活等許多方面都帶來(lái)了更多的方便、快捷，對(duì)于人性化的詮釋達(dá)到了淋漓盡致，企業(yè)的經(jīng)營(yíng)觀念、個(gè)人的生活觀念都在發(fā)生著根本的變化。目前許多政府機(jī)關(guān)、學(xué)校、企事

2、業(yè)單位已建立自己的網(wǎng)站。為了宣傳自己和傳遞信息，建設(shè)自己部門的網(wǎng)站已經(jīng)是迫切需要。因此，需要通過(guò)一個(gè)有著界面友好，視覺(jué)效果美觀，方便易用的網(wǎng)站來(lái)宣傳網(wǎng)頁(yè)，方便他人了解查閱。通過(guò)網(wǎng)站，全面宣傳，展示網(wǎng)頁(yè)的風(fēng)采與特色，給用戶提供需要的內(nèi)容、而且還應(yīng)該做更多的事情、完成比頁(yè)面瀏覽更高層次的需求，例如收集信息，數(shù)據(jù)存儲(chǔ),數(shù)據(jù)修改以及數(shù)據(jù)刪除等。(二)設(shè)計(jì)內(nèi)容及目標(biāo)(包括要實(shí)現(xiàn)的主要功能,采用的主要開(kāi)發(fā)工具,開(kāi)發(fā)方法或者開(kāi)發(fā)模型)實(shí)現(xiàn)的主要功能:1、 用戶注冊(cè)及用戶登錄。 2、 主頁(yè)的瀏覽。3、 管理員用戶登錄及管理用戶（的添加、修改、刪除）。4、 數(shù)據(jù)庫(kù)的建立及ASP與數(shù)據(jù)庫(kù)的連接。5、 其次是IIS

3、服務(wù)器的安裝及設(shè)置。設(shè)計(jì)內(nèi)容：1、討論網(wǎng)站主題：建立一個(gè)關(guān)于個(gè)人學(xué)生的網(wǎng)站，其中有關(guān)于大學(xué)生就業(yè)、動(dòng)態(tài)、健身、學(xué)習(xí)等。2、定位網(wǎng)站CI形象：網(wǎng)站最重要的就是與瀏覽者產(chǎn)生共鳴。于是在網(wǎng)頁(yè)設(shè)計(jì)上面，要淡到瀏覽者最關(guān)心的話題。3、材料收集，網(wǎng)上搜一些網(wǎng)頁(yè)背景，F(xiàn)IASH源代碼、小圖標(biāo)和一些gif的動(dòng)畫等。4、確定欄目和板塊：首先要考慮整個(gè)網(wǎng)頁(yè)的長(zhǎng)和寬，以及長(zhǎng)度和寬度之間的比例。本次設(shè)計(jì)中網(wǎng)頁(yè)寬1024像素，長(zhǎng)由每個(gè)部分的內(nèi)容不同而設(shè)置。表格三行一列，居中設(shè)置，第一行放頭圖片，第二行是導(dǎo)航欄，第三行主頁(yè)內(nèi)容，第四行放置版權(quán)和地址等內(nèi)容。其次就應(yīng)該考慮導(dǎo)航條的設(shè)置了。導(dǎo)航欄的設(shè)置既是在上面第二行出插入一

4、個(gè)一行十三列的表格，內(nèi)容包括首頁(yè)、動(dòng)態(tài)、健身、文章欣賞等。正文的框架設(shè)置（橫向因素和縱向因素交錯(cuò)）在瀏覽了很多精美網(wǎng)站之后，再結(jié)合自己的想法，先在草紙上畫出了大體的欄目和板塊。5、網(wǎng)站的整體風(fēng)格和創(chuàng)意：建立一個(gè)清新、樸素的網(wǎng)站，目的是使瀏覽者留下映像。采取的主要工具：Dreamweaver、 Photoshop、Flash、Fireworks等。(三)實(shí)現(xiàn)本設(shè)計(jì)已具備的條件(說(shuō)明已具備的軟硬件設(shè)備,包括計(jì)算機(jī)和軟件相關(guān)技術(shù)資料)硬件：計(jì)算機(jī)軟件：Dreamweaver MX 2004、Photoshop CS3、Flash CS3、Fireworks CS3，使用IIS瀏覽網(wǎng)頁(yè)效果。技術(shù)資料：

5、使用Dreamweaver MX 2004編寫ASP VBScript動(dòng)態(tài)網(wǎng)站，來(lái)確定網(wǎng)頁(yè)的布局、欄目和板塊，編寫后臺(tái)管理的一系列的代碼，后面有相關(guān)的代碼介紹。Photoshop CS3用來(lái)制作及修改圖片，通常與FireworksCS3、Flash CS3結(jié)合使用，F(xiàn)ireworksCS3只要是用來(lái)制作gif格式的動(dòng)畫，而Flash CS3完成動(dòng)畫更完美一些。在編寫網(wǎng)頁(yè)時(shí)通常用到JavaScript腳本和VBScript腳本，是為了網(wǎng)頁(yè)的美觀或要實(shí)現(xiàn)某種特殊功能，編寫代碼時(shí)可也采用記事本，然后在網(wǎng)頁(yè)代碼相應(yīng)的位置插入。(四)應(yīng)用范圍和前景(采用設(shè)計(jì)產(chǎn)品后能給用戶帶來(lái)的直接效益以及可預(yù)見(jiàn)的發(fā)展前

6、景)前景是可觀的，隨著網(wǎng)絡(luò)的發(fā)展，網(wǎng)頁(yè)也迅速發(fā)展， 可以這樣說(shuō)：“能上網(wǎng)的地方就有網(wǎng)頁(yè)的存在”。我們的生活已完全離不開(kāi)網(wǎng)絡(luò)了，而網(wǎng)頁(yè)與網(wǎng)絡(luò)分不開(kāi)，不管是企業(yè)網(wǎng)還是個(gè)人網(wǎng)。第一、網(wǎng)頁(yè)節(jié)省了資源，制作成本低、速度快、更改靈活。第二、網(wǎng)上宣傳可以避免浪費(fèi)自己或他人時(shí)間，更加方便、而且覆蓋面積廣。 應(yīng)用范圍可以說(shuō)是全球性的，它包括生活的方方面面，如：購(gòu)物網(wǎng)、學(xué)術(shù)方面、太極拳網(wǎng)站、教育網(wǎng)、食品方面等等。網(wǎng)頁(yè)也給我們企業(yè)、個(gè)人帶來(lái)了可觀的效益，一、節(jié)省了成本（最主要的是宣傳方面）。二、可以使更多的人通過(guò)網(wǎng)站觀看到自己的產(chǎn)品。三、網(wǎng)絡(luò)的即時(shí)性傳輸可以使產(chǎn)品在最短的時(shí)間內(nèi)傳遍全球。從而帶來(lái)各方面的效益、收入。

7、 (五)計(jì)劃進(jìn)度:(請(qǐng)?jiān)敿?xì)列出開(kāi)發(fā)工作的規(guī)劃步驟和計(jì)劃分配的時(shí)間)規(guī)劃步驟及時(shí)間分配第一周：【】設(shè)計(jì)前的素材收集：網(wǎng)上搜一些網(wǎng)頁(yè)背景，F(xiàn)IASH源代碼、小圖標(biāo)和一些gif格式的動(dòng)畫等?！尽渴醉?yè)的確定欄目和板塊：首先要考慮整個(gè)網(wǎng)頁(yè)的長(zhǎng)和寬，以及長(zhǎng)度和寬度之間的比例。其次就應(yīng)該考慮導(dǎo)航條的設(shè)置了。正文的框架設(shè)置（橫向因素和縱向因素交錯(cuò)）第二周第三周：【】數(shù)據(jù)庫(kù)與ASP連接及注冊(cè)賬戶、登錄賬戶、管理員模塊組建、及各模塊的編寫代碼?！尽扛鱾€(gè)網(wǎng)頁(yè)的連接，分為文字連接、圖片鏈接。第四周：對(duì)網(wǎng)站進(jìn)行測(cè)試、修改，瀏覽并查看是否達(dá)到預(yù)期的效果，在這里使用IIS服務(wù)器。在使用前先要安裝它。(六)設(shè)計(jì)產(chǎn)品(最后所提

8、交的軟件或者源代碼及相應(yīng)開(kāi)發(fā)文檔，可附頁(yè))一、設(shè)計(jì)網(wǎng)站內(nèi)容1、用戶的登錄：僅接受指定信息的用戶登錄，確保數(shù)據(jù)安全性。2、用戶注冊(cè)：是為用戶提供進(jìn)入系統(tǒng)，從而瀏覽網(wǎng)站所提供的資源。3、管理員管理：對(duì)已注冊(cè)的用戶管理，其中可也對(duì)用戶的修改、刪除添加。登錄方法在地址欄中輸入http:/localhost:8081/wangyeshiji/admin，即進(jìn)入管理員登陸界面輸入密碼賬戶，賬戶是admin、密碼是123。4、網(wǎng)站信息管理管理用戶用戶注冊(cè)用戶登錄登錄到主頁(yè)管理員登錄登錄主頁(yè)用戶的刪除用戶的修改用戶的添加主頁(yè)樣式二、 網(wǎng)頁(yè)用戶管理與數(shù)據(jù)庫(kù)的鏈接主要代碼；1、 數(shù)據(jù)庫(kù)的創(chuàng)建（使用Access）：

9、 在數(shù)據(jù)庫(kù)中，需建立兩個(gè)表用戶信息表和管理員信息表。用戶信息表名為link，字段名包括id、name、mima1、等。用戶管理表名師admin，有兩個(gè)字段及admin、passwrod。2、用戶登錄界面：代碼如下：用戶登錄 會(huì)員登陸 用戶名： 密碼： 3、用戶注冊(cè)界面，它與登錄所呈現(xiàn)界面的代碼相似： 將所填信息記錄到數(shù)據(jù)庫(kù)，需與數(shù)據(jù)庫(kù)建立鏈接代碼如下：%如果上面的信息全了，就添加記錄，否則給出錯(cuò)誤信息If Request.Form(name1) And Request.Form(mima1) And Request.Form(dianhua) Then 以下連上數(shù)據(jù)庫(kù)，建立一個(gè)Connecti

10、on對(duì)象示例db Dim db Set db=Server.CreateObject(ADODB.Connection) db.Open Dbq= & Server.MapPath(./data/www_link) & ;Driver=Microsoft Access Driver (*.mdb); 以下添加記錄Dim strSql,varname1,varmima1,vardianhuavarname1=Request.form(name1)varmima1=Request.form(mima1)vardianhua=Request.Form(dianhua)strSql=Insert In

11、to link(name1,mima1,dianhua) Values( & varname1 & , & varmima1 & , & vardianhua & ) db.Execute(strSql)Response.Redirect ./index1.aspElse Response.Write 請(qǐng)將所有信息填寫完整，Response.Write 重新添加end if%然而，登錄信息與注冊(cè)所需的代碼就不同了：Conn.asp文件的內(nèi)容：%dim name1,mima1name1=replace(trim(request(name1),)mima1=replace(trim(request

12、(mima1),)if name1= or mima1= thenresponse.Write 對(duì)不起，登陸失敗，請(qǐng)檢查您的登陸名和密碼response.endend ifset rs=server.CreateObject(adodb.recordset)rs.Open select * from link where name1=&name1& and mima1=&mima1& ,conn,1,1if not(rs.bof and rs.eof) thenrs(super)=1if mima1=rs(mima1) thensession(name1)=trim(rs(name1)sess

13、ion.Timeout=200rs.Closeset rs=nothingresponse.Redirect ./index1.aspelsesession(name1)=response.write alert(對(duì)不起，登陸失?。?;history.go(-1);end ifelseresponse.write alert(對(duì)不起，登陸失??！);history.go(-1);end if%三、 管理員管理，包括登錄、添加、刪除、修改。 1、管理員的登錄與上面所介紹的用戶登錄類似，只將所連接的表名和字段名改為admin、password即可。2、管理用戶界面： 代碼如下：利用Select語(yǔ)句查

14、詢記錄示例 用戶查詢管理 添加標(biāo)記 用戶名 密碼 電話 刪除 修改 a href=delete.asp?id=刪除a href=update_form.asp?id=修改 3、 用戶的刪除代碼：用戶的刪除操作步驟既是在用戶查詢管理界面中單擊相應(yīng)用戶后面的刪除連接。4、 用戶修改代碼：進(jìn)入修改用戶信息界面即在用戶查詢管理界面中單擊修改連接。利用Update語(yǔ)句修改記錄示例 修改網(wǎng)站 用戶名input type=text name=name1 size=40 value= 密碼input type=password name=mima1 size=40 value= 電話 input name=d

15、ianhua type=text size=40 value= 修改完之后單擊確定既是將信息保存的數(shù)據(jù)庫(kù)，需要與數(shù)據(jù)庫(kù)的鏈接，代碼如下。%Dim varlink_idvarlink_id=Session(id)If Request.Form(name1) and Request.Form(mima1) And Request.Form(dianhua) Then Dim dbSet db=Server.CreateObject(ADODB.Connection)db.Open Dbq=&Server.MapPath(./data/www_link.mdb)&;Driver=Microsoft Access Driver (*.mdb);Dim varname1,varmima1,vardianhua,strSqlvarname1=Request.Form(name1)varmima1=Request.Form(mima1)vardianhua=Request.Form(dianhua)strSql=Update link Set name1= & varname1 & ,mima1= & varmima1 & ,dianhua= & vardianhua & Where id= &