電子商務(wù)網(wǎng)站設(shè)計報告

1、 設(shè)計報告一、設(shè)計目標(biāo)：通過電子商務(wù)設(shè)計的學(xué)習(xí)，學(xué)會用dreamweaver等軟件來對一個進行系統(tǒng)的設(shè)計，從理論知識的掌握，轉(zhuǎn)向操作技能的提高，進而提高個人總體計算機網(wǎng)絡(luò)水平的提高。二、理論知識的準(zhǔn)備：1.為了滿足爺面制作的目標(biāo)，應(yīng)該注意哪些問題？A網(wǎng)頁結(jié)構(gòu) 網(wǎng)頁結(jié)構(gòu)要清晰，易于導(dǎo)航，思路和脈絡(luò)要符合訪問者的想法?？刹扇〉拇胧┯校翰捎每蚣芙Y(jié)構(gòu)表現(xiàn)主題，索影和正文；網(wǎng)頁的大小一般控制在50KB以；在網(wǎng)頁的尾部放上聯(lián)系方式，如E-MAIL，以方便訪問者能建立聯(lián)系，反饋必要的信息 B頁面容 一般情況下，網(wǎng)頁都要以容為主，不必過分的追求復(fù)雜的表現(xiàn)形式，但必須寫好簡介，要有特色，避免太空，泛泛而談。頁面

2、本身要簡單，結(jié)構(gòu)復(fù)雜的網(wǎng)頁不僅要花費很多的精力，而且由于超連接復(fù)雜，讓瀏覽者閱讀時也感覺困難C文字 在以容為主的前提下，應(yīng)當(dāng)盡量把形式與容結(jié)合起來。既不要把頁面弄的花哨，也不呀只講容完全不講究文字和圖片的安排，要容易閱讀。要注意：網(wǎng)頁的標(biāo)題要簡潔，明確，能反映整個文檔的容；在文本敘述部分使用水平線分割不同的部分；對重點的文章和段落要使用強調(diào)字體表達D圖形 設(shè)計好圖形并合理使用能給網(wǎng)頁增色。網(wǎng)頁中插入的圖形盡量要小，網(wǎng)頁中圖形要附加文字說明，使人在圖形出來之前了解相關(guān)容；不要為圖形加太長的交互文本，也不要把所有的超連接放在圖上；控制頁面中的圖的數(shù)量，不要濫用圖象GIF2. 設(shè)計的過程中，最中要的

3、一個原則是什么？為什么？最重要的原則是創(chuàng)意。雖然的主要目的是傳送給人們它的信息，但在傳遞信息的同時還把他的文化傳遞給獲取信息的這些人。軟件的掌握是短期就能速成的，而且新的軟件成出不窮，功能越來越強大，但是使用這些軟件必須要有良好的設(shè)計概念才能創(chuàng)造優(yōu)秀的，這是制作的核心。的制作是按一定的步驟進行的，不同的設(shè)計著對有不同的見解和看法，但是有個共同觀點：僅會輸入文本，制作超級連接，排列圖片不是真正意義上的網(wǎng)頁制作，因為網(wǎng)頁制作最重要的一個原則是創(chuàng)意。3.動態(tài)網(wǎng)頁的工作原理動態(tài)網(wǎng)頁是與靜態(tài)網(wǎng)頁相對應(yīng)的，也就是說，網(wǎng)頁 URL的后綴是.htm、.html、.shtml、.xml等靜態(tài)網(wǎng)頁的常見形動態(tài)網(wǎng)頁

4、制作專家式，而是以.aspx.asp、.jsp、.php、.perl、.cgi等形式為后綴，并且在動態(tài)網(wǎng)頁網(wǎng)址中有一個標(biāo)志性的符號“?”。動態(tài)網(wǎng)頁的工作原理與靜態(tài)網(wǎng)頁比較類似，但是在服務(wù)器端有很大差別。服務(wù)器端接到客戶端發(fā)出的請求后，首先會找到所要瀏覽的動態(tài)網(wǎng)頁文件，然后解釋執(zhí)行其中的程序代碼，將含有程序代碼的動態(tài)網(wǎng)頁轉(zhuǎn)化為標(biāo)準(zhǔn)的靜態(tài)網(wǎng)頁，然后將靜態(tài)網(wǎng)頁發(fā)送給客戶端。三、軟硬件需求準(zhǔn)備（1）計算機一臺（2）Dreamweaver開發(fā)工具和運行環(huán)境（3）此網(wǎng)頁用360安全瀏覽器進行預(yù)覽（4）圖形處理工具，如photoshop。四、總體分析與設(shè)計1.介紹1.1主題：柔軟時光小店 暖手寶1.2風(fēng)格：

