2021-4-13 | 網站設計論文
一、系統結構導航設計
導航是引導學習者學習的航標,是教學策略的體現。成功的數字學習資源應該具有良好有效的學習導航系統,才能避免學生因為學習資源的豐富而在信息中迷失方向、偏離學習目標,降低學習效率。因此,在本專題學習網站設計中,導航策略設計力求目標明確、方法簡單、內容完整、相互交叉,以便學習者在瀏覽網站進行學習時,很快在網站內找到、瀏覽到自己需要的資源,方便地應用網站提供的各種資源、方法進行學習和協作交流。本站的導航設計采用了常見的導航條導航、功能面板導航、分頁面導航三種形式。
導航條在網頁中被廣泛運用,相對于文本導航,圖像導航條導航更加生動、形象。選擇[插入]|[圖像對象]|[導航條]命令,打開“插入導航條”對話框,可以增加、刪除導航條元件,可將選中的導航條元件向上移動、向下移動,可選[修改]|[導航條]命令修改導航條。而在同一模塊內采用了Spry選項卡式面板導航,Spry選項卡式面板可將多項內容放置于同一區域中,瀏覽者可以通過單擊面板上需要訪問的選項卡來顯示相應內容,其余內容隱藏,而不需要打開單獨的頁面來訪問相應內容,因此給瀏覽者提供了方便,也節省了網頁空間。
將插入點定位于網頁要插入Spry選項卡式面板的位置,選擇[插入]|[布局對象]|[Spry選項卡式面板]命令,即可在網頁中插入Spry選項卡式面板。單擊插入Spry選項卡式面板的名稱,選擇插入Spry選項卡式面板,打開屬性檢查器,如圖3所示,在“面板”列表框中可重新設置面板名稱,在“默認面板”下拉列表框中可以選擇加載時默認顯示哪個選項卡及其內容,如果要修改某選項卡的內容,可在屬性檢查器的“面板”列表框中選擇對應的選項卡,然后在編輯窗口的內容區域內添加相應的內容。
二、動態網頁開發平臺的架設
交互式動態網頁是指能動態更新的交互式網頁,其內容的更新和維護是通過基于數據庫技術的管理系統完成的。在Windows操作系統中,一般都是利用IIS來構建動態網站開發平臺的,IIS是一種允許在公共Internet上發布信息的Web服務器,IIS通過使用超文本傳輸協議(HTTP)傳輸信息,同時支持FTP服務,IIS能很好地支持ASP,是動態網站開發的理想平臺,本網站是在Windows7環境下開發的。
1.安裝IIS
Windows系統在默認情況下沒用安裝IIS,必須在安裝Win-dows后另行安裝。打開Windows功能窗口,找到Internet信息服務,將Internet信息服務前面的加號點開,找到web管理工具,選中IIS管理服務、IIS管理腳本和工具、IIS管理控制臺。然后點開萬維網服務,點開應用程序開發功能,依次選中:.NET擴展性、ASP、ASP.NET、ISAPI擴展、ISAPI篩選器,如果想安裝PHP,需要將CGI也選中。選中這些之后,其他默認即可,然后點確定,Windows就開始安裝IIS了。
2.配置IIS
安裝完IIS還需要設置網頁主目錄及IP地址,進入“控制面板”窗口,單擊[系統與安全]圖標,進入“系統和安全”頁面后,再單擊其中的[管理工具]圖標,出現“管理工具”窗口后,雙擊“Internet信息服務(IIS)管理器”選項進行IIS設置,在“Internet信息服務(IIS)管理器”窗口中刪除“DefaultWebSite”,添加信天媒體站點。進入“Asp”設置頁面后,展開“行為”選項組,將“啟用父路徑”的參數設置為True。接下來配置IIS站點,單擊窗口右側的“操作”欄中的“綁定”選項,打開“網站綁定”對話框,在“網站綁定”對話框中選定當前命名的網站,單擊[編輯]按鈕打開“編輯網站綁定”對話框,可以在其中設置網站的IP地址、端口號和主機名,如果是創建本地測試服務器,可以不在其中設置任何內容,然后單擊[確定]按鈕返回“網站綁定”對話框,在“網站綁定”對話框中單擊[關閉]按鈕,完成網站綁定參數的設置。在“Internet信息服務(IIS)管理器”窗口中雙擊[默認文檔]按鈕,打開“默認文檔”頁面后單擊“操作”欄中的“添加”選項,出現“添加默認文檔”對話框,在該對話框中的“名稱”文本框中輸入index.asp,表明名為index.asp的文檔將作為網站的默認文件,單擊[確定]按鈕,返回“Internet信息服務(IIS)管理器”窗口,完成IIS的配置,如圖5所示。
3.設置站點
為了方便在設計制作過程中查看頁面效果,需要在Dreamweaver中為設計的動態網頁設置一個臨時站點,啟動Dreamweaver,選擇[站點]|[管理站點]命令,出現“管理站點”對話框,選定事先設置好的用于創建動態網站的站點名(如信天媒體),然后單擊[編輯]按鈕,打開“站點設置對象”對話框,根據需要設置或更改站點名稱和本地站點文件夾。選擇“服務器”類別,單擊[添加新服務器]按鈕,在出現的設置選項中添加服務器名稱、連接方法、服務器文件夾和WebURL參數,注意將“連接方法”設置為“本地/網絡”。切換到“高級”選項卡,將“服務器模型”設置為ASPVBScript。單擊[保存]按鈕返回“站點設置對象”對話框,即可看到服務器列表出現新添加的服務器,選中“測試”選項。單擊[保存]按鈕,完成Dreamweaver站點的定義。
4.連接數據庫
Dreamweaver提供了多種連接數據庫的方法,最常用的是使用ASP進行連接,具體連接到數據庫的方式又分為“數據源名稱(DSN)”和“自定義連接字符串方式”兩種。本網站采用的是“數據源名稱(DSN)”方式連接到數據庫,選擇[窗口]|[數據庫]命令,打開“數據庫”面板,單擊“數據庫”面板上的[添加]按鈕,從菜單中選[擇數據源名稱(DSN)]選項,出現“數據源名稱(DSN)”對話框后,單擊[定義]按鈕,打開“ODBC數據源管理器”對話框,利用其中的選項,即可定義一個數據源,如圖6所示。
三、資源下載模塊登錄頁面設計
在用戶訪問資源下載模塊時,首先要進行身份驗證,這個功能是靠登錄頁面來實現的,如圖7所示。該界面設計先執行[插入]|[表單]|[表單]命令,然后將鼠標放置在該表單中,執行菜單[插入]|[表格]命令,插入3行2列的表格,在表格的第1行,第2列執行[插入]|[表單]|[文本域]命令,插入一個單行文本域表單對象,并定義文本域名為“username”,在表格的第2行,第2列執行[插入]|[表單]|[文本域]命令,插入一個單行文本域表單對象,并定義文本域名為“password”,在表格的第3行,執行[插入]|[表單]|[按鈕]命令,插入兩個按鈕,一個是登錄時用的“提交表單”,值為“登錄”,另一個為“重設表單”,值為“重置”。表單編輯完成后,下面編輯該網頁的動態內容,使用戶可以通過該網頁中表單的提交實現登錄功能。打開“服務器行為”面板,單擊該面板上按鈕,執行菜單[用戶身份驗證]|[登錄用戶]命令,向該頁面添加“登錄用戶”的服務器行為。執行[文件]|[保存]命令,將該文檔保存到本地站點中,完成登錄網頁的制作。
四、結語
隨著網絡教育的發展,校園文化網站的風格設計顯得尤為重要,設計獨特、新穎、讓人回味無窮的網站,給人以智慧、啟迪的網絡文化。同時,網站系統的建設與維護是個長期的過程,需要不斷地與使用者溝通,不斷地增加新的功能、美化界面,從而使網站不斷地注入新的活力。
作者:高平 單位:北京信息科技大學公共管理與傳媒學院