Internet簡明教程(第五版)課件09.ppt

1、第09章 網(wǎng)頁制作和站點建設,如今，Internet已經(jīng)遍及社會的各個角落，上網(wǎng)已經(jīng)成為很多人日常生活的一部分。擁有自己的個人主頁，不但可以在學習或工作的相關領域與別人進行更多的交流，而且也會為自己帶來更多的發(fā)展機會。用戶只要掌握了創(chuàng)建網(wǎng)頁的相關知識，利用網(wǎng)頁制作工具軟件就可以制作出擁有精彩效果的動態(tài)多媒體網(wǎng)頁。本章將詳細介紹制作簡單的網(wǎng)頁、站點的建立、管理和發(fā)布等內容。,教學重點與難點,網(wǎng)頁設計的概述 網(wǎng)站的設計流程 創(chuàng)建和設置站點 編輯站點 申請網(wǎng)頁空間并上傳,9.1網(wǎng)頁設計概述,計算機和互聯(lián)網(wǎng)以其獨特的優(yōu)勢滲入到人們的生活中，它們已經(jīng)成為人們生活中一個重要的組成部分。若想設計與制作網(wǎng)頁，

2、必須先了解網(wǎng)頁的一些基本知識、制作網(wǎng)頁所用的軟件以及制作網(wǎng)頁的流程等，為網(wǎng)頁設計與制作打好堅實的基礎。,網(wǎng)站與網(wǎng)頁 網(wǎng)頁的基本構成元素 頁面的設計構思 網(wǎng)頁的布局 制作一個簡單的網(wǎng)頁,9.1.1網(wǎng)站與網(wǎng)頁,如今，因特網(wǎng)已經(jīng)深入到社會的各個角落，上網(wǎng)已經(jīng)成為一種時尚，而擁有自己的個人主頁，更是一份榮耀。想要學習網(wǎng)頁制作，首先要了解網(wǎng)頁和網(wǎng)站的不同概念。 所謂首頁，是指由網(wǎng)址進入時看到的第一個頁面，它是網(wǎng)站中最重要的頁面，就好比大樹的樹根，具有信息導航的作用，此外，首頁還象征著整個網(wǎng)站的風格、形象。由首頁所延伸下去的頁面，就是網(wǎng)頁了。用戶可以使用一些網(wǎng)頁制作工具軟件將這些制作成一系列HTML文檔，

3、每一個文檔用一個窗口顯示，這樣的文檔也就是網(wǎng)頁。 通常在網(wǎng)絡中的網(wǎng)站會有很多信息需要發(fā)布，需要分層次和有類別地向訪問者展示。所謂網(wǎng)站，是由首頁鏈接出去的所有網(wǎng)頁的集合 。一個網(wǎng)頁的設計者，會將某個主題確定后，再按所需的單元、內容經(jīng)過設計，轉化為不同的網(wǎng)頁，在同一個結構及訴求下出現(xiàn)的集合體，就是網(wǎng)站。,9.1.2網(wǎng)頁的基本構成元素,網(wǎng)頁由一些基本元素構成，包括文本、圖像、Flash動畫、聲音、視頻、超鏈接、導航欄、表單等。,9.1.3頁面的設計構思,在制作網(wǎng)頁時，用戶必須掌握網(wǎng)頁的設計構思方法。在網(wǎng)頁的設計構思中需要認真考慮的問題有網(wǎng)頁的主題、網(wǎng)頁的命名、色彩搭配和字體等要素。,9.1.4網(wǎng)頁的

4、布局,用戶在對網(wǎng)頁進行布局設計時，應遵循對稱平衡、異常平衡、對比、凝視和空白等原則 。, 型布局 T型布局 “三”型布局 POP布局 Flash布局,9.1.5制作一個簡單的網(wǎng)頁,本節(jié)將制作一個簡單網(wǎng)頁效果。用戶可以根據(jù)網(wǎng)頁的內容和素材，分別選取不同的工具，了解從進行基本文字處理到使用專業(yè)網(wǎng)頁編輯軟件的一系列步驟。 本例要求制作一個網(wǎng)頁布局效果。首先，用戶要創(chuàng)建一個用于保存網(wǎng)頁和網(wǎng)頁素材的文件夾，并將制作網(wǎng)頁所用到的素材文件復制到其中，以便在制作網(wǎng)頁的過程中使用。,9.2網(wǎng)站的設計流程,用戶在制作網(wǎng)站時不能隨心所欲，沒有計劃就開始動手制作，那樣往往會走很多彎路，以致最后還不得不回過頭來重新設計

