第一講 網(wǎng)站建設及相關技術

網(wǎng)頁設計與網(wǎng)站建設

第一講網(wǎng)站建設院(系):計算機科學與技術學院研究室:軟件支持技術教師:王紅濱1/11/20231學習目標了解網(wǎng)絡的一些常用術語。了解網(wǎng)頁的基本要素。了解網(wǎng)站建設的基本流程。1/11/20232內(nèi)容概述1.常用術語2.網(wǎng)頁要素3.網(wǎng)站建設流程本章將介紹網(wǎng)絡、網(wǎng)站和網(wǎng)頁的一些基本知識，為后續(xù)內(nèi)容的學習奠定一個初步基礎。1/11/20233內(nèi)容概述1.常用術語2.網(wǎng)頁要素3.網(wǎng)站建設流程本章將介紹網(wǎng)絡、網(wǎng)站和網(wǎng)頁的一些基本知識，為后續(xù)內(nèi)容的學習奠定一個初步基礎。1/11/202341.常用術語1.1Internet1.2Intranet1.3ISP1.4IP1.5域名1.6網(wǎng)站1.7URI1.8FTP1.9WWW1.10超級文本1.11HTML1.12ASP1.13VBScript和JavaScript1/11/202351.1Internet

Internet也稱因特網(wǎng)或國際互聯(lián)網(wǎng)，是20世紀70年代由美國軍方的ARPAnet（阿帕網(wǎng)，由美國高等研究計劃署（AdvancedResearchProjectAgency）創(chuàng)立）發(fā)展而來的。Internet是一個由各種不同類型和規(guī)模并各自獨立運行和管理的計算機網(wǎng)絡組成的覆蓋全球范圍內(nèi)的龐大網(wǎng)絡，網(wǎng)絡間可以暢通無阻地交換信息。組成Internet的計算機網(wǎng)絡包括局域網(wǎng)（LAN）、地域網(wǎng)（MAN）和廣域網(wǎng)（WAN）等。這些網(wǎng)絡通過普通電話線、高速率專用線路、衛(wèi)星、微波和光纜等通訊線路，把不同地域的大學、公司、科研機構以及軍事、政府等組織的網(wǎng)絡連接起來。Internet為人們提供了巨大且不斷增長的信息資源和服務工具寶庫，用戶可以利用其提供的各種工具去獲取這些信息資源和服務。也可以通過Internet將個人或企業(yè)部門的信息發(fā)布出去，供其他用戶訪問瀏覽。1/11/202361.2Intranet

Intranet也稱企業(yè)內(nèi)部互聯(lián)網(wǎng)，用于在公司或組織內(nèi)傳遞和處理信息。是Internet技術在企業(yè)內(nèi)部或封閉的用戶群內(nèi)的應用，也是一個公司或組織所特有的（不一定與Internet有物理上的連接關系）網(wǎng)絡。它可以用于提供文檔分發(fā)、軟件發(fā)布、訪問數(shù)據(jù)庫和培訓等服務。雖然Intranet也使用了如Web頁（網(wǎng)頁）、Web瀏覽器、FTP站點、電子郵件、新聞組和郵件列表等與Internet相關的應用程序，但它的作用范圍僅限定于公司或組織內(nèi)部。1/11/20237Intranet定義、涵義與Internet區(qū)別Intranet是利用各項技術建立起來的企業(yè)內(nèi)部信息網(wǎng)絡。這個概念包含以下兩方面的涵義:一是Intranet是一種企業(yè)內(nèi)部的計算機信息網(wǎng)絡,這是它與Internet的重要區(qū)別之一;二是Intranet繼承和發(fā)展了Internet的許多技術,主要有WWW、電子郵件、數(shù)據(jù)庫和網(wǎng)絡操作系統(tǒng)等各項技術。Internet與Intranet的區(qū)別主要表現(xiàn)在:1.Internet是公眾網(wǎng),任何人都可以從任意節(jié)點登錄上去并訪問整個網(wǎng)絡的信息;2.Intranet則是內(nèi)部網(wǎng),不僅被防火墻與Internet分隔開來,而且內(nèi)部通常還有嚴密的安全體系,未授權的用戶無法訪問其中的信息。1/11/202381.3ISP

ISP（InternetServiceProvider）是Internet服務提供商。用戶只有通過ISP才能接入Internet，并享受各種服務。ISP作為提供接入服務的中介，租用國際信道和大量的當?shù)仉娫捑€，購置一系列計算機設備，通過集中使用、分散壓力的方式，向本地用戶提供接入服務。1/11/202391.4IP

