第一篇：大學生活主題靜態網頁設計范文

畢業綜合實踐報告

Graduation Synthesis Practice Report

大學生活主題靜態網頁設計

Static Webpage Design of University Class Theme

系別:計算機工程系

班級:

學生姓名:

學號:

指導老師:

完成日期:2014/4/30

第二篇：靜態網頁設計知識點

第一章 概述 4學時

教學目的：

了解網頁及網站基本概念及網頁的基本要素分析 教學重點與難點：

網頁、網站設計流程，網頁基本要素

第一節 網頁和網站

一、網頁

二、網站

三、網頁的基本功能

第二節 網頁中的主要元素

一、文本

二、圖像

三、鏈接標志

四、其他的基本要素

第三節 網頁制作工具

一、網頁編輯工具

二、網頁圖像編輯工具

三、動態網頁技術

第四節 網頁設計的基本流程

一、網站的設計流程

二、網頁的設計與制作

三、網頁的測試

四、網頁上傳和發布

第二章 HTML語言基礎 6學時

教學目的：

了解HTML文件的基本結構，掌握HTML中文本的編輯及圖像的語法，掌握HTML中各種設置超級鏈接的語法，掌握HTML中表格和框架的基本語法。

教學重點與難點：

HTML的語法結構、超級鏈接的語法、表格和框架的基本語法。

第一節 HTML概述

一、HTML簡介

二、HTML語法結構

第二節 文本的編輯

一、段落標記

二、文本標記

三、標題顯示等級

四、列表

第三節 圖像編輯

一、插入圖像

二、使用背景圖像

第四節 建立超鏈接

一、建立超鏈接

二、使用書簽

三、標記新窗口和基準鏈接

第五節 表格與框架

一、建立表格

二、表格屬性

三、建立框架

四、框架屬性

第三章 Dream weaver基礎 2學時

教學目的：

了解DW的操作界面及常用命令，掌握規劃和創建站點的操作，掌握基本的網頁操。

教學重點與難點：

規劃站點的結構、網頁的基本操作

第一節 Dream weaver 工作界面

一、啟動和退出Dreamweaver

二、Dreamweaver操作界面

第二節 規劃與創建站點

一、規劃網站的整體結構

二、建立本地站點

三、管理本地站點

第三節 網頁文件的基本操作

一、新建網頁

二、保存網頁

三、關閉網頁

四、打開網頁

五、預覽網頁

第四章 網頁中的基礎元素 4學時

教學目的：

通過本章的學習可以掌握在網頁中的文本和段落的設置方法，掌握圖像的插入及其屬性的設置的方法，熟悉頁面屬性的設置，熟悉各種超級鏈接及設置。

教學重點與難點：

文本和段落的設置文本、圖像的插入及其屬性的設置、超鏈接

第一節 在網頁中插入文本

一、插入文本

二、設置文本格式

三、段落格式的編輯

四、設置列表

五、簡單的CSS樣式應用

第二節 在網頁插入圖像

一、插入圖像

二、設置圖像屬性

三、編輯圖像

四、圖像外部編輯

五、鼠標經過圖像

六、創建導航條

第三節 插入其他網頁元素

一、水平線

二、日期和時間

第四節 設置網頁的頁面屬性

一、打開頁面屬性對話框

二、設置網頁的標題

三、設置網頁的背景

四、設置網頁的文本

五、設置網頁的邊界

第五節 設置超級鏈接

一、超鏈接的路徑

二、創建基本超鏈接

三、錨點鏈接

四、熱區鏈接

五、電子郵件鏈接

第五章 頁面布局規劃 4學時

教學目的：

學會運用表格進行數據展示及進行網頁布局，學會使用框架結構建立網頁。

教學重點與難點：

表格的插入、表格的編排和設置、利用表格進行布局

第一節 表格的基本操作

一、插入表格

二、添加內容

三、選擇表格

四、設置表格屬性

五、編輯表格的基本操作

第二節 表格布局

一、布局視圖

二、繪制布局表格和布局單元格

三、編輯布局表格和布局單元格

第三節 框架布局

一、建立框架

二、框架面板

三、設置框架的屬性