5、，這樣既浪費了時間又浪費了精力。因此，在制作網(wǎng)站之前，用戶先要了解網(wǎng)站建設的基本流程，這樣才能制作出更好、更合理的網(wǎng)站 。,網(wǎng)站的規(guī)劃和設計 網(wǎng)站的建設 站點的推廣、維護和更新,9.2.1網(wǎng)站的規(guī)劃和設計,建立一個網(wǎng)站首先就要有一個好的網(wǎng)站策劃。確定網(wǎng)站的方向和功能，在網(wǎng)站建立之初，方向的確定是非常重要的。例如個人站點、企業(yè)網(wǎng)站、綜合類網(wǎng)站或者電子商務網(wǎng)站等。網(wǎng)站方向定好了，下一步就是網(wǎng)站內容、欄目版塊、素材的制定與規(guī)劃(如域名、空間、網(wǎng)站Logo等)。如果是企業(yè)或綜合網(wǎng)站，還要與企業(yè)客戶聯(lián)系并搞一些民意調查等。另外，便于記憶的域名和穩(wěn)定的空間也是網(wǎng)站成功不可缺少的要素之一。許多人在建立時忽略

6、了對網(wǎng)站主題的深思與構想，結果網(wǎng)站的內容變得十分空洞，主題也就讓訪問者不知所云了。 在確定了網(wǎng)站主題之后，下一步就是開始著手收集相關資料。無論是文字還是平面圖片、各種多媒體動畫，都可以將其收集起來以備后用。,9.2.2網(wǎng)站的建設,設計好網(wǎng)站規(guī)劃方案后就可以開始構建站點了。在用戶建設站點的過程中，需要依次完成站點網(wǎng)頁組件的制作、網(wǎng)頁的制作與測試、網(wǎng)站空間的申請和網(wǎng)站的上傳等步驟，用戶可以使用Dreamweaver CS3中一套專業(yè)的站點建設工具，實現(xiàn)網(wǎng)站建設 。,9.2.3站點的推廣、維護和更新,網(wǎng)頁上傳完畢后，并不是所有的工作就都告一段落，用戶還必須對網(wǎng)站進行推廣和經(jīng)常性的維護與更新，以保證站

7、點被更多的訪問者瀏覽和網(wǎng)頁內容新穎。 網(wǎng)站的推廣是提高網(wǎng)站點擊率、增加站點知名度的重要手段?，F(xiàn)在，在Internet上的網(wǎng)站數(shù)量數(shù)不勝數(shù)，要使更多的網(wǎng)上用戶瀏覽自己的站點，就需要通過各種途徑進行網(wǎng)站介紹與宣傳。具體方法通常有：通過電子郵件向朋友和伙伴通知網(wǎng)站的建立；通過Internet向其它用戶介紹站點；登陸各大搜索引擎網(wǎng)站(如Google和百度等)等。 網(wǎng)站的維護就是對網(wǎng)站頁面的調整和對站點內信息的更新。一個好的網(wǎng)站最重要的就是經(jīng)常的維護與更新，用戶在將網(wǎng)站推薦給更多人的同時，最好時常檢查一下整個網(wǎng)站的運作情況，時時更新修改。網(wǎng)頁編輯軟件Dreamweaver CS3針對網(wǎng)站的管理與更新，設

8、計了許多方便的功能，用戶在進行網(wǎng)頁維護時可以使用它來完成所需的工作 。,9.3創(chuàng)建和設置站點,在創(chuàng)建站點之前，用戶一般是先在本地將整個網(wǎng)站完成，然后再將站點上傳到Web服務器上。因此最好的選擇是，在開始創(chuàng)建網(wǎng)頁之前用Dreamweaver建立一個本地站點 。,創(chuàng)建本地新站點 設置本地站點 設置遠程文件夾,9.3.1創(chuàng)建本地新站點,創(chuàng)建一個本地站點最常用的方法是建立一個文件夾，在該文件夾中包含了網(wǎng)站的所有文件，并且可以在該文件夾中創(chuàng)建和剪輯文件。 啟動網(wǎng)頁編輯軟件Dreamweaver后，選擇“站點”|“新建站點”命令，打開“站點定義”對話框，使用Dreamweaver CS3的“站點定義向導”

9、(如圖所示)可以方便地創(chuàng)建新站點，按照提示逐步完成站點設置的全過程 。,9.3.2設置本地站點,本地文件夾是相對“遠程”Web服務器上的文件夾而言的，它可以位于本地計算機上，也可以位于局域網(wǎng)服務器上。當用戶設置了本地文件夾后，其實就相當于建立了一個Dreamweaver 站點，只不過是站點在“本地”而已。 要設置本地文件夾，可在打開所示的“站點定義向導”對話框后，打開“高級”選項卡，在左側的分類列表中選擇“本地信息”，在對話框右側將顯示“本地信息”的所有參數(shù)設置選項，如圖所示 。,9.3.3設置遠程文件夾,要設置站點的遠程文件夾，用戶可在打開“站點定義向導”對話框后，打開“高級”選項卡，在左側

