1前期構思過程中的設計

(1)調研階段:項目開展前期學生會對客戶或相關專業人士展開訪談,對行業同類網站的資訊開展收集與調研。如果是真實案例,此階段將會是客戶與設計師交流階段,我們也可以在這個環節中通過客戶的感受與體驗得到所需的設計信息,或者客戶會提出指定的信息需求也是我們需要關注的。這個階段為后續的設計提供設計依據。

(2)信息設計:信息架構是一門以邏輯性方式來組織信息的科學。這一階段并不是我們通常理解的通過計算機后臺代碼進行的代碼結構設置,而是我們設計網頁之前根據分析調研資料,界面設計共同習慣和使用者習慣及需求,設計的邏輯關系架構圖,也就是網站的主要信息導引。根據設計結構關系我們可以更進一步開展詳盡的設計綱要,而設計綱要的信息主要來源于我們的前期所獲得的調研信息。(4)交互設計:網頁中的交互設計是目前我們教師在教學中面對的新課題,在網頁中如何更好的與訪問者互動將是我們教師在教學中探究與關注的重點。目前在網頁設計課程中所接觸到最直接的交互設計形式主要集中在導航條和表單信息的設計上。導航條和表單信息都會直接產生交互行為,導航條引導瀏覽者,通過點擊觸發導航按鈕的行為直接參與交互,進而瀏覽新的網頁;表單通過瀏覽者填充或選擇信息,生成交互,收集有用的資料和跟蹤反饋。

2界面設計過程中的設計

界面設計是網頁設計中重要的設計展示環節,在這個過程中學生可以根據自己的主題展開藝術美感的設計。一般進行頁面設計我們從以下幾個方面入手。

(1)版式設計:網頁設計中的排版與傳統意義上的版式設計差異不大,只是由于各自的展示環境不同,有所側重。在網頁設計排版中我們會采用黃金比例分割排列方式,也會采用三分法排列原則。常見的網頁排版由上至下分別是網頁上部logo區域、導航區域、內容區域、版權信息區域。中間的內容區域可以根據自己的需求進行分配,可以是左右形式,也可是上下形式,還可以是上中下結構等等。

(2)色彩設計:色彩設計作為一門獨立學科,有其豐富的語言和表現形態,向我們傳達由科學到情感不同層次不同領域的信息,為我們帶來更直觀的視覺體驗。同時網頁配色也是網頁設計師必備技能之一。網頁色彩決定訪問者的第一視覺感受。在教學中教師應要求學生根據所選主題,確立網站主體顏色和輔助顏色,利用色彩營造符合主題的環境與相應的氣氛。

(3)圖像設計:圖像是網頁頁面中的重要信息組成部分。網頁中常見的圖像形態分為,信息圖片,反映現實的圖片信息或調查數據信息,量表等;裝飾美化圖像,如插畫,符合網站主題與網站主色調協調統一,起到美化頁面的效果;背景圖像設計,這部分可能采用大面積的色塊,也會采用紋理或連續圖案效果,起到頁面美化,氣氛烘托等作用。

(4)字體設計:網頁字體分為英文字體與中文字體,網頁中常見的英文字體有Arial、ArialBlack、ArialNarrow等等,字號一般選用12pt。在中文網頁中我們一般會看到字體為宋體或黑體,字號為12pt/14pt的文字展示,另有個別網頁中也會采用16pt或更大字號作為標題文字,以上是常見字體字號顯示方式。特殊字體的運用方面,隨著瀏覽器技術的發展,及相關軟件的開發,我們可以將選擇的特殊字體順利的嵌入到網頁頁面中,便于展示。另外字體除了本身的表意之外,還更多的轉換為圖形釋義,這樣也為我們的設計提供新的切入方法。

3技術實施與運行中的設計

(1)布局設計,網頁設計中常見的布局方式有表格式布局,框架式布局以及DIV+CSS方式布局。DIV+CSS布局方式,是目前網頁設計中比較常見的,它實現了網頁結構與樣式的真正分離。與table表格布局在靜態外觀展示上差別不大,只是在收索引擎和網站的后期維護上有所差別,相對信息復雜,內容繁多的網站,我們更建議使用DIV+CSS這種布局方式,這種布局方式更有邏輯性,結構清晰,便于后期信息修訂與整理。

(2)CSS樣式設計,CSS樣式是英文Cas-cadingStyleSheets(層疊樣式表的縮寫形式,它是html或xml外觀樣式的一種補足。CSS規則簡單易掌握,可以更好的控制網頁外觀展示,同時CSS所涉及的規劃范圍廣泛,從文字大小、顏色到web頁面中各個元素定位等。在網頁中應用CSS樣式,便于統一展示風格,便于修改,便于不同瀏覽器顯示統一效果。

4結語

網頁設計課程依據實際項目講解,教師教學以引導為主,學生通過對流程的掌握和對項目課題的理解,達到理論與實踐相結合,強化學生的技能操作,鍛煉了學生的創新思維能力,提高了網站建設的綜合素質,為今后動態網站的建立打下良好的基礎。

作者：劉石 孟萍 李靜 單位：大連東軟信息學院