四、保存框架

五、框架中的超鏈接

第六章 網頁中的層和時間軸 2學時

教學目的：

通過教學，使學生掌握Dream weaver層的概念、層的操作方法；時間軸的概念、時間軸中各元素的功能及時間軸的常用操作方法。

教學重點與難點：

層的操作方法、時間軸操作方法

第一節 層

一、創建層

二、層的基本操作

三、層與表格的轉換

第二節 時間軸

一、認識時間軸

二、創建動畫

第七章 表單的應用 4學時

教學目的：

表單，可以收集用戶的信息和反饋意見，是網站管理者與瀏覽者之間溝通的橋梁，在本章將學習如何使用表單創建描述表單信息的網頁。

教學重點與難點： 創建表單、處理表單的方法

第一節 創建表單

一、表單概述

二、表單對象

三、插入表單

四、表單屬性

第二節 創建表單對象

一、創建文本域

二、創建復選框

三、創建單選按鈕

四、創建列表/菜單

五、創建文件域

六、創建跳轉菜單

七、創建按鈕

八、創建單選按鈕組

九、創建圖像域

第三節 處理表單

一、使用行為驗證表單

二、利用郵件傳送表單

第八章 CSS樣式使用 6學時

教學目的：

通過教學，使學生掌握CSS樣式表的基本概念，會使用CSS樣式面板。掌握創建CSS樣式表的方法，新建CSS樣式表，設置CSS樣式定義對話框，創建外部CSS樣式表，使用和編輯自定義CSS樣式表。

教學重點與難點：

新建和和應用CSS樣式表，CSS經典應用（大字、下劃線）、濾鏡的作用。

第一節 CSS樣式概述

一、認識CSS樣式

二、CSS樣式的類型

三、CSS樣式面板

第二節 使用CSS樣式

一、創建CSS樣式

二、附加外部CSS樣式

三、應用CSS樣式

四、編輯CSS樣式

五、刪除CSS樣式

第三節 CSS樣式設置

一、類型

二、背景

三、區塊

四、方框

五、邊框

六、列表

七、定位

八、擴展

第四節 CSS樣式經典實例

一、改變鼠標形狀

二、更改超鏈接的樣式

三、應用CSS濾鏡

第九章 在網頁中使用行為 2學時

教學目的：

通過教學，使學生掌握Dreamweaver中行為的概念，熟練掌握使用行為面板對行為的各種操作方法。使用Dreamweaver 的內置行為為網頁對象添加各種常用的行為。

教學重點與難點： 使用Dreamweaver 的內置行為為網頁對象添加各種常用的行為

第一節 認識行為

一、認識行為

二、使用行為面板

三、增加行為的基本步驟

四、修改行為

第二節 使用Dreamwerver內置的行為

一、播放聲音

二、打開瀏覽器窗口

三、彈出消息

四、轉到URL

五、設置狀態欄文本

六、控制Shockwave或Flash 第十章 網頁中的多媒體應用 2學時

教學目的：

通過教學，使學生掌握在Dreamweaver中插入音頻文件的方法，掌握在Dreamweaver中插入Flash文件的方法，掌握在Dreamweaver中嵌入視頻文件的方法。

教學重點與難點：

在Dreamweaver中插入音頻文件、Flash文件、嵌入視頻文件的方法。

第一節 在網頁中插入音頻

一、鏈接到音頻文件

二、在網頁中嵌入音頻文件

三、在網頁加入背景音樂

第二節 在網頁中插入Flash動畫

一、插入Flash文本

二、插入Flash按鈕

三、插入Flash動畫

第三節 在網頁中插入視頻

一、鏈接到視頻文件

二、在網頁中嵌入視頻文件

第十一章 模板和庫 1學時 教學目的：

通過教學，使學生了解模板的概念；理解歷史記錄和庫的概念；熟練掌握模板的創建和使用方法；掌握歷史記錄和庫的使用方法。

第一節 模板

一、模板的創建

二、利用模板更新網頁

第二節 庫

一、創建庫項目

二、利用庫項目更新網頁

第十二章 網站的測試與上傳 1學時

教學目的：

