網(wǎng)頁基礎(chǔ)知識課件

第1章網(wǎng)頁設(shè)計基礎(chǔ)1.1網(wǎng)頁設(shè)計基本概念1.2網(wǎng)站開發(fā)基本流程1.3常用的網(wǎng)頁制作軟件介紹第1章網(wǎng)頁設(shè)計基礎(chǔ)1.1網(wǎng)頁設(shè)計基本概念11.1網(wǎng)頁設(shè)計基本概念1.1.1網(wǎng)站和網(wǎng)頁網(wǎng)站(Website)網(wǎng)站是指在因特網(wǎng)(Internet)上,根據(jù)一定的規(guī)則建立起來的，用于面向全世界展示特定內(nèi)容的相關(guān)網(wǎng)頁的集合。用戶可以通過網(wǎng)頁地址訪問其信息資源，獲取自己需要的資訊或者享受網(wǎng)絡(luò)服務(wù)。1.1網(wǎng)頁設(shè)計基本概念1.1.1網(wǎng)站和網(wǎng)頁2網(wǎng)站示例網(wǎng)站示例3網(wǎng)頁(Webpage)

網(wǎng)頁是由HTML或者其他語言編寫的，通過瀏覽器編譯后供用戶獲取信息的頁面，它又稱為Web頁，其中可包含文字、圖像、表格、動畫和超級鏈接等各種網(wǎng)頁元素。一個網(wǎng)站都有一個主頁作為網(wǎng)站的訪問入口，其它網(wǎng)頁則通過鏈接與主頁相連，主頁是一個網(wǎng)站中最重要的網(wǎng)頁，也是訪問最頻繁的網(wǎng)頁。它是一個網(wǎng)站的標(biāo)志，體現(xiàn)了整個網(wǎng)站的制作風(fēng)格和性質(zhì)。網(wǎng)頁(Webpage)網(wǎng)頁是由HTML或者其他語言編4

1.1.2IP地址和域名IP地址網(wǎng)絡(luò)上的每一臺主機(jī)要進(jìn)行通信必須有一個地址，稱為IP地址。目前使用的IP地址是長為32位二進(jìn)制數(shù)字，通常用“點(diǎn)分十進(jìn)制”表示，例如：?；ヂ?lián)網(wǎng)上的IP地址統(tǒng)一由國際組織NIC（NetworkInformationCenter）負(fù)責(zé)統(tǒng)一分配。1.1.2IP地址和域名IP地址5網(wǎng)頁基礎(chǔ)知識課件6域名由于IP地址是數(shù)字標(biāo)識，使用時難以記憶，因此在IP地址的基礎(chǔ)上又發(fā)展出一種符號化的地址方案——域名，來代替IP地址。域名就是常說的網(wǎng)址，它也具有惟一性，如、等就是一個域名，訪問時，域名將通過域名服務(wù)器轉(zhuǎn)換成IP地址。域名7

1.1.3瀏覽器和Web服務(wù)器瀏覽器(Browser)瀏覽器是一個用于與互聯(lián)網(wǎng)中的服務(wù)器建立連接并與之進(jìn)行通信的客戶端程序。用于顯示HTML文檔（即網(wǎng)頁）的內(nèi)容，這些網(wǎng)頁通常存放于Web服務(wù)器中。常見的瀏覽器有IE、Firefox、Chrome等，國內(nèi)廠商開發(fā)的瀏覽器，如搜狗瀏覽器、騰訊瀏覽器、360瀏覽器等，也比較常用。1.1.3瀏覽器和Web服務(wù)器瀏覽器(Browser)8網(wǎng)頁示例網(wǎng)頁示例9Web服務(wù)器(Server)Web服務(wù)器用于存放客戶需要瀏覽的大量網(wǎng)頁文件，還存放了一些與客戶端交互時需要執(zhí)行的程序代碼。

WWW的工作模式：用戶通過“瀏覽器”向Web服務(wù)器發(fā)出網(wǎng)頁請求，Web服務(wù)器根據(jù)客戶端的請求內(nèi)容，將保存在Web服務(wù)器中的某個網(wǎng)頁返回給客戶端。瀏覽器接收到網(wǎng)頁后對其進(jìn)行解釋，最終將圖、文、聲并茂的畫面呈現(xiàn)給用戶。Web服務(wù)器(Server)10WWW的“客戶/服務(wù)器”工作模式WWW的“客戶/服務(wù)器”工作模式11

1.1.4統(tǒng)一資源定位符URLURL

