項目一創(chuàng)建你的第一個網(wǎng)站..

1、項目一項目一 創(chuàng)建你的第一個網(wǎng)站創(chuàng)建你的第一個網(wǎng)站第 2 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理n 項目簡介項目簡介 Dreamweaver CS3提供了強大的網(wǎng)頁制作功能，所見即所得的提供了強大的網(wǎng)頁制作功能，所見即所得的操作界面使那些掌握了文檔編輯能力的人可以輕松完成一張網(wǎng)頁的制操作界面使那些掌握了文檔編輯能力的人可以輕松完成一張網(wǎng)頁的制作。建立站點是制作網(wǎng)頁的第一步，要學會制作網(wǎng)頁，掌握站點建立作。建立站點是制作網(wǎng)頁的第一步，要學會制作網(wǎng)頁，掌握站點建立和編輯的方法尤為重要，所有的網(wǎng)頁都是基于站點建立的。和編輯的方法尤為重要，所有的網(wǎng)頁都是基于站點建立的。 通過鑒賞各類網(wǎng)頁和網(wǎng)站，領(lǐng)

2、略不同網(wǎng)站的布局與風格，然后動通過鑒賞各類網(wǎng)頁和網(wǎng)站，領(lǐng)略不同網(wǎng)站的布局與風格，然后動手建立一個簡單的手建立一個簡單的“個人網(wǎng)站個人網(wǎng)站”的站點，讓學生們了解的站點，讓學生們了解Dreamweaver CS3軟件的操作界面；并且通過具體的實例讓學生掌軟件的操作界面；并且通過具體的實例讓學生掌握站點素材及其制作工具的有關(guān)知識，合理規(guī)劃網(wǎng)站，掌握站點的建握站點素材及其制作工具的有關(guān)知識，合理規(guī)劃網(wǎng)站，掌握站點的建立立。第 3 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理n 項目目標項目目標 本項目以規(guī)劃本項目以規(guī)劃“我的個人網(wǎng)站我的個人網(wǎng)站”為例，讓學生了解為例，讓學生了解Dreamweaver C

3、S3的界面、掌握軟件的基本操作方法，了解網(wǎng)頁設(shè)的界面、掌握軟件的基本操作方法，了解網(wǎng)頁設(shè)計的基本概念，掌握站點的建立和管理，能夠根據(jù)要求建立和管理站計的基本概念，掌握站點的建立和管理，能夠根據(jù)要求建立和管理站點；掌握簡單網(wǎng)頁制作最基本的步驟點；掌握簡單網(wǎng)頁制作最基本的步驟。第 4 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理n 工作任務(wù)工作任務(wù)n 鑒賞網(wǎng)頁鑒賞網(wǎng)頁n 初識初識Dreamweaver CS3n 建立與管理站點建立與管理站點第 5 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理模塊一模塊一 鑒賞網(wǎng)頁鑒賞網(wǎng)頁學習目標學習目標 鑒賞各種不同的網(wǎng)頁，從中感受不同類別的網(wǎng)站的風格與特色鑒賞各種不

4、同的網(wǎng)頁，從中感受不同類別的網(wǎng)站的風格與特色。從而了解網(wǎng)站發(fā)展的歷史與現(xiàn)狀，并熟悉了解一些網(wǎng)站的相關(guān)基礎(chǔ)。從而了解網(wǎng)站發(fā)展的歷史與現(xiàn)狀，并熟悉了解一些網(wǎng)站的相關(guān)基礎(chǔ)知識知識。 第 6 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理任務(wù)一：鑒賞網(wǎng)頁；任務(wù)一：鑒賞網(wǎng)頁； 1、網(wǎng)站與網(wǎng)頁、網(wǎng)站與網(wǎng)頁（1）網(wǎng)頁是）網(wǎng)頁是Internet中最基本的信息單位，是構(gòu)成網(wǎng)站的基本元素，是中最基本的信息單位，是構(gòu)成網(wǎng)站的基本元素，是把文字、圖形、聲音及動畫等各種多媒體信息相互鏈接起來的一種信把文字、圖形、聲音及動畫等各種多媒體信息相互鏈接起來的一種信息表達方式，是承載各種網(wǎng)站應(yīng)用的平臺。通常情況下，網(wǎng)頁中有文息表達