IP地址是Internet上主機地址的數(shù)字形式，與主機的域名地址是一一對應的。IP地址是一個32位的二進制數(shù)，通常寫成被點分開的4個十進制數(shù)的形式，例如：等。IP地址通常分為A、B、C三類，這種分類與IP地址中字節(jié)的使用方法相關。在實際應用中，可以根據(jù)具體情況選擇IP地址的類型格式。A、B、C三類地址所能表示的范圍分別是：A類“-55”，B類“-55”，C類“-55”。IP地址和域名地址就像平時生活中的通信地址一樣，不能隨意分配，否則將會導致無法估計的混亂狀態(tài)。在需要IP地址或域名地址時，用戶必須向國際網(wǎng)絡信息中心提出申請。申請批準后，凡能夠使用Internet域名的地方都可以使用IP地址。1/11/2023101.5域名

互聯(lián)網(wǎng)上的站點就像人們生活中的機構或家庭一樣，需要有個具體的地址，網(wǎng)民才能根據(jù)這個地址進行訪問。由于Internet計算機的身份標識是IP地址，為了便于記憶，按照一定的規(guī)則給Internet上的計算機起的名字就叫做域名。按照Internet的組織模式，對域名進行分級，一級域名主要有以下幾種：.com（商業(yè)組織）.net（網(wǎng)絡中心）.edu（教育機構）.gov（政府部門）.mil（軍事機構）.org（國際組織）大部分國家和地區(qū)都擁有自己獨立的域名，例如：.cn（中國）、.us（美國）、.uk（英國）、.hk（香港）等。1/11/2023111.6網(wǎng)站

網(wǎng)站是一種通過互聯(lián)網(wǎng)相互連接起來的，為用戶提供網(wǎng)頁服務（WebServer）、數(shù)據(jù)傳輸服務（FTPServer）、郵件服務（MailServer）、數(shù)據(jù)庫服務（DatabaseServer）等多種服務的信息載體。通常以虛擬主機或主機托管的方式進行存放和運作。網(wǎng)站一般擁有固定的域名。1/11/2023121.7URI

URI是WWW的核心概念之一，它能夠無二義地標識Web上的任意一個資源，即用于唯一標識網(wǎng)絡上的一個概念或資源。其思想是在需要的時候通過鏈接引用資源，因此不需要對資源進行拷貝或集中管理。URI范圍比較廣，泛指所有以字串標識的網(wǎng)絡資源，包含了統(tǒng)一資源定位符(UniformResourceLocator，URL)和統(tǒng)一資源名稱(UniformResourceName，URN)。它們的區(qū)別在于URL是指標有通信協(xié)議的(如HTTP、FTP等)字串。URN通常用來標識持久、而且有專職機構負責的資源，如圖書館的圖書目錄。統(tǒng)一資源標識符(UniformResourceIdentifiers)1/11/202313圖

URL、URN和URI的關系統(tǒng)一資源定位符(UniformResourceLocator)統(tǒng)一資源標識符(UniformResourceIdentifiers)統(tǒng)一資源名稱(UniformResourceName，URN)1/11/202314

URL（UniformResourceLocator，統(tǒng)一資源定位符）主要用來指明通信協(xié)議和地址的方式，以取得網(wǎng)絡上的各種服務，它包括通信協(xié)議（Protocol）、主機名、所要訪問文件的路徑和文件名等幾個部分。例如，“http://www.”便是哈爾濱工程大學的URL。1/11/2023151.8FTP

FTP（FileTransferProtocol，文件傳輸協(xié)議）是Internet上使用非常廣泛的一種通訊協(xié)議。FTP是由支持Internet文件傳輸?shù)母鞣N規(guī)則所組成的集合，這些規(guī)則使Internet用戶可以把文件從一個主機傳送到另一個主機上。FTP通常也表示用戶執(zhí)行這個協(xié)議所使用的應用程序，如CuteFTP等。用戶使用FTP的方法很簡單，啟動FTP軟件后先與遠程主機建立連接，然后向遠程發(fā)出指令即可。Server-u1/11/2023161.9WWW

WWW（WorldWideWeb，萬維網(wǎng)）是在Internet的基礎上，由各計算機節(jié)點上的WWW軟件和超級文本格式的信息文件組成的信息網(wǎng)(主要表現(xiàn)為各個網(wǎng)站及其超級鏈接關系)

