LOGO義守大學98-1學期資訊管理碩士在職專班人因與資管期末報告網頁設計思維與網站導覽列設計指導教授:吳有龍博士提報學生:碩專一羅明蘭學號:isu9822021g前言在多姿多彩的網際網路世界中,什麼樣的網頁才能迅速獲得訪問者的青睞?如何才能設計出與眾不同的漂亮網頁?透過觀察比較可發現,一個優秀的網頁,通常具備豐富的內容、合理的版型、獨特的風格和悅目的色彩。掌握有關版型風格設計及色彩搭配等方面的知識與方法,透過實踐累積經驗,成為優秀網頁設計師。網頁版型和風格設計尤其需要設計者具備一定的平面設計知識與審美能力。網頁設計思維•Section1網站的設計流程1.網站需求分析:(1)一個網站專案的確立是建立在各式各樣的需求之上,而需求來自用戶實際需求(2)用戶範圍遍及各領域,必須了解其習慣技能、知識和經驗,以預測需求(3)用戶不同的特點使分析複雜化,但初始計畫不加入工作過程,會遭遇巨大麻煩網站整體風格定位:(1)了解網站類型,確定網站大致風格走向不同類型網站,風格肯定不盡相同(2)花時間調查學習各行業之風格,以營造適合的網站氣氛(3)用戶能很輕易辨別出何種類型網頁,則需求分析及風格及成功。網頁的創意設計:(1)電腦繪圖技巧必須爐火純青,某些特定特定藝術效果必須手繪或掃描始達到(2)不要熱衷於花樣日益翻新之技術而忘記優秀設計和清晰表達之重要性(3)優秀網頁係創意和技術完美結合;有創意無技術或有技術無創意,作品易空洞網頁的創意設計:(4)不斷探索技術與藝術之間的平衡與結合是通向成功設計之門唯一捷徑網頁設計思維•Section2網站的內容(視覺及聽覺)視覺元素包含文字、字體、圖像、動畫等不同字體傳達不同印象:宋体工整、雋永悅目黑體肅穆、莊重嚴肅圓體豐滿、藝術性強1.文字的字體網頁設計思維字型大小控制頁面形象略大文字→有力自信略小文字→纖密緊湊如:標題變大→畫面活耀標題變小→更顯穩重2.文字的字形網頁設計思維文字變細顯得十分優美文字變粗顯的很有力量視覺聯想→細字冷靜粗字熱情細字標題→女性風格粗字標題→男性風格正文盡量使用標準文字以提升可讀性3.文字的粗細網頁設計思維4文字行距圖像元素一般指透過攝影獲得的照片特點是真實直觀,可直接說明事物特徵圖像佔據面積顯示重要程度大圖像容易形成視覺焦點,感染力強,常用作突出表現之內容;小圖像則常用來穿插字群中,點綴呼應主題提高網頁的說服力增強故事性及提高造型的緊張感;故事性即插圖照片的資訊性,而強烈感可增強說服力圖片是表達資訊的重要手段用圖片表示歡迎式網頁中常見的手段,而笑臉是最能表現歡迎情緒的。網頁設計思維動畫元素網頁中最活耀之元素,對訪問者的吸引力通常勝過純文字內容不要使用顏色過於鮮豔、變化過於強烈之動畫,以免干擾使用者對資訊獲取效果考慮網路傳輸情況,控制動畫檔案大小,避免載入時間過久動畫表現之主題應該貼合網頁的主要內容網頁設計思維網頁設計思維•Section2網站的內容(視覺及聽覺)聽覺元素包含背景音樂及音效網頁中適當嵌入音訊能夠充分顯示網頁的多媒體特性•背景音樂常用檔案格式為.mid,是一種樂器數位化格式檔,存儲量很小,適合網路使用載入音樂是為了觸動使用者神經使其加深印象,而非為播放音樂而播放•音效淡入效果和微妙的音效變化可以很容易引起聽眾興趣使網頁保持親密與多樣性結論版面配置的成功與否,關係網站是否能夠凝聚人氣,藉由網頁設計思維及網站導覽列設計的分析,吸引使用者點擊。報告擷取各種經典網頁版型格局,提供從事網頁設計人員掌握網頁版型與風格技巧,提高創意和審美能力。LOGOClicktoeditcompanyslogan.