5、方式，是承載各種網(wǎng)站應(yīng)用的平臺。通常情況下，網(wǎng)頁中有文字和圖像等基本信息，有些網(wǎng)頁中還有聲音、視頻和動畫等多媒體內(nèi)字和圖像等基本信息，有些網(wǎng)頁中還有聲音、視頻和動畫等多媒體內(nèi)容。網(wǎng)頁一般由網(wǎng)站容。網(wǎng)頁一般由網(wǎng)站LOGO、廣告欄、導(dǎo)航欄和信息欄等部分組成、廣告欄、導(dǎo)航欄和信息欄等部分組成。 在訪問一個網(wǎng)站時，首先映入眼簾的網(wǎng)頁一般稱為網(wǎng)站的首頁。在訪問一個網(wǎng)站時，首先映入眼簾的網(wǎng)頁一般稱為網(wǎng)站的首頁。首頁只是網(wǎng)頁的開場頁，單擊首頁上的文字或圖片，即可打開網(wǎng)站的首頁只是網(wǎng)頁的開場頁，單擊首頁上的文字或圖片，即可打開網(wǎng)站的主頁，而首頁也隨之關(guān)閉。主頁，而首頁也隨之關(guān)閉。第 7 頁中小型網(wǎng)站建設(shè)與管理

6、中小型網(wǎng)站建設(shè)與管理n 首頁首頁第 8 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理n 主頁主頁第 9 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理 （2）網(wǎng)站根據(jù)內(nèi)容形式與功能結(jié)構(gòu)的不同，基本可以分成）網(wǎng)站根據(jù)內(nèi)容形式與功能結(jié)構(gòu)的不同，基本可以分成9大類別：大類別：資訊門戶類網(wǎng)站、企業(yè)品牌類網(wǎng)站、交易類網(wǎng)站、社區(qū)網(wǎng)站、辦公及資訊門戶類網(wǎng)站、企業(yè)品牌類網(wǎng)站、交易類網(wǎng)站、社區(qū)網(wǎng)站、辦公及政府機構(gòu)網(wǎng)站、互動游戲網(wǎng)站、有償資訊類網(wǎng)站、功能性網(wǎng)站和綜合政府機構(gòu)網(wǎng)站、互動游戲網(wǎng)站、有償資訊類網(wǎng)站、功能性網(wǎng)站和綜合類網(wǎng)站等。類網(wǎng)站等。第 10 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理2、網(wǎng)站的風格與布、網(wǎng)站

7、的風格與布局局 網(wǎng)頁的風格是指網(wǎng)站給瀏覽者的整體形象，包括站點的網(wǎng)頁的風格是指網(wǎng)站給瀏覽者的整體形象，包括站點的CI（標（標志、色彩和字體）、版面布局、瀏覽方式、交互性、文字、內(nèi)容及網(wǎng)志、色彩和字體）、版面布局、瀏覽方式、交互性、文字、內(nèi)容及網(wǎng)站榮譽等諸多因素站榮譽等諸多因素。 常見的網(wǎng)頁的布局有常見的網(wǎng)頁的布局有“國國”字形布局、字形布局、“匡匡”字形布局、字形布局、“三三”字形布局、字形布局、“川川”字形布局、封面型布局、字形布局、封面型布局、Flash布局、標題文本布局、標題文本型布局、框架型布局和變化型布局等型布局、框架型布局和變化型布局等。第 11 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建

8、設(shè)與管理任務(wù)二任務(wù)二 學習相關(guān)概學習相關(guān)概1因特網(wǎng)因特網(wǎng) 因特網(wǎng)（因特網(wǎng)（Internet）又稱為互聯(lián)網(wǎng)，是一個把分布于世界各地的）又稱為互聯(lián)網(wǎng)，是一個把分布于世界各地的計算機用傳輸介質(zhì)互相連接起來的網(wǎng)絡(luò)。計算機用傳輸介質(zhì)互相連接起來的網(wǎng)絡(luò)。Internet主要提供的服務(wù)有主要提供的服務(wù)有萬維網(wǎng)（萬維網(wǎng)（WWW）、文件傳輸協(xié)議（）、文件傳輸協(xié)議（FTP）、電子郵件（）、電子郵件（E-mail）及）及遠程登錄（遠程登錄（Telnet）等）等。2萬維網(wǎng)萬維網(wǎng) 萬維網(wǎng)（萬維網(wǎng)（World Wide Web）簡稱）簡稱WWW或者或者3W，它是無數(shù)個網(wǎng)，它是無數(shù)個網(wǎng)絡(luò)站點和網(wǎng)頁的集合絡(luò)站點和網(wǎng)頁的集合。