。這些節(jié)點稱為WWW服務器，簡稱Web服務器。海量的信息被存儲于Web服務器上，用戶使用WWW時只需提出查詢要求，到何處查詢及如何查詢則由WWW自動完成。WWW只是Internet上的一種應用，Internet還包括許多其他服務，如Telnet、FTP、Mail等。使用這些服務功能必須具備一定的計算機知識，有的還需要用戶通過鍵盤輸入命令來完成操作（如Telnet），這就使許多初級用戶望而卻步。而WWW采用的是圖形界面技術，用戶只需操縱鼠標，通過Windows界面下的WWW軟件和超級文本就可以完成瀏覽、查詢和下載等各項功能，并通過Internet從全世界任何地方找到所希望得到的文本、圖像和聲音等信息，而且WWW可以與其他服務（如Telnet、FTP和Mail等）實現(xiàn)無縫連接?？梢哉f，WWW的誕生使用戶從繁雜的操作中解脫出來，充分享受計算機帶來的便利。1/11/2023171.10超級文本

超級文本（Hypertext）與普通文本不同，它是一種使用戶與計算機之間能夠更加密切交流的文本顯示技術，它通過對相關詞匯進行索引鏈接，可以使帶鏈接的詞匯或語句指向文本中的其他段落、注解或文本。用戶可以沿著超級文本中的索引鏈接跳轉閱讀，也可以隨時返回到原來的閱讀之處。超級文本的出現(xiàn)，使計算機中的文本呈現(xiàn)出嶄新的面目。1/11/2023181.11HTML

HTML（HypertextMarkupLanguage，超級文本標記語言）是一種用來制作網(wǎng)絡中超級文本的簡單標記語言。它是在文本文件的基礎上加上一系列標記，用以描述其顏色、字體、文字大小和格式，再加上聲音、圖像、動畫甚至視頻等形成精彩的頁面。嚴格來說，HTML語言并不是一種編程語言，只是一些能讓瀏覽器看懂的標記語言。當用戶瀏覽WWW上包含HTML語言標簽的網(wǎng)頁時，瀏覽器會“翻譯”由這些HTML語言標簽提供的網(wǎng)頁結構、外觀和內(nèi)容的信息，并按照一定的格式在屏幕上顯示出來。HTML是在客戶端被執(zhí)行的，它包含許多HTML標簽，這些標簽都包括在“<”和“>”符號里，并且大部分是成對出現(xiàn)的。1/11/2023191.11HTML(續(xù))

一個最簡單的HTML文檔至少包含下列標簽。<html><head>…</head><body>…</body></html>1/11/2023201.11HTML(續(xù))

它們的含義分別如下：? <html>…</html>：網(wǎng)頁的開始、結束標簽，表示文件聲明，讓瀏覽器知道這是HTML文件。? <head>…</head>：網(wǎng)頁的文件頭部分，包含網(wǎng)頁的重要信息，在瀏覽器中不顯示。? <body>…</body>：網(wǎng)頁的可見部分，在設計視圖中看到的各個元素都包含在這一對標簽內(nèi)。以上3對標簽在網(wǎng)頁文檔中只能出現(xiàn)1次，而且順序也是固定的，不能重復出現(xiàn)或者顛倒順序。源代碼中的HTML標簽是層層嵌套的，最外層是“<html>…</html>”標簽。1/11/2023211.12ASP

ASP（ActiveServerPages，動態(tài)服務器主頁）是Microsoft公司在1996年底推出的一種運行于服務器端的Web應用程序開發(fā)技術，可以運行于Windows98（PWS）/WindowsNT（IIS）/Windows2000（IIS）/WindowsXP（IIS）/Windows2003（IIS）平臺。ASP不是一種開發(fā)工具，而是一種內(nèi)含于IIS/PWS之中的集成Script語言（如VBScript、JavaScript）到HTML主頁的服務器端的腳本語言環(huán)境，其主要功能是為生成動態(tài)的、交互的Web服務器應用程序提供一種功能強大的方式或技術。因此可以說，ASP是一種類似于HTML、Script與CGI的結合體，但是其運行效率卻比CGI更高，程序編制比HTML更方便且更有靈活性，程序安全及保密性也比Script好。ASP文件的擴展名為“.asp”，其中包括HTML標記、文本和腳本語句，其腳本語句代碼包含于“<%…%>”之間。InternetInformationServices（互聯(lián)網(wǎng)信息服務）1/11/2023221.13VBScript和JavaScript