通過教學，使學生了解測試的目的以及測試所包含的內容；熟練掌握測試的方法；掌握HTML優化的方法；掌握上傳站點的方法。

第一節 網站的測試、發布與域名

一、網站的測試與發布

二、網站的維護

三、網站的管理

第二節 域名

一、域名的概念

二、域名的注冊

三、虛擬主機

四、整機托管

第三篇：靜態網頁設計總結報告

網頁設計總結報告

目錄

一、設計介紹.................................................................................................................2

二、制作過程............................................................................................................................3

1、布局……………………………………………………………………………………………………………………………..…3

2、相關插入……………………………………………………………………………………………………………………………..4

3、相關鏈接……………………………………………………………………………………………………………………………..4

三、制作代碼.................................................................................................................5

四、心得體會.............................................................................................................7

五、參考資料.............................................................................................................8

一、網頁設計介紹

從文件的角度來說，一個網頁就是一個HTML文件。當瀏覽者輸入一個網址或單擊某個鏈接后，在瀏覽器中顯示出來的就是一個網頁。一般網頁上都會有文本、圖片等信息，而復雜一些的網頁上還會有聲音、視頻、動畫等多媒體內容，為網頁增添了豐富的色彩和動感。靜態網頁是指網頁文件中沒有程序，只有HTML代碼，一般以.html或.htm為后綴名的網頁，靜態網站內容不會在制作完成后發生變化，任何人訪問都顯示一樣的內容。網站是一系列邏輯上可以視為一個整體的網頁集合，是許多相關網頁有機結合而組成的一個信息服務中心。對于小型網站，是指帶有一定主題的多個網頁集合；對于大型網站還包含數據庫和服務器端應用程序等如新浪、網易、搜狐等門戶網站。在構成網站的眾多網頁中，有一個頁面比較特殊，稱為首頁，即網站的設計課，與以前的課相比更加注重個人的創意能力和軟件的運用實戰能力，更加綜合的考驗了我，使我更加完善自我。現將我的作業情況匯報如下：

將理論與社會實踐相結合，通過行業生產實踐的形式，進一步了解、認識網頁藝術設計工作在實際生活中廣泛應用的表現渠道和表現方法，提高認知水平，縮短工作磨合期。根據項目課題要求，結合本專業所學網頁設計理論知識，通過對網絡廣告等方面的調研和項目實踐形成文字思路，并以自命題目設計完成多媒體網頁設計制作。兩項內容要求準確、完整，工作過程報告內容既要客觀實際又要有認識深度，設計作品新穎有創意。

我首先的工作就是制作網站整體框架和收集資料，將其通過美圖秀秀完善圖片，然后導入Dreamweaver進行排版，并進一步的加以制作，完善美化，如加 入 Flash Css。由于我在某些方面的技術運用還不能得心應手，許多情況下不得不求他人。

我經過初步的構思，我因為要做的是湖南特色美食設計，所以要有一個時光主題，我在網上自己找到一些圖片和文字，做一個簡單的網站初步積累，考慮到主要是鍛煉我們相關軟件的操作能力與代碼初步掌握的熟練成度，由于我們這段時間沒有進行網站相關的課程，剛著手時，很多技術上的問題就暴露出來了，我感覺制作網頁是需要耐心的，如果你沒有耐心，你學不好網頁設計，這是我最大的體會。因為當你碰到一個問題時，如果不能立刻得到問題的答案，你可能需要長時間去解決，我就碰到過一個問題，用了很長時間才解決，在網上查各種資

料，向同學請教。學習網頁設計需要堅持，堅持不斷的學習，因為設計網頁的軟件在不斷的更新，只有綜合運用多種知識，富于個性的頁面,才能全面展現互聯網這一新型媒體的獨特魅力和多維空間的超強功能。我完成了全部課件內容，忙碌的幾周讓大家從新熟悉制作網站的過程，由于這次課程的網頁都是靜態的，難度不算大。但收獲還是很多的。比如將你的標志盡可能的放在每個頁面上最突出的位置，突出你的標準色彩，這些就是我的經驗收獲。

參考資料：

網站建設自學資料；

百度百科。

江蘇大學

