眾所周知，網(wǎng)站制作涉及到了各個方面的知識，包括平面設(shè)計、HTML頁面制作、CSS樣式定義、客戶端腳本編寫（JavaScrfipt/VBScript）、服務(wù)器端腳本編寫（Asp/Asp.Net/PHP/JSP）等諸多內(nèi)容。本期筆者從更基礎(chǔ)的講起，著重介紹怎樣制作一個簡單的HTML網(wǎng)站，初步體會一下其中的樂趣。
1.這里筆者使用的網(wǎng)頁制作工具是Dreamweaver。首先運行Dreamweaver，選擇“文件”→“新建”菜單，此時會彈出如圖1所示的窗口。
圖1
2.在此窗口中的“基本頁”標簽下有七個選項，我們選擇“HTML”項后單擊“創(chuàng)建”按鈕，創(chuàng)建工作區(qū)就會變成空白，這說明HTML頁面已經(jīng)創(chuàng)建成功，單擊代碼視圖就會出現(xiàn)如圖2所示的內(nèi)容。
圖2
3.先不要理會這些顯示出的HTML頁面代碼的具體含義，我們首先將“Title無標題文檔”改成“網(wǎng)頁處女秀”，然后再選擇設(shè)計視圖。點擊“菜單”→“插入”→“HTML”→“框架”→“上方”，即在網(wǎng)頁的上方插入了一個框架。此時網(wǎng)頁就分成了兩個框架，即上框架和下框架。我們選擇下框架后，選擇“菜單”→“插入”→“HTML”→“框架”→“左方”命令，即在網(wǎng)頁的左邊插入了一個框架。
4.單擊“Ctrl＋S”保存各個框架（top.htm，left.htm， right.htm）。然后選擇左框架，點擊“菜單”→“插入”→“超鏈接”命令，會出現(xiàn)如圖3所示的對話框。在該對話框中輸入各個項，其中“文本”是鏈接顯示的文字，“鏈接”是單擊之后跳轉(zhuǎn)到的頁面地址，“目標”是在哪個框架里顯示。在此我們選擇“目標”為mainFrame(即左邊框架)，并按照此步驟繼續(xù)插入超鏈接。接下來進入右框架(right.htm)的代碼視圖，在里輸入
，這是一個文字**，可以讓文字左右上下移動，其中把direction換成(UP，DOWN，Left，Right)就可以改變文字的移動方向了。
圖3
5.至此已經(jīng)做出了一個帶框架的HTML頁面，下面我們要在上框架(top.htm)上加入一個Banner。Banner可以做一些JavaScript動態(tài)效果，動態(tài)交換效果具體代碼可以去Top.Htm頁面的源碼里查看，筆者在此只給出關(guān)鍵代碼：
bannerAD[0]="pic173.gif";
bannerADlink[0]="";
代碼解釋：如上給出的是一個JavaScript數(shù)組，bannerAD存放的是圖片，bannerADlink存放的是單擊圖片后的鏈接，可以根據(jù)自己的需要加減圖片。
6.繼續(xù)為右框架的超鏈接做頁面，具體內(nèi)容可以自己定。選擇“文件”菜單，單擊“新建”，選擇HTML創(chuàng)建一系列頁面，頁面的名稱要與在插入鏈接時寫的名稱一致。筆者在原文件里做了兩個例子（更新消息和人氣明星），讀者朋友們可以自己嘗試加入更多內(nèi)容。這樣，一個HTML網(wǎng)站的雛形就制作好了，如圖4所示是該頁面的更終效果。
圖4
動態(tài)效果在截圖中體現(xiàn)不出來，讀者可以直接在IE打開源文件中的Index.htm，打開后會有提示，單擊右鍵就會彈出“允許阻止內(nèi)容”的提示菜單。
總結(jié)：本期我們介紹的是如何用Dreamweaver做一個簡單的HTML站點，里面用到了部分JavaScript、HTML框架、超鏈接等技術(shù)。另外上面我們所看到的出現(xiàn)阻止內(nèi)容的提示，是因為沒有把網(wǎng)頁發(fā)布到站點上。在下期，筆者將帶給大家更精彩的內(nèi)容
網(wǎng)頁設(shè)計制作技巧，歡迎咨詢合作。