Script（腳本）是一種介于HTML和Java、C++之類高級編程語言之間的一種特殊語言，它由一組可以在Web服務器或客戶端瀏覽器上運行的命令組合而成。盡管Script更接近高級語言，但它不具有編程語言復雜、嚴謹?shù)恼Z法規(guī)則。VBScript腳本語言是ASP的默認語言，它是VB家族的最新成員，可以說VBScript是VB的子集，也可以說VBScript是為了符合Internet小而精的條件而從VB之中萃取出精華功能的程序語言。其語法規(guī)則、函數(shù)與VB很相似，但功能上有所限制。VBScript可以在客戶端使用，也可以在服務器端使用，這是程序本身決定的。但是并不是所有的瀏覽器都支持VBScript，因此一般在安裝IIS的服務器端使用VBScript。下面來看一段VBScript代碼。1/11/202323…<scriptlanguage="VBScript">

MsgBox"歡迎訪問我們的主頁！"</script>…其中，<scriptlanguage="VBScript">與</script>之間就是VBScript的腳本代碼，language告訴瀏覽器腳本代碼的語言類型是VBScript。MsgBox是VBScript語言中顯示消息框的函數(shù)，其功能是彈出一個具有

按鈕的對話框，并顯示雙引號之間的字符串。提到JavaScript腳本語言，會把它與Java語言混淆起來，認為也像VBScript與VB這對“孿生兄弟”一樣，其實JavaScript與Java是兩種完全不同的語言。雖然它們的語法元素都和C++非常相似，但彼此之間是不同的。JavaScript是一種解釋型的語言，而Java是一種編譯型的語言。1.13VBScript和JavaScript(續(xù))1/11/2023241.13VBScript和JavaScript(續(xù))

JavaScript是一種跨平臺、基于對象的腳本語言，由JavaScript核心語言、JavaScript客戶端擴展、JavaScript服務器端擴展3部分組成。核心語言部分在客戶端、服務器端均可使用，包括了JavaScript的基本語法（如操作符、語句、函數(shù)）以及一些內(nèi)置對象等。

下面來看一段JavaScript代碼。1/11/202325…<scriptlanguage="JavaScript">alert("您是訪問我們主頁的第88位瀏覽者！");</script>…

其中，<scriptlanguage="JavaScript">與</script>之間就是JavaScript的腳本代碼，language告訴瀏覽器腳本代碼的語言類型是JavaScript。Alert()是JavaScript語言中顯示消息框的函數(shù)，其功能是彈出一個具有

按鈕的對話框，并顯示括號中雙引號之間的字符串。1.13VBScript和JavaScript(續(xù))1/11/202326內(nèi)容概述1.常用術語2.網(wǎng)頁要素3.網(wǎng)站建設流程本章將介紹網(wǎng)絡、網(wǎng)站和網(wǎng)頁的一些基本知識，為后續(xù)內(nèi)容的學習奠定一個初步基礎。1/11/2023272.網(wǎng)頁要素2.1文本2.2圖像2.3動畫2.4音頻2.5視頻1/11/2023282.1文本

文本是非常重要的網(wǎng)頁元素之一，是網(wǎng)頁中信息的主要載體。文字、字母、數(shù)字和符號等都可以稱為文本。與漂亮的圖像、優(yōu)美的動畫、悅耳的聲音和有聲有色的視頻相比，文本在網(wǎng)頁中似乎是最普通不過了，但文本卻是用戶創(chuàng)建網(wǎng)頁應該考慮的關鍵因素，因為文本是表述信息的最完備的方式，絕大多數(shù)信息都是通過文本傳遞給瀏覽者的。1/11/2023292.2圖像

圖像是站點中比較重要的元素，網(wǎng)頁的設計和創(chuàng)意都離不開圖像的使用和處理。一個欣賞性較好的站點應有清新悅目的畫面，能夠吸引讀者有興趣瀏覽下去。同時，圖像可以傳遞文字所無法表達的特定的信息，在Web上的大多數(shù)網(wǎng)頁都使用圖像來圖文并茂地對內(nèi)容加以介紹。網(wǎng)頁中的圖像既有簡單的彩色背景，也有實物的真實照片?？傊鶕?jù)不同的需要，配備不同的圖像加以說明，但從做網(wǎng)頁的角度來講，網(wǎng)頁上的圖像可以分為兩大類。一類純粹是網(wǎng)頁本身的需要，起增添網(wǎng)頁色彩的作用，它并不傳給讀者特定的信息，如某些網(wǎng)頁背景圖像、表格背景圖像等。另一類是行文的需要，配合文本向讀者傳遞信息，這就是所說的圖文并茂，或者利用圖像單獨向讀者傳遞信息，如圖片新聞。1/11/2023302.3動畫