URL（UniformResourceLocator）就是通常所說的網(wǎng)址，是指信息資源在Internet上的唯一地址，它提供在Web上訪問資源的唯一方式和路徑。URL通常由協(xié)議類型、網(wǎng)頁所在的計算機(jī)、網(wǎng)頁文件路徑和文件名等部分組成。1.1.4統(tǒng)一資源定位符URLURL12URL的格式<通信協(xié)議>://<主機(jī)>[:端口]/<路徑>/<文件名> 例：新浪網(wǎng)址/index.htm訪問的主頁的路徑和文件名主機(jī)名通信協(xié)議URL的格式訪問的主頁的路徑和文件名主機(jī)名通信協(xié)議13

1.1.5超文本和超鏈接超文本

Internet上的信息都可以有機(jī)地聯(lián)系起來，從而形成了一種“立體”的閱讀結(jié)構(gòu)，這就不同于順序閱讀的普通文本，所以被稱為“超文本(HyperText)”。1.1.5超文本和超鏈接超文本14超鏈接(Hyperlink)是指從一個網(wǎng)頁指向一個目標(biāo)的連接關(guān)系，這個目標(biāo)可以是另一個網(wǎng)頁，也可以是相同網(wǎng)頁上的不同位置，還可以是一個圖片、電子郵件地址、文件或應(yīng)用程序。超級鏈接是網(wǎng)頁中最常用的元素之一，網(wǎng)頁就是通過無數(shù)的超級鏈接才能組成一個網(wǎng)站。網(wǎng)頁基礎(chǔ)知識課件15網(wǎng)頁示例網(wǎng)頁示例16

1.1.6超文本標(biāo)記語言(HTML)超文本標(biāo)記語言HTML，是用于描述網(wǎng)頁文檔的一種標(biāo)記語言，它通過標(biāo)記符號來標(biāo)記要顯示的網(wǎng)頁中的各個部分。網(wǎng)頁文件本身是一種文本文件，通過在文本文件中添加標(biāo)記符，可以告訴瀏覽器如何顯示其中的內(nèi)容。用HTML語言編寫的網(wǎng)頁文件的擴(kuò)展名一般為“.htm”或“.html”。1.1.6超文本標(biāo)記語言(HTML)超文本標(biāo)記語言HTM17網(wǎng)頁基礎(chǔ)知識課件18

1.2網(wǎng)站開發(fā)基本流程1.網(wǎng)站策劃2.網(wǎng)站設(shè)計3.測試、發(fā)布和維護(hù)1.2網(wǎng)站開發(fā)基本流程1.網(wǎng)站策劃2.網(wǎng)站設(shè)計3.測試、19

1.2.1網(wǎng)站策劃在建立網(wǎng)站前應(yīng)明確建設(shè)網(wǎng)站的目的、網(wǎng)站的功能、網(wǎng)站規(guī)模、投入費(fèi)用等。網(wǎng)站策劃對網(wǎng)站建設(shè)起到計劃和指導(dǎo)的作用，對網(wǎng)站的內(nèi)容和維護(hù)起到定位作用。網(wǎng)站策劃包括以下3部分內(nèi)容。1．市場分析2．網(wǎng)站目的及功能定位3．網(wǎng)站技術(shù)解決方案1.2.1網(wǎng)站策劃在建立網(wǎng)站前應(yīng)明確建設(shè)網(wǎng)站的目的20

1.2.2網(wǎng)站設(shè)計網(wǎng)站策劃之后，就是對網(wǎng)站進(jìn)行規(guī)劃設(shè)計和網(wǎng)頁制作。1．站點(diǎn)規(guī)劃 -網(wǎng)站服務(wù)對象 -網(wǎng)站主題 -目錄結(jié)構(gòu) -整體風(fēng)格和創(chuàng)意2．搜集素材3．制作網(wǎng)頁1.2.2網(wǎng)站設(shè)計網(wǎng)站策劃之后，就是對網(wǎng)站進(jìn)行規(guī)劃21

1.2.3網(wǎng)站測試、發(fā)布和維護(hù)網(wǎng)站設(shè)計制作完畢，在發(fā)布到Internet上之前，必須要對它進(jìn)行測試，測試是在瀏覽器中進(jìn)行的，測試的內(nèi)容包括瀏覽器的兼容性，文檔之間的鏈接正確與否等方面。1.2.3網(wǎng)站測試、發(fā)布和維護(hù)網(wǎng)站設(shè)計制作完畢，在22

1.3常用的網(wǎng)頁制作軟件DreamweaverFrontpageFlash

Photo