在當今信息時代,Internet不僅是一個通信和交流的平臺,同時也是一個必不可少的宣傳、展示和交易的平臺,與其他設計工作相比,網站設計具有交互性、多態性、綜合性、藝術性等特點,一個網站建設過程綜合了策劃創意、平面設計、網絡工程、時間空間處理等諸多方面,因此,網頁要做到識別性強、形象品質好、設計理念清楚、色彩統一和諧、定位準確,其中最重要的是遵循用戶第一、主線突出原則。

系統結構設計是對網站的整體規劃,是網站開發的基礎。主要包括界面風格設計、導航設計、交互設計。

一、界面風格設計

設計網站應主題鮮明,視覺設計要傳達一定的意圖和要求,要有明確的主題。因此,主題鮮明是網頁設計的前提,不同的主題應有不同的設計風格。不同的設計風格,給人以不同的視覺效果。網頁設計屬視覺設計領域,它的最終目的是使網頁內容清晰、具有條理性,并達到最佳的視覺效果。其設計不但要單純、簡練、清晰和準確,而且在強調藝術性的同時,更應該注重通過獨特的風格和強烈的視覺沖擊力,來鮮明的突出設計主題。同時,要使網頁從形式上給人良好的印象,鮮明的突出主題,可以通過對網頁的空間層次、主從關系、視覺秩序及彼此間邏輯關系的把握運用來實現。合理布局、調整主次的位置關系、突出主題,能讓瀏覽者在短時間內過目不忘、回味無窮。

設計網站應內容與形式統一,內容與形式統一是指在進行頁面編排時,形式語言必須符合頁面的內容,能夠體現內容的豐富含義,實現內容與形式的有機結合。網頁形式要具有豐富的表現力,要將一個無生命的網頁予以生命,變成充滿活力的生命體。應用不同的形式,形成不同的造型效果和趣味,有利于創造獨特新穎的頁面,這些方法包括單純與秩序、對比與調和、對稱與平衡、節奏與韻律以及留白。不論采用那種形式的方法,都必須與內容達成一致。

二、 導航設計

導航是引導學習者學習的航標,是教學策略的體現。成功的數字學習資源應該具有良好有效的學習導航系統,才能避免學生因為學習資源的豐富而在信息中迷失方向、偏離學習目標,降低學習效率。因此,在本專題學習網站設計中,導航策略設計力求目標明確、方法簡單、內容完整、相互交叉,以便學習者在瀏覽網站進行學習時,很快在網站內找到、瀏覽到自己需要的資源,方便地應用網站提供的各種資源、方法進行學習和協作交流。網站建設的導航設計采用了常見的導航條導航、功能面板導航、分頁面導航三種形式。

導航條在網頁中被廣泛運用,相對于文本導航,圖像導航條導航更加生動、形象。選擇[插入]|[圖像對象]|[導航條]命令,打開“插入導航條”對話框,可以增加、刪除導航條元件,可將選中的導航條元件向上移動、向下移動,可選[修改]|[導航條]命令修改導航條。

而在同一模塊內采用了Spry選項卡式面板導航,Spry選項卡式面板可將多項內容放置于同一區域中,瀏覽者可以通過單擊面板上需要訪問的選項卡來顯示相應內容,其余內容隱藏,而不需要打開單獨的頁面來訪問相應內容,因此給瀏覽者提供了方便,也節省了網頁空間。

將插入點定位于網站建設網頁要插入Spry選項卡式面板的位置,選擇[插入]|[布局對象]|[Spry選項卡式面板]命令,即可在網頁中插入Spry選項卡式面板。單擊插入Spry選項卡式面板的名稱,選擇插入Spry選項卡式面板,打開屬性檢查器,如圖3所示,在“面板”列表框中可重新設置面板名稱,在“默認面板”下拉列表框中可以選擇加載時默認顯示哪個選項卡及其內容,如果要修改某選項卡的內容,可在屬性檢查器的“面板”列表框中選擇對應的選項卡,然后在編輯窗口的內容區域內添加相應的內容。