《基于工作過程的網頁設計與制作教程》以培養職業能力為核心，以工作實踐為主線，以項目為導向，采用情境教學，建立以工作過程為框架的現代職業教育課程結構，面向網頁設計師崗位設置課程內容。
《基于工作過程的網頁設計與制作教程》教學內容同時采用模塊化的編寫思路，主要有網頁制作基礎、網站規劃與制作流程、網頁效果圖設計、網站的色彩與布局、網頁動畫的快速設計與制作、網頁的基本編輯、HTML語言的編寫、層疊樣式表的應用、框架與表格網頁布局設計、DIV+CSS布局網站、使用模板與庫制作靜態網站、靜態網站的動態化、ASP動態網頁編程、基于工作過程的英語專題學習網站教學案例、項目開發綜合實訓等教學模塊，構成了系統的課程教學內容體系，所有教學內容符合崗位需求。同時《基于工作過程的網頁設計與制作教程》以“書法家莊輝個人網站”項目貫穿始終，同時又以綜合教學案例鞏固了課程內容。初級網頁設計師通過《基于工作過程的網頁設計與制作教程》的學習，輔助項目實訓的系統訓練，將勝任網頁設計師的崗位。
《基于工作過程的網頁設計與制作教程》內容豐富，實用性強，可用做高職高專計算機網絡工程、軟件技術、計算機維護、計算機應用技術、信息管理、電子商務等專業的“網頁設計與制作”課程的教材，也可作為網站設計愛好者的學習參考書。
網站是信息交流的重要平臺，是一個單位形象的重要標志。明確網站的建設目標，掌握網站的規劃和設計、網頁設計與制作的具體技術是十分必要的。
本書是“江蘇省省級精品課程”的配套教材；它以培養職業能力為核心，以工作實踐為主線，以項目為導向，建立以工作過程為框架的現代職業教育課程結構，面向網頁設計師崗位設置課程內容。
本書教學內容同時采用模塊化的編寫思路，主要有網頁制作基礎、網站規劃與制作流程、網頁效果圖設計、網站的色彩與布局、網頁動畫的快速設計與制作、網頁的基本編輯、HTML語言的編寫、層疊樣式表的應用、框架與表格網頁布局設計、DIV十CSS布局網站、使用模板與庫制作靜態網站、靜態網站的動態化、ASP動態網頁編程、基于工作過程的英語專題學習網站教學案例、項目開發綜合實訓等教學模塊，構成了系統的課程教學內容體系，所有教學內容符合崗位需求。同時，本書以“書法家莊輝個人網站”項目貫穿始終，并以綜合教學案例鞏固了課程內容。初級網頁設計師通過本書的學習，輔助項目實訓的系統訓練，將勝任網頁設計師的崗位。
本書基于工作過程的教學思想，所有教學情境都經過了精挑細選.具有非常好的代表性，同時這些項目又包含了當前流行的創意與技術。
出版說明
前言
第1章 網頁制作基礎
1.1 情境：俞晨視覺傳奇個人主頁
1.1.1 網頁項目的制作過程
1.1.2 網頁的基本要素
1.2 網絡基本概念
1.2.1 Internet
1.2.2 萬維網介紹
1.2.3 Web瀏覽器
1.2.4 網頁與網站
1.3 網站的分類與賞析
1.3.1 網站的分類
1.3.2 優秀網站欣賞
1.4 習題
第2章 網站規劃與制作流程
2.1 情境1：淮安旅行社網站項目規劃
2.1.1 項目資訊
2.1.2 淮安旅行社網站的項目規劃
2.2 情境2：淮安旅行社網站的制作流程
2.2.1 前期策劃和內容組織
2.2.2 網站效果圖的設計制作
2.2.3 網站頁面的設計制作
2.2.4 靜態頁面的動態化
2.2.5 網站測試與發布
2.2.6 網站維護
2.3 習題
第3章 網頁效果圖設計
3.1 情境1：淮安信息職業技術學院網站歡迎頁設計
3.1.1 項目展示與項目目標
3.1.2 項目資訊
3.1.3 項目計劃與決策
3.1.4 項目實施
3.1.5 項目檢查與評估
3.1.6 強化拓展實訓：圖像的摳取
3.2 情境2：商業網站Logo設計與制作
3.2.1 項目展示與項目目標
3.2.2 項目資訊
3.2.3 項目計劃與決策
3.2.4 項目實施
3.2.5 項目檢查與評估
3.2.6 強化拓展實訓：企業Logo設計
3.3 情境3：書法家莊輝個人網站主頁效果圖設計與制作
3.3.1 項目展示與項目目標
3.3.2 項目資訊
3.3.3 項目計劃與決策
3.3.4 項目實施
3.3.5 項目檢查與評估
3.3.6 強化拓展實訓：混合模式合成圖像
3.4 情境4：淮安信息職業技術學院網站頁眉設計
3.4.1 項目展示與項目目標
3.4.2 項目資訊
3.4.3 項目計劃與決策
3.4.4 項目實施
3.4.5 項目檢查與評估
3.5 習題
第4章 網站的色彩與布局
4.1 情境：書法家莊輝個人網站模板效果圖的設計與制作
4.1.1 項目展示與項目目標
4.1.2 項目資訊
4.1.3 項目計劃與決策
4.1.4 項目實施
4.1.5 項目檢查與評估
4.1.6 強化拓展實訓：畫筆的使用技巧
4.2 習題
第5章 網頁動畫的快速設計與制作
5.1 情境1：高職高專教學工作水平評估評建網GIF動畫
5.1.1 項目展示與項目目標
5.1.2 項目資訊
5.1.3 項目計劃與決策
5.1.4 項目實施
5.1.5 項目檢查與評估
5.1.6 強化拓展實訓：廣告Banner的制作
5.2 情境2：書法家莊輝個人網站動畫的設計
5.2.1 項目展示與項目目標
5.2.2 項目資訊
5.2.3 項目計劃與決策
5.2.4 項目實施
5.2.5 項目檢查與評估
5.2.6 強化拓展實訓：制作Flash動畫
5.3 習題
第6章 網頁的基本編輯
6.1 情境：書法家莊輝個人介紹頁面的制作
6.1.1 項目展示與項目目標
6.1.2 項目資訊
6.1.3 項目計劃與決策
6.1.4 項目實施
6.1.5 項目檢查與評估
6.1.6 強化拓展實訓：制作鼠標滑過圖像的翻轉效果
6.2 習題
第7章 HTML語言的編寫
7.1 情境：高職高專教學工作評建網HTML代碼的編寫
7.1.1 項目展示與項目目標
7.1.2 項目資訊
7.1.3 項目計劃與決策
7.1.4 項目實施
7.1.5 項目檢查與評估
7.1.6 強化拓展實訓：計算機系迎評網主頁HTML代碼的編寫
7.2 習題
第8章 層疊樣式表的應用
8.1 情境：計算機科學與工程系迎評網CSS設計
8.1.1 項目展示與項目目標
8.1.2 項目資訊
8.1.3 項目計劃與決策
8.1.4 項目實施
8.1.5 項目檢查與評估
8.1.6 強化拓展實訓：莊輝個人網站樣式表設計
8.2 習題
第9章 框架與表格網頁布局設計
9.1 情境1：圖形圖像專題學習網站主頁設計
9.1.1 項目展示與項目目標
9.1.2 項目資訊
9.1.3 項目計劃與決策
9.1.4 項目實施
9.1.5 項目檢查與評估
9.1.6 強化拓展實訓：框架中超鏈接的使用
9.2 情境2：表格布局淮信科技有限公司培訓中心網站
9.2.1 項目展示與項目目標
9.2.2 項目資訊
9.2.3 項目計劃與決策
9.2.4 項目實施
9.2.5 項目檢查與評估
9.2.6 強化拓展實訓：評建網的表格布局
9.3 習題
第10章 DIV+CSS布局網站
10.1 情境：DIV+CSS布局軟件項目化綜合實訓精品課程網站
10.1.1 項目展示與項目目標
10.1.2 項目資訊
10.1.3 項目計劃與決策
10.1.4 項目實施
10.1.5 項目檢查與評估
10.1.6 強化拓展實訓：CSS代碼的優化
10.2 習題
第11章 使用模板與庫制作靜態網站
11.1 情境：軟件項目化綜合實訓精品課程網站靜態站點設計
11.1.1 項目展示與項目目標
11.1.2 項目資訊
11.1.3 項目計劃與決策
11.1.4 項目實施
11.1.5 項目檢查與評估
11.1.6 強化拓展實訓：網頁設計中的界面的借鑒與創新實例
11.2 習題
第12章 靜態網站的動態化
12.1 情境：書法家莊輝動態網站建設
12.1.1 項目展示與項目目標
12.1.2 項目資訊
12.1.3 項目計劃與決策
12.1.4 項目實施
12.1.5 項目檢查與評估
12.1.6 強化拓展實訓：項目后期完善
12.2 習題
第13章 ASP動態網頁編程
13.1 情境1：新生錄取查詢系統的實現
13.1.1 項目展示與項目目標
13.1.2 項目資訊
13.1.3 項目計劃與決策
13.1.4 項目實施
13.1.5 項目檢查與評估
13.1.6 強化拓展實訓：模糊查詢的制作
13.2 情境2：班級通訊錄管理系統的實現
13.2.1 項目展示與項目目標
13.2.2 項目資訊
13.2.3 項目計劃與決策
13.2.4 項目實施
13.2.5 項目檢查與評估
13.2.6 強化拓展實訓：簡易計數器的制作
13.3 習題
第14章 基于工作過程的英語專題學習網站教學案例
14.1 項目目標與項目展示
14.1.1 項目展示
14.1.2 項目目標
14.2 項目資訊
14.2.1 網站需求分析
14.2.2 網站風格定位
14.2.3 規劃草圖
14.3 項目計劃與決策
14.4 項目實施
14.4.1 效果圖設計
14.4.2 效果圖切片導出網頁
14.4.3 后期網頁編輯
14.4.4 動畫制作
14.4.5 動畫的使用
14.4.6 代碼融合
14.5 項目檢查與評估
14.6 強化拓展實訓：開發音頻設備專題學習網站
第15章 項目開發綜合實訓
15.1 網站開發規范
15.1.1 組建開發團隊
15.1.2 開發工具
15.1.3 網站開發流程
15.1.4 文件夾和文件的命名規范
15.1.5 網站首頁head區代碼規范
15.1.6 網站建設尺寸規范
15.2 實訓任務安排
15.3 項目進展計劃
15.4 實訓報告書
參考文獻
1.3.1 網站的分類
網頁設計者在設計網頁時，要根據站點的性質和客戶的要求，實現不同的功能和表達不同的主題，從這個任務類別上可以將網站分為以下3類：
1.資訊類網站
如新浪、網易、搜狐等門戶網站。這類網站一般會為訪問者提供大量的信息，而且訪問量較大。因此，應對這些信息進行合理地分類，將頁面劃分為多個欄目，頁面結構要合理、美觀，便于瀏覽者瀏覽。
2.形象類網站
如一些中小型公司或單位的網站。這類網站一般較小，有的只有幾頁，需要實現的功能也比較簡單，網頁設計的主要任務是宣傳企業形象。對于這類網站來說，版式、色彩、動畫設計等是項目重點，一般對美編的要求較高。
3.資訊與形象相結合的網站
如大型公司或高校的網站。這類網站在設計上要求較高，既要考慮到資訊類網站的各項功能，伺肘又要突出企業、單位的形象。
當然根據網站功能也可以分為門戶類、娛樂類、電子商務類、交易類、企業類、政府類、個人主頁類等類別。
1.3.2 優秀網站欣賞
1.門戶網站
門戶網站主要是為上網用戶提供信息搜索、網站注冊、索引、網上導航、網上社區、個人郵箱等服務并進行分類及整合服務的站點，網站信息服務往往涵蓋多個領域，依托擁有海量用戶群體的優勢來盈利。
目前不少門戶網站正在朝著專業門戶網站的方向調整，只針對某一類特定用戶群提供相應的專業信息，即逐漸演變為垂直門戶。垂直的意思就是將某一類信息做深，這也是眾多門戶網站所追求的，在強調“垂直”的同時加強“門戶”的概念。它不是簡單地追求內容的垂直深度。而是同時追求在某一專業領域內如IT、娛樂、體育等信息的全面和精確，形成在某一領域內有了定深度的專業門戶。
新書資訊