5、粉色溫暖1.3頁面結(jié)構(gòu)以與相關(guān)功能簡介 本網(wǎng)頁提供者消費者相比同類品種較多的暖手寶選擇。消費者能在我們上查看新品，熱賣和超值特賣等各種為消費者量身打造的寶貝。 本的設(shè)計結(jié)構(gòu)包括導(dǎo)航欄、Globallink模塊、left模塊、main模塊、tips模塊等。 具體設(shè)計：導(dǎo)航欄模塊展示我們的店名Globallink模塊：主要是為了消費者能在各類商品之間進行切換Left模塊：提供者消費者一個登錄界面和各種不同用途、風(fēng)格、價位的寶貝的選擇Main模塊：根據(jù)具體需要設(shè)計不同的界面2.大概設(shè)計綱要：1.首頁2.店鋪介紹給消費者一些我們店鋪的基本介紹3.新品上市把新品全部展示出來供消費者選擇4熱賣商品展示熱賣

6、中的商品5超值特賣給消費者提供一些性價比高的產(chǎn)品6.買家評價展示給消費者所有其他買家對我們的評價，更具有真實性，另外提供一個供消費者與我們溝通和提出意見的平臺。主要代碼有7.聯(lián)系我們提供給消費者我們的聯(lián)系方式，以便于更好的溝通和提供客戶更優(yōu)質(zhì)的服務(wù)。代碼設(shè)計： 親,你可以24小時聯(lián)系我們的客服哦，我們會隨時為您解答您想知道的我們店鋪和產(chǎn)品相關(guān)的問題哦。 我們的客服是： 您還可以訪問我們的留言店長空間 回答很簡單的問題就能訪問哦。 8.CSS部分設(shè)計：本站CSS部分的設(shè)計主要作用：利用相應(yīng)代碼來組織各模塊之間的布局。提供一個整體上比較美觀的網(wǎng)頁設(shè)計。省去主頁中藥用代碼寫入才能改變的復(fù)雜工作。主要

7、代碼：（1）margin主要用于控制模塊之間的間距 （2）padding主要用于模塊部元素的漂移（3）background用來控制模塊的背景（4）border主要控制塊的邊緣和圖片等的邊框（5）font-family控制字體（6）#主要用于CSS中，用來找到網(wǎng)頁模塊的位置，從而進行控制9. . Microsoft Access數(shù)據(jù)庫的建立。9.1依次選擇菜單命令開始程序Microsoft Access就可以啟動Access2003,點擊“文件”在下拉菜單中選擇“新建”，選擇“空數(shù)據(jù)庫”，指定后保存路徑后出現(xiàn)如下所示對話框：9.2實用設(shè)計器創(chuàng)建表選項，出現(xiàn)下圖所示對話框：說明:（1）字段名稱可以

8、用中文，也可以用字母、數(shù)字和下劃線，命名規(guī)則和變量類似，考慮系統(tǒng)的兼容的問題，建議不要用中文。（2）至于數(shù)據(jù)類型，常用的有“文本”、“備注”、“數(shù)字”、“日期/時間”、“是/否”和“自動編號”等。其中“文本”用于比較短的字符串（最長255個字符）；“備注”用于比較長的字符串，最長可以容納65535個而字符；“是/否”用于布爾類型，只有True（真）或False（假）；“自動編號”是個特殊的類型，它可以自動的遞增或隨機產(chǎn)生一個數(shù)字，經(jīng)常用它產(chǎn)生一個唯一的編號。9.3正確輸入所有字段后，單擊Access主窗口的保存按鈕，就會彈出下圖所示的另存為對話框，在其中輸入表的名稱，然后單擊確定按鈕即可。9.