9、 也是也是Internet提供的最主要的服務(wù)，它是由多媒體鏈接而形成的提供的最主要的服務(wù)，它是由多媒體鏈接而形成的集合，通常上網(wǎng)看到的就是萬維網(wǎng)的內(nèi)容集合，通常上網(wǎng)看到的就是萬維網(wǎng)的內(nèi)容。第 12 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理3瀏覽器瀏覽器 瀏覽器是指互聯(lián)網(wǎng)上的文本文檔（或其他類型的文件）翻譯成瀏覽器是指互聯(lián)網(wǎng)上的文本文檔（或其他類型的文件）翻譯成網(wǎng)頁，并讓用戶與這些文件交互的一種軟件工具，主要用于查看網(wǎng)頁網(wǎng)頁，并讓用戶與這些文件交互的一種軟件工具，主要用于查看網(wǎng)頁的內(nèi)容。目前最常用的瀏覽器有兩種：美國微軟公司的的內(nèi)容。目前最常用的瀏覽器有兩種：美國微軟公司的Internet E

10、xplorer，美國網(wǎng)景公司的，美國網(wǎng)景公司的Netscape Navigator。此外，國內(nèi)的網(wǎng)。此外，國內(nèi)的網(wǎng)絡(luò)公司也開發(fā)了一些瀏覽器，比如騰訊公司推出了新一代的網(wǎng)絡(luò)瀏覽絡(luò)公司也開發(fā)了一些瀏覽器，比如騰訊公司推出了新一代的網(wǎng)絡(luò)瀏覽器，騰訊瀏覽器正式從器，騰訊瀏覽器正式從QQ里剝離出來，成為一個獨立的工具，騰訊里剝離出來，成為一個獨立的工具，騰訊瀏覽器與瀏覽器與QQ一樣擁有一個親切而且朗朗上口的名字一樣擁有一個親切而且朗朗上口的名字騰訊騰訊TT，等，等等。等。第 13 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理4電子郵件電子郵件 電子郵件又稱電子郵件又稱E-mail，是目前，是目前Inter

11、net上使用最多、最受歡迎的上使用最多、最受歡迎的一種服務(wù)。電子郵件是利用計算機網(wǎng)絡(luò)的電子通信功能傳送信件、單一種服務(wù)。電子郵件是利用計算機網(wǎng)絡(luò)的電子通信功能傳送信件、單據(jù)、資料等電子媒體信息的通信方式，它最大的特點是人們可以在任據(jù)、資料等電子媒體信息的通信方式，它最大的特點是人們可以在任何地方、時間收發(fā)信件，大大提高了工作效率，為辦公自動化、商業(yè)何地方、時間收發(fā)信件，大大提高了工作效率，為辦公自動化、商業(yè)活動提供了很大的便利。活動提供了很大的便利。5URL URL（Uniform Resource Locator）即統(tǒng)一資源定位器，也就）即統(tǒng)一資源定位器，也就是網(wǎng)絡(luò)地址，是在是網(wǎng)絡(luò)地址，是在

12、Internet上用來描述信息資源，并將上用來描述信息資源，并將Internet提供提供的服務(wù)統(tǒng)一編址的系統(tǒng)。簡單的來說，通常在的服務(wù)統(tǒng)一編址的系統(tǒng)。簡單的來說，通常在IE瀏覽器或瀏覽器或Netscape瀏覽器中輸入的網(wǎng)址就是瀏覽器中輸入的網(wǎng)址就是URL的一種。的一種。第 14 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理模塊二模塊二 初識初識Dreamweaver CS3學習目標學習目標 了解網(wǎng)頁設(shè)計的基本概念，掌握了解網(wǎng)頁設(shè)計的基本概念，掌握Dreamweaver CS3工作界面的工作界面的操作和設(shè)置操作和設(shè)置.第 15 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理任務(wù)任務(wù)一、初識一、初識Dr

13、eamweaver CS31安裝并啟動安裝并啟動 （1）安裝）安裝Dreamweaver CS3后，雙擊桌面圖標或者單擊后，雙擊桌面圖標或者單擊“開始開始程程序序Adobe Dreamweaver CS3”。 （2）進入）進入Dreamweaver CS3后，首先顯示其起始頁，通過起始頁可后，首先顯示其起始頁，通過起始頁可以直接打開最近使用過的文檔或其他文檔，也可以創(chuàng)建新文檔以直接打開最近使用過的文檔或其他文檔，也可以創(chuàng)建新文檔2.工作界面工作界面 （1）當在起始頁中單擊）當在起始頁中單擊“新建新建”列的第一項列的第一項“HTML”后，將會創(chuàng)建后，將會創(chuàng)建一個一個“.html”格式的新文檔，并

