在當(dāng)今信息時代,Internet不僅是一個通信和交流的平臺,同時也是一個必不可少的宣傳、展示和交易的平臺,與其他設(shè)計工作相比,網(wǎng)站設(shè)計具有交互性、多態(tài)性、綜合性、藝術(shù)性等特點,一個網(wǎng)站建設(shè)過程綜合了策劃創(chuàng)意、平面設(shè)計、網(wǎng)絡(luò)工程、時間空間處理等諸多方面,因此,網(wǎng)頁要做到識別性強、形象品質(zhì)好、設(shè)計理念清楚、色彩統(tǒng)一和諧、定位準確,其中最重要的是遵循用戶第一、主線突出原則。
系統(tǒng)結(jié)構(gòu)設(shè)計是對網(wǎng)站的整體規(guī)劃,是網(wǎng)站開發(fā)的基礎(chǔ)。主要包括界面風(fēng)格設(shè)計、導(dǎo)航設(shè)計、交互設(shè)計。
一、界面風(fēng)格設(shè)計
設(shè)計網(wǎng)站應(yīng)主題鮮明,視覺設(shè)計要傳達一定的意圖和要求,要有明確的主題。因此,主題鮮明是網(wǎng)頁設(shè)計的前提,不同的主題應(yīng)有不同的設(shè)計風(fēng)格。不同的設(shè)計風(fēng)格,給人以不同的視覺效果。網(wǎng)頁設(shè)計屬視覺設(shè)計領(lǐng)域,它的最終目的是使網(wǎng)頁內(nèi)容清晰、具有條理性,并達到最佳的視覺效果。其設(shè)計不但要單純、簡練、清晰和準確,而且在強調(diào)藝術(shù)性的同時,更應(yīng)該注重通過獨特的風(fēng)格和強烈的視覺沖擊力,來鮮明的突出設(shè)計主題。同時,要使網(wǎng)頁從形式上給人良好的印象,鮮明的突出主題,可以通過對網(wǎng)頁的空間層次、主從關(guān)系、視覺秩序及彼此間邏輯關(guān)系的把握運用來實現(xiàn)。合理布局、調(diào)整主次的位置關(guān)系、突出主題,能讓瀏覽者在短時間內(nèi)過目不忘、回味無窮。
設(shè)計網(wǎng)站應(yīng)內(nèi)容與形式統(tǒng)一,內(nèi)容與形式統(tǒng)一是指在進行頁面編排時,形式語言必須符合頁面的內(nèi)容,能夠體現(xiàn)內(nèi)容的豐富含義,實現(xiàn)內(nèi)容與形式的有機結(jié)合。網(wǎng)頁形式要具有豐富的表現(xiàn)力,要將一個無生命的網(wǎng)頁予以生命,變成充滿活力的生命體。應(yīng)用不同的形式,形成不同的造型效果和趣味,有利于創(chuàng)造獨特新穎的頁面,這些方法包括單純與秩序、對比與調(diào)和、對稱與平衡、節(jié)奏與韻律以及留白。不論采用那種形式的方法,都必須與內(nèi)容達成一致。
二、 導(dǎo)航設(shè)計
導(dǎo)航是引導(dǎo)學(xué)習(xí)者學(xué)習(xí)的航標(biāo),是教學(xué)策略的體現(xiàn)。成功的數(shù)字學(xué)習(xí)資源應(yīng)該具有良好有效的學(xué)習(xí)導(dǎo)航系統(tǒng),才能避免學(xué)生因為學(xué)習(xí)資源的豐富而在信息中迷失方向、偏離學(xué)習(xí)目標(biāo),降低學(xué)習(xí)效率。因此,在本專題學(xué)習(xí)網(wǎng)站設(shè)計中,導(dǎo)航策略設(shè)計力求目標(biāo)明確、方法簡單、內(nèi)容完整、相互交叉,以便學(xué)習(xí)者在瀏覽網(wǎng)站進行學(xué)習(xí)時,很快在網(wǎng)站內(nèi)找到、瀏覽到自己需要的資源,方便地應(yīng)用網(wǎng)站提供的各種資源、方法進行學(xué)習(xí)和協(xié)作交流。網(wǎng)站建設(shè)的導(dǎo)航設(shè)計采用了常見的導(dǎo)航條導(dǎo)航、功能面板導(dǎo)航、分頁面導(dǎo)航三種形式。
導(dǎo)航條在網(wǎng)頁中被廣泛運用,相對于文本導(dǎo)航,圖像導(dǎo)航條導(dǎo)航更加生動、形象。選擇[插入]|[圖像對象]|[導(dǎo)航條]命令,打開“插入導(dǎo)航條”對話框,可以增加、刪除導(dǎo)航條元件,可將選中的導(dǎo)航條元件向上移動、向下移動,可選[修改]|[導(dǎo)航條]命令修改導(dǎo)航條。
而在同一模塊內(nèi)采用了Spry選項卡式面板導(dǎo)航,Spry選項卡式面板可將多項內(nèi)容放置于同一區(qū)域中,瀏覽者可以通過單擊面板上需要訪問的選項卡來顯示相應(yīng)內(nèi)容,其余內(nèi)容隱藏,而不需要打開單獨的頁面來訪問相應(yīng)內(nèi)容,因此給瀏覽者提供了方便,也節(jié)省了網(wǎng)頁空間。
將插入點定位于網(wǎng)站建設(shè)網(wǎng)頁要插入Spry選項卡式面板的位置,選擇[插入]|[布局對象]|[Spry選項卡式面板]命令,即可在網(wǎng)頁中插入Spry選項卡式面板。單擊插入Spry選項卡式面板的名稱,選擇插入Spry選項卡式面板,打開屬性檢查器,如圖3所示,在“面板”列表框中可重新設(shè)置面板名稱,在“默認面板”下拉列表框中可以選擇加載時默認顯示哪個選項卡及其內(nèi)容,如果要修改某選項卡的內(nèi)容,可在屬性檢查器的“面板”列表框中選擇對應(yīng)的選項卡,然后在編輯窗口的內(nèi)容區(qū)域內(nèi)添加相應(yīng)的內(nèi)容。