靜態網頁制作報告

學院:計算機學院

班級 :網絡1302

姓名:劉賽雄

學號:3130610036

第四篇：靜態網頁設計專業課程教學大綱（精選）

《靜態網頁設計》課程教學大綱

課程名稱（中文/英文）：靜態網頁設計

課程性質：專業基礎課必修課 適用專業：計算機科學與技術 學 時 數： 76 其中：實驗/上機學時：38 學 分 數： 4 考核方式：任務上機方式進行考核。成績構成如下：平時：40%期末：60% 先修課程：無 后續課程： 動態網頁設計、JSP 等 教學參考書：

1.溫謙，趙偉等，網頁制作綜合技術教程，人民郵電出版社，2009 2．向隅，網頁設計實用教程，北京郵電出版社，2009 3.張磊，網頁設計技術，中國鐵道出版社 2006 開課部門：計算機系計算機科學與技術教研室 課程簡介：

《靜態網頁設計》主要講解如何應用Dreamweaver創建和管理網站、網頁制作基本知識，講授Dreamweaver網頁制作集成工具使用方法等內容。本課程介紹html的基礎知識，CSS的基礎知識，以及開發WEB最流行的工具Dreamweaver的使用方法。主要包括基本html語句的語法，各種內容在網頁中的插入，表格布局，css樣式表，層的使用等。

教學目的和要求

《靜態網頁設計》是計算機科學與技術專業的一門重要專業基礎課。通過本課程學習，使學生掌握構建網站的基本知識，熟悉網頁開發平臺的使用，能夠獨立的創建個人網站。

教學重點和難點

Html中頁面標簽元素的使用，CSS樣式表的設計

教學方法

啟發式教學，引導學生通過實例獲取知識，鞏固知識。多媒體教學，機房授課 教學主要內容

第一章 網頁設計基礎知識（4學時）1.1 網頁的基礎概念 1.2 網頁與HTML 1.3 WEB標準

1.4 網頁設計與開發過程 1.5 HTML基礎 1.6 簡單的HTML案例 1.7 網頁源文件的獲取

1.8 利用Dreamweaver快速建立基本文檔 第二章 用HTML設置文本和圖像（4學時）2.1 文本排版 2.2文字列表

2.3 HTML標記與HTML屬性

2.4 HTML標記與HTML屬性的局限性 2.5 特殊文字符號 2.6 使用圖像 2.7 設置圖片的尺寸 2.8 設置圖像的替換文本

2.9 利用Dreamweaver設置文本和圖像2.10 利用Dreamweaver代碼提高效率 第三章 超鏈接（4學時）3.1 設置文字超鏈接 3.2 設置頁面內部超鏈接 3.3 設置圖片超鏈接 3.4 設置電子郵件超鏈接 3.5 設置鏈接頁面的目標窗口 3.6 創建熱點區域 3.7 框架之間的鏈接

第四章 使用表格與表單（4學時）4.1 使用表格 4.2 使用表單

4.3 Dreamweaver中的模版

第五章(X)HTML與CSS概述（4學時）5.1 HTML與 XHTML 5.2(X)HTML與CSS

5.3 構造CSS規則 5.4 基本CSS選擇器

5.5 在HTML中使用CSS的方法 第六章 CSS樣式設置實踐（6學時）6.1 手工編寫頁面

6.2 使用Dreamweave進行CSS設置 6.3 復合選擇器 6.4 CSS的繼承特性 6.5 CSS的層疊特性

第七章 用CSS設置文本和圖像（6學時）7.1 使用CSS設置文本樣式 7.2 用CSS設置圖像樣式 7.3 用CSS設置背景樣式

第八章 用CSS設置鏈接與導航菜單（6學時）8.1 豐富的超鏈接特效 8.2 控制鼠標指針 8.3 設置項目列表樣式 8.4 創建簡單的導航菜單

8.5 應用滑動門技術的玻璃效果菜單

第九章 用CSS設置表格和表單樣式（6學時）9.1 控制表格 9.2 美化表格 9.3 案例—日歷 9.4 CSS與表單