動畫是現(xiàn)代網(wǎng)站的重要特色，是網(wǎng)頁制作技術的重要組成部分。在網(wǎng)頁中，常見的動畫類型有GIF動畫、Flash動畫等，使用編程的方法也可以制作動畫。目前，網(wǎng)頁中最流行的動畫是Flash動畫。Flash動畫一般具有文件容量小、傳輸速度快、不失真、邊下載邊播放的特點，還具有交互性優(yōu)勢。Flash動畫具有嶄新的視覺效果，已經(jīng)成為一種流行的藝術表現(xiàn)形式。1/11/2023312.4音頻

實際上，在Internet中運用最早和最多的多媒體文件就是音頻文件。Web網(wǎng)頁上使用的音頻文件類型也比視頻文件類型要豐富得多，目前，網(wǎng)絡上的音頻文件得到了空前的應用，而且類型多樣。MP3具有壓縮程度高、音質好的特點，是目前最為流行的一種音樂文件，在網(wǎng)上有很多可以在線收聽或下載MP3的站點。1/11/2023322.5視頻

在網(wǎng)頁中添加視頻文件可以大大增加站點的可讀性，已成為站點多媒體特性的重要體現(xiàn)?，F(xiàn)在，能夠在網(wǎng)絡上運行的視頻文件類型也日益豐富。AVI（.AVI）是音頻視頻交錯（AudioVideoInterleaved）的英文縮寫，它是Microsoft公司開發(fā)的一種符合RIFF文件規(guī)范的數(shù)字音頻與視頻文件格式。MPEG文件（.MPEG/.MPG/.DAT）是運動圖像壓縮算法的國際標準，它采用有損壓縮方法減少運動圖像中的冗余信息，同時保證每秒30幀的圖像動態(tài)刷新率，已被幾乎所有的計算機平臺共同支持。RealVideo文件（.RM/.RMVB）是RealNetworks公司開發(fā)的一種新型流式視頻文件格式，它包含在RealNetworks公司所制定的音頻視頻壓縮規(guī)范RealMedia中，主要用來在低速率的廣域網(wǎng)上實時傳輸活動視頻影像，可以根據(jù)網(wǎng)絡數(shù)據(jù)傳輸速率的不同而采用不同的壓縮比率，從而實現(xiàn)影像數(shù)據(jù)的實時傳送和實時播放。1/11/2023332.5視頻(續(xù))1/11/202334內(nèi)容概述1.常用術語2.網(wǎng)頁要素3.網(wǎng)站建設流程本章將介紹網(wǎng)絡、網(wǎng)站和網(wǎng)頁的一些基本知識，為后續(xù)內(nèi)容的學習奠定一個初步基礎。1/11/2023353.網(wǎng)站建設流程3.1前期策劃3.2網(wǎng)頁制作3.3網(wǎng)站發(fā)布3.4網(wǎng)站推廣3.5后期維護1/11/2023363.1前期策劃無論是大的門戶網(wǎng)站還是只有少量頁面的個人主頁，都需要做好前期的策劃工作。明確網(wǎng)站主題、網(wǎng)站名稱、欄目設置、整體風格、所需要的功能及實現(xiàn)的方法等，這是制作一個網(wǎng)站的良好開端。網(wǎng)站必須有一個明確的主題。網(wǎng)站必須有一個容易讓用戶記住的名稱。網(wǎng)站欄目設置要合理。網(wǎng)站必須有自己的風格。1/11/2023373.2網(wǎng)頁制作在前期策劃完成后，接著就進入網(wǎng)頁與制作階段。這一時期的工作按其性質可以分為3類：頁面美工設計靜態(tài)頁面制作程序開發(fā)1/11/2023383.3網(wǎng)站發(fā)布發(fā)布站點前，必須確定網(wǎng)頁的存儲空間。如果自己有服務器，配置好后，直接發(fā)布到上面即可。如果自己沒有服務器，則最好在網(wǎng)上申請一個空間來存放網(wǎng)頁，并申請一個域名來指定站點在網(wǎng)上的位置。發(fā)布網(wǎng)頁可直接使用DreamweaverCS3中的“發(fā)布站點”功能進行上傳。對于大型站點的上傳一般都使用FTP軟件，如LeapFTP、CuteFTP等，使用這種方法上傳下載速度都很快。1/11/2023393.3網(wǎng)站發(fā)布-建站方式3.3.1實體主機3.3.2主機托管3.3.3虛擬主機1/11/2023403.6.1實體主機

自行購買和建設服務器主機，然后向ISP