14、進入格式的新文檔，并進入Dreamweaver CS3工作界面，工作界面，如圖所示。如圖所示。第 16 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理菜單欄菜單欄標題欄標題欄“插入插入”欄欄“文檔文檔”工具欄工具欄文檔標簽文檔標簽面板組面板組屬性屬性面板面板標簽選擇器標簽選擇器狀態(tài)欄狀態(tài)欄第 17 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理 （2）由上圖可以看出，）由上圖可以看出，Dreamweaver CS3的工作界面由標題欄、菜的工作界面由標題欄、菜單欄、單欄、“插入插入”欄、欄、“文檔文檔”工具欄、文檔窗口、狀態(tài)欄、工具欄、文檔窗口、狀態(tài)欄、“屬性屬性”面板和面板組等組成。面板和面板組等組成

15、。3面板基本操作面板基本操作 （1）Dreamweaver CS3的工作界面并不是一成不變的，可根據(jù)實的工作界面并不是一成不變的，可根據(jù)實際需要，對其進行各種調(diào)整。例如，要關(guān)閉所有面板和面板組，可按際需要，對其進行各種調(diào)整。例如，要關(guān)閉所有面板和面板組，可按【F4】鍵；再次按【】鍵；再次按【F4】鍵，可恢復(fù)原來狀態(tài)?！挎I，可恢復(fù)原來狀態(tài)。 （2）如果要打開或關(guān)閉某個面板，可單擊）如果要打開或關(guān)閉某個面板，可單擊“窗口窗口”菜單下的相應(yīng)選菜單下的相應(yīng)選項。例如，可選擇項。例如，可選擇“窗口窗口文件文件”菜單打開或關(guān)閉菜單打開或關(guān)閉“文件文件”面板。另面板。另外，如果面板組包含了多個面板，則可以在

16、打開面板組后，通過單擊外，如果面板組包含了多個面板，則可以在打開面板組后，通過單擊面板標簽在各面板之間切換。例如，對于面板標簽在各面板之間切換。例如，對于“文件文件”面板組，可以通過面板組，可以通過單擊單擊“文件文件”和和“資源資源”標簽在兩個面板之間切換。標簽在兩個面板之間切換。第 18 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理 （3）面板組不僅可以關(guān)閉，還可以根據(jù)需要將它們?nèi)我庖苿雍碗[藏。）面板組不僅可以關(guān)閉，還可以根據(jù)需要將它們?nèi)我庖苿雍碗[藏。 （4）單擊面板組名稱左側(cè)的三角符號）單擊面板組名稱左側(cè)的三角符號 ,可將面板組隱藏，并且可將面板組隱藏，并且 符號變符號變?yōu)闉?符號，此時單擊

17、符號，此時單擊 符號，可以重新顯示隱藏的面板組。符號，可以重新顯示隱藏的面板組。 （5）單擊面板組右上角的）單擊面板組右上角的 符號，在彈出的菜單中選擇符號，在彈出的菜單中選擇“關(guān)閉面板組關(guān)閉面板組”，可關(guān)閉面板組。，可關(guān)閉面板組。 （6）單擊面板區(qū)域左側(cè)）單擊面板區(qū)域左側(cè) 的符號，可隱藏整個面板區(qū)域，并且的符號，可隱藏整個面板區(qū)域，并且 符號變?yōu)榉栕優(yōu)?符號；如要重新顯示面板區(qū)域，可單擊符號；如要重新顯示面板區(qū)域，可單擊 符號。符號。第 19 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理4.網(wǎng)頁文檔基本操作網(wǎng)頁文檔基本操作（1）要新建網(wǎng)頁文檔，可選擇）要新建網(wǎng)頁文檔，可選擇“文件文件新建新建

18、”菜單，打開菜單，打開“新建文檔新建文檔”對話框。在左側(cè)的對話框。在左側(cè)的“文檔類型文檔類型”列表中選擇第一項列表中選擇第一項“空白頁空白頁”，在，在“頁面類型頁面類型”列表中選擇列表中選擇“HTML”，在，在“布局布局”列表中選擇列表中選擇“無無”。（2）設(shè)置完后單擊）設(shè)置完后單擊“創(chuàng)建創(chuàng)建”按鈕，就創(chuàng)建了一個默認為按鈕，就創(chuàng)建了一個默認為“Untitled-1”的新文檔。的新文檔。第 20 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理 （3）要保存網(wǎng)頁文檔，可選擇）要保存網(wǎng)頁文檔，可選擇“文件文件保存保存”菜單，或按【菜單，或按【Ctrl+S】組合鍵，彈出組合鍵，彈出“另存為另存為”對話框，