第十章 CSS盒子模型（8學時）10.1 “盒子”與“模型”的概念探究 10.2 邊框 10.3 設置內邊距 10.4 設置外邊距 10.5 盒子之間的關系

10.6 盒子在標準流中的定位原則 第十一章 盒子的浮動與定位（8學時）11.1 盒子的浮動 11.2 盒子的定位 11.3 z-index空間位置 11.4 盒子與display屬性

第十二章 CSS+div布局方法剖析（8學時）12.1 CSS排版觀念

12.2 固定寬度且居中的款式 12.3 左中右版式 12.4 塊的背景色問題

12.5 div 排版與傳統的表格方式排版的分析 案例設計（8學時）

執筆人： 魏榮華

審核人：

第五篇：靜態網頁設計與制作畢業論文

目 錄

摘 要……………………………………………………………………………………….0 第1章 緒論……………………………………………………………………………….1 1.1 INTERNET的歷史和發展…………………………………………………………….1 1.2 網頁概述................1

第2章 開發軟件簡介 6

2.1 Dreamweaver簡介 6

2.2 HTML語言的簡介 7

2.3 Flash 簡介 …………………………………………………………………… 8

2.4 Photoshop 簡介 ……………………………………………………………… 9 2.3 本章小結 14

第3章 網站需求分析 15

3.1相關術語及解釋 15

3.2個人網站的由來與發展 15

3.3我的個人網頁的設計與規劃 18

3.3.1 我的個人網頁的概貌……………………………………………………… 19

3.3.2 個人網頁的設計理念……………………………………………………… 20

3.4 本章小結 19

第4章 結論 20

致 謝 21

參考文獻 22

靜態網頁的設計與制作

摘 要

本文就網站的設計與制作，以軟件工程的方法對全過程進行了分析與研究，本文的主要工作集中在：

1.對web頁進行概述，主要是對internet的歷史和發展作了回顧，并對WEB頁的定義和特性進行闡述，并對網站設計過程中使用的工具和技術簡單的介紹.2.對網站建設中提及的術語進行簡單解釋，并對網站的由來和發展進行討論。

3.對自己設計的網站從設計理念到制作的過程進行詳細分析.4.使用Dreamweaver+Flash+photoshop 等軟件的設計方式進行解析

.5.就網站的設計與制作提出自己的觀點以及建議。

關鍵詞：網站 設計工具 設計方案 創意 風格

Static web design and production

Abstract

This website design and production, with the method of software engineering to process the analysis and research, this paper main work concentrates in:

1.The paper to web page is mainly to the Internet's history and development, and a review of the definition and characteristics of web pages is expounded, and the website design process using the tools and techniques of simple introduction.2.The website construction mentioned in terms of website, and simple explanation of the origin and development are discussed.3.For the design of your own website from design concept to making process were analyzed.4.Use Flash +Dreamweaver + photoshop software design methods are analyzed

5.Just website design and facture put forward its own views and Suggestions

第1章 緒論

隨著21世紀的到來，人們更深切地感受到計算機在生活和工作中的作用越來越重要，越來越多的職業需要具有計算機應用技能型人才。掌握計算機是職業的需要，更是事業發展的需要。網頁設計與制作是計算機能力的具體表現，本章主要介紹網頁設計的相關知識。

1.1Internet的歷史與發展

Internet最早來源于美國國防部高級研究計劃局DARPA(Defense advanced Research Projects Agency)的前身ARPA建立的ARPAnet，該網于1969年投入使用。從60年代開始，ARPA就開始向美國國內大學的計算機系和一些私人有限公司提供經費，以促進基于分組交換技術的計算機網絡的研究。1968年，ARPA為ARPAnet網絡項目立項，這個項目基于這樣一種主導思想：網絡必須能夠經受住故障 的考驗而維持正常工作，一旦發生戰爭，當網絡的某一部分因遭受攻擊而失去工作能力時，網絡的其它部分應當能夠維持正常通信。最初，ARPAnet主要用于 軍事研究目的，它有五大特點：

⑴支持資源共享；

⑵采用分布式控制技術；

⑶采用分組交換技術；

⑷使用通信控制處理機；

⑸采用分層的網絡通信協議。