10、的“分類”列表框中選擇“遠程信息”選項，然后在對話框右側的“訪問”下拉列表中選擇連接遠程服務器的方式即可，如圖所示。,9.4編輯站點,在完成創(chuàng)建站點的工作后，用戶可以使用Dreamweaver CS3對建立的站點進行復制、刪除和修改等操作。使用Dreamweaver不但能夠編輯本地系統(tǒng)上的現(xiàn)有站點而且能夠編輯遠程系統(tǒng)上的站點 。,編輯本地站點 使用站點地圖 編輯遠程站點 刪除站點,9.4.1 編輯本地站點,用戶可以選擇“站點” |“管理站點”命令，在打開的“管理站點”對話框中編輯本地或遠程的站點。即使用戶不能使用Dreamweaver創(chuàng)建源站點，也可以在本地硬盤上編輯現(xiàn)有的站點。,9.4.2使

11、用站點地圖,在Dreamweaver CS3中，使用站點地圖可以用圖形的方式查看站點結構，顯示網(wǎng)頁之間的鏈接關系。要顯示站點地圖，必須在此之前為站點定義一個主頁，站點主頁是站點地圖的開始點。,9.4.3編輯遠程站點,用戶可以在Dreamweaver CS3中選擇“站點”|“管理站點”命令，打開“管理站點”對話框來編輯遠程的站點。也可以將現(xiàn)有的遠程站點復制到本地磁盤上進行編輯。 有時用戶只是希望修改遠程站點上的部分內容，但也必須從遠程站點將其相關的完整目錄結構都復制到本地磁盤，包括文件夾和文件。例如，遠程站點的根目錄文件夾名為public_html，包括“項目1”和“項目2”兩個文件夾，如果用戶

12、只是想修改“項目1”文件夾中的HTML文件，就不需要下載“項目2”中的文件，但必須將本地根目錄文件夾設置為public_html，而不是“項目1”，如圖所示 。,9.3.4 刪除站點,從站點列表中刪除站點實際上只是刪除了Dreamweaver同本地站點之間的關聯(lián)，但保存在磁盤上的站點內容(包括各種文件夾和文件)并不會被刪除，必要時還可以利用其新建相同的站點。用戶如果不再需要使用Dreamweaver CS3對某個本地站點進行操作時，只需要選擇“站點”|“管理站點”命令，在“管理站點”對話框中選擇該站點名稱，然后單擊“刪除”按鈕，在打開的對話框中單擊“是”按鈕即可，如圖所示 。,9.5申請網(wǎng)頁空

13、間并上傳網(wǎng)頁,一個做好的網(wǎng)頁要正式上傳到網(wǎng)站服務器上，各地的瀏覽者才可以訪問。一般個人制作網(wǎng)頁，沒有專業(yè)的服務器，那么就需要申請免費網(wǎng)頁空間。有了網(wǎng)頁空間才能實現(xiàn)網(wǎng)頁上傳，達到給其它用戶瀏覽的目的 。,申請網(wǎng)頁空間 上傳網(wǎng)頁 網(wǎng)頁的宣傳,9.5.1申請網(wǎng)頁空間,用戶在上傳網(wǎng)頁前，首先要申請網(wǎng)頁空間。對于網(wǎng)頁空間，現(xiàn)在免費的越來越少了，大部分的空間是收費的。因此，推出收費空間服務的網(wǎng)站越來越多，價格也千差萬別，用戶可以根據(jù)需要選擇適合自己的空間服務商?？臻g一般根據(jù)不同的要求，分為靜態(tài)網(wǎng)頁空間和動態(tài)網(wǎng)頁空間，前者可以存儲普通的HTML頁面，后者可以存儲ASP、JSP等采用服務器技術的網(wǎng)頁。 通?？臻g服務商都提供FTP網(wǎng)頁上傳服務。FTP是英文File Transfer Protocol(文件傳輸協(xié)議)的縮寫。顧名思義，F(xiàn)TP就是專門用來傳輸文件的協(xié)議，也就是說通過FTP可以在Internet網(wǎng)上的任意兩臺計算機間互傳文件。對于FTP，服務商會提供一個FTP的地起址、用戶名以及密碼。使用這些信息，就可以登錄到自己的空間，