9、4保存表9.5雙擊表1可以在表中輸入數(shù)據(jù)，當(dāng)你建表完畢后，覺得數(shù)據(jù)不合理，想修改數(shù)據(jù)也可以雙擊表1進行修改，如果想修改表的字段，就右擊表1，選擇“設(shè)計視圖”，就可以進行修改10.存取數(shù)據(jù)庫。存取數(shù)據(jù)庫是開發(fā)網(wǎng)絡(luò)程序中最重要也最常用的部分，.NET框架提供了，利用它就可以方便的存取數(shù)據(jù)庫。準(zhǔn)確的說，是由很多類組成的一類庫。這些類庫提供了很多對象，分別用來完成和數(shù)據(jù)庫的連接、查詢記錄、插入記錄、更新記錄和刪除記錄等操作。其中主要包括如下5個對象。（1）Connection對象：用來連接到數(shù)據(jù)庫。（2）Command對象：用來對數(shù)據(jù)庫執(zhí)行SQL命令。（3）DataReader對象：用來從數(shù)據(jù)庫返回只

10、讀數(shù)據(jù)。（4）DataAdapter對象：用來從數(shù)據(jù)庫返回數(shù)據(jù)，并送到DataSet對象中，還要負責(zé)保證DataSet對象中的數(shù)據(jù)和數(shù)據(jù)庫中的數(shù)據(jù)保持一致。（5）DataSet對象：它可以看做是存中的數(shù)據(jù)庫。實用OLEDB的數(shù)據(jù)庫，需要在頁面中導(dǎo)入相關(guān)的名稱空間：存取數(shù)據(jù)庫：（1）首先利用Connection對象建立和數(shù)據(jù)庫的連接。語法為：“Provider=OLEDB 驅(qū)動程序；Data Source=數(shù)據(jù)庫文件物理路徑”（2）然后建立Command對象，執(zhí)行SQL語句命令。（3）利用Command對象的ExecuteReader方法建立DataReader對象，從數(shù)據(jù)庫獲取數(shù)據(jù)。（4）Da

11、taReader對象返回的數(shù)據(jù)在記錄集移動指針就可依次顯示所有記錄。（5）利用Command對象的Executenonquery()方法可插入記錄和更新記錄。（6）與數(shù)據(jù)庫相連登陸程序，當(dāng)?shù)顷懗晒r則直接跳轉(zhuǎn)到的主頁，其主要代碼如下： Dim conn As New OleDbConnection(Provider=.4.0; Data Source= + () Dim strSql As String strSql = Select * From link Where username= & & And mypassword= & & Dim cmd As New OleDbCommand(

12、strSql, conn) () Dim dr As OleDbDataReader = () If ()=True Then () (主頁.aspx) Else () = 您必須輸入有效的用戶名和密碼，還沒注冊？ End If 當(dāng)點擊注冊按鈕時，跳轉(zhuǎn)到注冊頁面，主要程序代碼如下： Protected Sub Button1_Click(ByVal sender As Object, ByVal e As ) (注冊.aspx) End Sub注冊界面在數(shù)據(jù)庫中插入新注冊用戶信息主要代碼如下： Dim strSql As String strSql = Insert Into link(use

13、rname,mypassword,age,email,submit_date) Values( & user_ & , & & , & & , & & ,# & Now() & #) 當(dāng)注冊成功時，則跳回登陸界面，主要代碼如下： Dim cmd As New OleDbCommand(strSql,conn) Dim Exp As Exception Try () () () (登陸.aspx) Catch Exp = 發(fā)生錯誤，可能是用戶名已經(jīng)被人使用。 End Try五、的運行與實現(xiàn) 安裝Dreamweaver后，打開軟件，新建一個，將制作好的文件（后綴為html）包括建設(shè)好的css和需要添加的圖片，全部復(fù)制放到一個文件夾中，用360安全瀏覽器進行預(yù)覽。六、建設(shè)心得體會雖然之前有上過類似課程 但是用dreamweaver制作還是第一次，可能剛開始會感覺很困難，但是其實只要多去琢磨一段時間，把課本上的知識和老師講的知識結(jié)合起來，并進行多次實際操作，就能比較好的運用這門知識。通過對這個網(wǎng)頁的設(shè)計，了解到自身還存在很多不足，希望能在今后的學(xué)習(xí)和生活中好好提高。在設(shè)計過程中，我了解到網(wǎng)頁設(shè)計的一些布局，連接，還有一些圖形處