新媒體網(wǎng)頁設計與制作-Dreamweaver-CS6基礎、案例、技巧實用教程第1章課件

1、新媒體網(wǎng)頁設計與制作Dreamweaver CS6基礎、案例、技巧實用教程新媒體網(wǎng)頁設計與制作Dreamweaver CS6基礎、目 錄 第1章 網(wǎng)頁設計基礎 第2章 認識Dreamweaver CS6 第3章 制作絢麗多彩的網(wǎng)頁 第4章 使用CSS樣式美化網(wǎng)頁 第5章 新媒體網(wǎng)頁布局 第6章 網(wǎng)頁中的超級鏈接 第7章 新媒體網(wǎng)頁中的多媒體元素 目 錄 第1章 網(wǎng)頁設計基礎 目 錄 第8章 在新媒體網(wǎng)頁中添加動態(tài)特效 第9章 站點風格的統(tǒng)一 第10章 表單 第11章 綜合實訓-家具聯(lián)盟網(wǎng)站 第12章 創(chuàng)建移動設備網(wǎng)頁及應用程序 第13章 站點的整理維護與上傳 目 錄 第8章 在新媒體網(wǎng)頁中添加

2、動態(tài)特效 第1章 網(wǎng)頁設計基礎本章學習要點： 1網(wǎng)頁和網(wǎng)站的基本概念 2新媒體網(wǎng)站的色彩選擇與搭配、 策劃與創(chuàng)建原則 3網(wǎng)站制作的基本流程第1章 網(wǎng)頁設計基礎本章學習要點：1.1 認識網(wǎng)頁1.1.1 網(wǎng)頁與網(wǎng)站概念靜態(tài)網(wǎng)頁：標準HTML文件。動態(tài)網(wǎng)頁：在發(fā)送到瀏覽器之前由應用程序服務器自定義的網(wǎng)頁。 網(wǎng)站：即網(wǎng)頁的集合 。1.1 認識網(wǎng)頁1.1.1 網(wǎng)頁與網(wǎng)站概念1.1.2 網(wǎng)頁的基本要素LOGO 標題 導航欄頁眉 /頁腳 功能區(qū) 主體內容 1.1.2 網(wǎng)頁的基本要素LOGO 1.1.3 新媒體網(wǎng)頁的設計元素文字：是網(wǎng)頁信息傳遞的主要手段。 圖片 ：用于提供信息、展示作品、裝飾網(wǎng) 頁等。 多媒

3、體：包括音頻、視頻、動畫等元素 。 互動：實現(xiàn)信息的遠距離實時傳遞。 版式設計：“同”字型布局 、“國”字型布局 、“T”型布局 、“三”字型布局 、對比布局 、POP布局 、Flash布局 。1.1.3 新媒體網(wǎng)頁的設計元素文字：是網(wǎng)頁信息傳遞的主要1.1.4 新媒體網(wǎng)頁的布局方式固定布局流式布局 彈性布局 伸縮 響應式 自適應 1.1.4 新媒體網(wǎng)頁的布局方式固定布局1.2 新媒體網(wǎng)站的色彩選擇與搭配1.2.1 色彩理論 色彩是藝術表現(xiàn)的要素之一，是光刺激眼睛傳導到大腦中樞而產(chǎn)生的一種感覺。網(wǎng)頁設計師在決定了一個網(wǎng)站風格的同時也決定了網(wǎng)站的情感，而情感的表達很大程度上取決于顏色的選擇。而網(wǎng)

4、站給人的第一印象來自視覺沖擊，因此確定網(wǎng)站的標準色彩是新媒體網(wǎng)頁設計中最重要的一個方面。 1.2 新媒體網(wǎng)站的色彩選擇與搭配1.2.1 色彩理論 1.2.1 色彩理論在HTML中，顏色有3種表示方式 ：十六進制的數(shù) 顏色常量 rgb(r，g，b) 1.2.1 色彩理論在HTML中，顏色有3種表示方式 ：1.2.2 選擇色彩 網(wǎng)頁設計中，色彩的選擇往往是和情感聯(lián)系在一起的，比如溫暖、冷靜或嚴肅的情感。暖色能帶來陽光明媚的情緒，讓人感覺到溫暖，例如紅色、黃色和橙色；冷色可以表達出權威、明確和信任的感覺，讓人聯(lián)想到?jīng)鏊秃洌缢{色，綠色和紫色；中性色，只是給用戶一種淡淡的感受，沒有過多的情緒，平

5、靜，淡然，像灰色和棕色就是中性色。1.2.2 選擇色彩 網(wǎng)頁設計中，色彩的選擇往1.2.3 搭配色彩 標準色彩是指能體現(xiàn)網(wǎng)站形象和延伸內涵的色彩，不同的色彩搭配可以產(chǎn)生不同的效果，并可能影響到訪問者的情緒。單一色 相似色 互補色 1.2.3 搭配色彩 標準色彩是指能體現(xiàn)網(wǎng)站形象1.2.4 精彩網(wǎng)頁賞析IBM中國站 1.2.4 精彩網(wǎng)頁賞析IBM中國站 1.2.4 精彩網(wǎng)頁賞析可口可樂中國站 1.2.4 精彩網(wǎng)頁賞析可口可樂中國站 1.2.4 精彩網(wǎng)頁賞析何園網(wǎng)站1.2.4 精彩網(wǎng)頁賞析何園網(wǎng)站1.3 新媒體網(wǎng)站的策劃與創(chuàng)建原則1.3.1 定位網(wǎng)站主題和名稱 定位網(wǎng)站主題 ：網(wǎng)站的題材和內容應緊

6、扣主題，要突出個性和特色。網(wǎng)站定位要準確，內容要精練，題材不要太寬泛或者目標太高。網(wǎng)站名稱：網(wǎng)站名稱最好使用中文，字數(shù)控制在6個字以內，名稱要見名知義，且能代表本站特色。1.3 新媒體網(wǎng)站的策劃與創(chuàng)建原則1.3.1 定位網(wǎng)站主題1.3.2 網(wǎng)站風格 網(wǎng)站的風格是指網(wǎng)站的整體外觀帶給用戶的綜合感受，包括版面布局、瀏覽方式、交互性等諸多因素。1.3.2 網(wǎng)站風格 網(wǎng)站的風格是指網(wǎng)站的整體1.3.3 網(wǎng)站的CI形象 所謂CI，是借用的廣告術語，意思是通過視覺來統(tǒng)一企業(yè)的形象。設計網(wǎng)站標志確定網(wǎng)站標準色彩確定網(wǎng)站標準字體 設計網(wǎng)站的宣傳標語1.3.3 網(wǎng)站的CI形象 所謂CI，是借用的1.4 HTML

7、5簡介 HTML5是定義HTML標準的最新的版本，它既是一個新版本的HTML語言，具有新的元素、屬性和行為，還有更大的技術集，允許更多樣化和強大的網(wǎng)站和應用程序。它不但強化了Web網(wǎng)頁的表現(xiàn)性能，還追加了本地數(shù)據(jù)庫等 Web 應用的功能。 1.4 HTML5簡介 HTML5是定義H1.4.1 HTML5特性語義特性 本地存儲特性 設備兼容特性 連接特性 網(wǎng)頁多媒體特性 三維、圖形及特效特性 性能與集成特性 CSS3特性 1.4.1 HTML5特性語義特性 1.4.2 HTML5新增功能取消了一些過時的HTML4標記 將內容和展示分離 表單元素的升級 新增audio 和video 標簽 新增canvas標簽 新增一些API（主要是供js使用的） 1.4.2 HTML5新增功能取消了一些過時的HTM