資源簡介

(共35張PPT)
Plan a class website
動手創建自己的網站
籌劃班級網站
CONtents
01
觀摩網站
02
明 確 功 能
定 位
03
設 計 內 容
結 構
04
設計版面
觀摩網站
THE
Part 01
觀摩網站
提供信息資訊
觀摩網站
提供信息資訊
觀摩網站
展示品牌形象
觀摩網站
展示品牌形象
觀摩網站
進行交易的
觀摩網站
進行交易的
觀摩網站
共享信息互動交流
觀摩網站
共享信息互動交流
觀摩網站
各種功能網站
觀摩網站
各種功能網站
各種功能網站
例如：百度、谷歌、必應
163郵箱
共享信息互動交流
例如：微博、貼吧、知乎
進行交易的
例如：淘寶、天貓
提供信息資訊
例如：人力資源與社會保障局
教育局
網站的用途越來越多，籌劃制作網站先要進行功能定位。
觀摩網站
明確功能定位
THE
Part 02
確定網站名稱
明確功能定位
對內，面向同學
記錄班級成長足跡
分享點滴收獲
構筑友誼紐帶
明確功能定位
對外，面向老師、家長
反映本班同學精神面貌
設計內容結構
THE
Part 03
01
選擇內容
02
設計欄目
設計內容結構
欄目 主要內容
班級相冊 記錄同學們的成長足跡。整理保存同學們在校園活動、課堂學習、校外實踐的相片或視頻
才藝展示 展示同學們的作品。呈現同學們課堂內外的作品，為 同學們提供展示才藝的天地
快樂學習 分享探索成果，共同快樂成長。包括作文選、資料集、收藏夾、休閑區等
通信聯絡 記錄同學們的最新聯絡方式，滿足隨時隨地的通信查詢
03
網頁結構圖
設計內容結構
設計版面
THE
Part 04
01
02
03
選定版面寬度
合理布局版面
設計色彩方案
設計版面
顯示器分辨率不同，看到的網頁效果有可能不同。一般以顯示器常用分辨率為基準，如：800×600、1366×768等。版面內容不要超過屏幕的寬度。
網站主題標志突出，導航清晰，版面疏密有度，內容分布主次有序，不同欄目的網頁版式可以稍有變化。
不同顏色的搭配，能帶給人不同的印象。一個網站往往有自己的主色調。
設計版面
網站主題標志突出，導航清晰，版面疏密有度，內容分布主次有序，不同欄目的網頁版式可以稍有變化。
設計色彩方案
色彩的選擇也是一種主題與個性的表達，不同顏色的搭配，能帶給人以不同的印象。
一個網站往往有自己的主色調，在制作網站前應綜合考慮網站的主題、訪問對象和自身的喜好等，確定一種合適的配色方案。
設計版面
在一般情況下，彩色頁面較完全黑白頁面更加吸引人。通常主要內容文字用非彩色（黑、白、灰色），邊框、背景、圖片用彩色。這樣，頁面整體不單調，看主要內容也不會眼花。
01
02
是一種激奮的色彩。給人以刺激效果，能使人產生沖動、憤
怒、熱情、活力的感覺。
紅色
是最清新、專業的色彩。它和白色混合，能體現柔順、淡雅、
浪漫的氣氛。
藍色
03
給人以潔白、明快、純真、清潔的感覺。
白色
04
給人以深沉、神秘、寂靜、悲哀、壓抑的感覺。
黑色
設計色彩方案
設計色彩方案
動手
試一試
單擊“開始”→“控制面板”→雙擊“顯示”，在打開的窗口的“設置”頂中修改顯示器分辨率，在不同分辨率中瀏覽網頁，觀察有何不同。
任務：
打開任意官網（如“海瀾之家”），瀏覽網站內容
修改電腦顯示分辨率為“800*600”，再次去瀏覽網站內容，觀察有何變化
重新把分辨率改為“1920*1080”
謝 謝 觀 看

展開更多......

收起↑