19、在該對話框的對話框，在該對話框的“保存在保存在”下拉列表下拉列表中選擇保存文檔的文件夾，在中選擇保存文檔的文件夾，在“文件名文件名”編輯框中輸入文檔名。設(shè)置編輯框中輸入文檔名。設(shè)置完后單擊完后單擊“保存保存”按鈕，就將文檔保存在了選擇的文件夾中。按鈕，就將文檔保存在了選擇的文件夾中。 （4）關(guān)閉文檔的操作相當簡單，只需要單擊相應(yīng)文檔右上方的）關(guān)閉文檔的操作相當簡單，只需要單擊相應(yīng)文檔右上方的“關(guān)閉關(guān)閉”按鈕按鈕 （或按【（或按【Ctrl+W】組合鍵）即可。執(zhí)行該操作時，如果文檔】組合鍵）即可。執(zhí)行該操作時，如果文檔已被修改，系統(tǒng)會彈出提示框，詢問是否保存修改。如果文檔未命名已被修改，系統(tǒng)會彈出

20、提示框，詢問是否保存修改。如果文檔未命名，此時系統(tǒng)還會打開，此時系統(tǒng)還會打開“另存為另存為”對話框，提示用戶命名文檔。對話框，提示用戶命名文檔。第 21 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理模塊三模塊三 建立與管理站點建立與管理站點學習目標學習目標 通過本模塊的學習掌握站點的建立和管理，并使同學們能夠根通過本模塊的學習掌握站點的建立和管理，并使同學們能夠根據(jù)不同的要求建立和管理站點據(jù)不同的要求建立和管理站點。第 22 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理任務(wù)一任務(wù)一 建立與管理站點建立與管理站點1、確立站點目錄結(jié)構(gòu)、確立站點目錄結(jié)構(gòu)2、建立站點、建立站點 （1）首先在本地磁盤上創(chuàng)建

21、一個文件夾，并重命名文件夾為你需要）首先在本地磁盤上創(chuàng)建一個文件夾，并重命名文件夾為你需要的名稱（此處為的名稱（此處為“mysite”），將其作為站點根文件夾。），將其作為站點根文件夾。 （2）啟動）啟動Dreamweaver CS3后，選擇后，選擇“站點站點新建站點新建站點”菜單，菜單，打開打開“未命名站點未命名站點1的站點定義為的站點定義為”對話框，單擊對話框，單擊“基本基本”選項卡，選項卡，在上面的編輯框中輸入在上面的編輯框中輸入“mysite”作為站點名稱，然后單擊作為站點名稱，然后單擊“下一步下一步”按鈕。按鈕。 （3）由于我們創(chuàng)建的是靜態(tài)網(wǎng)站，因此，在接著彈出的對話框中選）由于我們

22、創(chuàng)建的是靜態(tài)網(wǎng)站，因此，在接著彈出的對話框中選擇擇“否，我不想使用服務(wù)器技術(shù)否，我不想使用服務(wù)器技術(shù)”單選按鈕，然后點擊單選按鈕，然后點擊“下一步下一步”按按鈕。鈕。第 23 頁中小型網(wǎng)站建設(shè)與管理中小型網(wǎng)站建設(shè)與管理 （4）在接下來彈出的對話框中選擇）在接下來彈出的對話框中選擇“編輯我的計算機編輯我的計算機”單選按單選按鈕，單擊鈕，單擊“您將把您將把”編輯框后的文件夾圖標，在打開的選擇根文編輯框后的文件夾圖標，在打開的選擇根文件夾對話框中選擇站點文件夾，然后單擊件夾對話框中選擇站點文件夾，然后單擊“選擇選擇”按鈕。按鈕。 （5）回到）回到“mysite的站點定義為的站點定義為”對話框，單擊對話框，單擊“下一步下一步”按鈕，按鈕，由于現(xiàn)在只是在本地編寫和調(diào)試網(wǎng)頁，故不需要連接到遠程服務(wù)器，由于現(xiàn)在只是在本地編寫和調(diào)試網(wǎng)頁，故不需要連接到遠程服務(wù)器，在在“您如