1.4　制作網站的標準和常用技術

隨著Web的發展，各種Web開發技術不斷涌現。而且，各種類型和版本的瀏覽器越來越多，網頁在不同的瀏覽器中的表現也有區別。因此，依據一定的標準來指導Web開發和應用，實現Web開發應用的有序、高效，實現Web站點的可維護和可擴展，實現網頁在不同瀏覽器中獲得一致的表現效果，這些內容已經成為Web發展過程中越來越重要的問題。

Web開發應用遵循的標準就是Web標準，這個標準也是在不斷發展和完善的。本節就來介紹Web標準及網頁開發的常用技術。

1.4.1　Web標準

Web標準是由W3C（萬維網聯盟）和其他標準化組織共同制定的，該標準用來創建和解釋基于Web的內容，Web標準可以使得在網上發布的文檔向后兼容，使其能夠被大多數瀏覽器所訪問。

Web標準包括一系列標準。網頁部分的標準通過3部分來描述：結構（Structure）、表現（Presentation）和行為（Behavior）。對應的標準也分3方面：結構標準語言主要包括XHTML和XML，表現標準語言主要包括CSS，行為標準主要包括對象模型（如W3C DOM）、ECMAScript等。這些標準大部分由W3C起草和發布，也有一些是其他標準組織制訂的，比如ECMA（European Computer Manufacturers Association，歐洲計算機制造聯合會）的ECMAScript標準。

就網站開發而言，Web標準的結構、表現和行為對應3種常用的技術，即（X）HTML、CSS和JavaScript。（X）HTML用來決定網頁的結構和內容，CSS用來設計網頁的表現形式，JavaScript用來控制網頁的行為，這3部分即是本書的框架。本書還擴展介紹了用于快速Web開發的Bootstrap框架。

1.結構標準

（1）XML

XML是The Extensible Markup Language（可擴展標記語言）的縮寫。目前推薦遵循的標準是W3C于2000年10月發布的XML1。和HTML一樣，XML同樣來源于SGML（標準通用標記語言），但XML是一種能定義其他語言的語言。最初設計XML的目的是彌補HTML的不足，以其強大的擴展性滿足網絡信息發布的需要，后來它被逐漸用于網絡數據的轉換和描述。

（2）XHTML

XHTML是Extensible HyperText Markup Language（可擴展超文本標記語言）的縮寫。XML雖然數據轉換能力強大，完全可以替代HTML，但XML功能過于豐富，完全替代HTML并不是最佳方案。因此，在HTML4的基礎上，用XML的規則對其進行擴展，得到了XHTML。簡單地說，建立XHTML的目的就是實現HTML向XML的過渡。2010年以后，HTML5成為新一代的技術標準，將逐漸取代XHTML。

2.表現標準

CSS是Cascading Style Sheets（層疊樣式表）的縮寫。W3C創建CSS標準的目的是以CSS取代HTML表格式布局、幀和其他表現的語言。純CSS布局與結構式XHTML相結合能幫助網頁設計者分離外觀與結構，使站點的訪問及維護更加容易。現在使用的CSS都是在1998年推出的CSS2基礎上發展而來的，2010年推出的CSS3極大簡化了CSS的編程模型，將逐漸占據主導地位。

3.行為標準

（1）DOM

DOM是Document Object Model（文檔對象模型）的縮寫。根據W3C DOM規范，DOM是一種瀏覽器、平臺、語言的接口，它使用戶可以訪問頁面的其他標準組件。可以這樣簡單理解，DOM解決了Netscape公司的JavaScript技術和Microsoft公司的JavaScript技術之間的沖突，給Web設計師和開發者一個標準的方法，讓他們來訪問站點中的數據、腳本和表現層對象。

（2）ECMAScript

ECMAScript是ECMA制定的標準腳本語言（JavaScript），目前推薦遵循的是ECMAScript 262。

1.4.2　網站開發常用技術

制作靜態網頁和動態網頁分別需要不同的技術。目前，靜態網頁制作技術主要有HTML、XHTML、CSS、JavaScript等，這些技術都是靜態網頁制作初學者常用的技術。制作動態網頁，除了要學習靜態網頁制作的相關技術外，還需要掌握動態網頁的制作技術，如動態網頁的制作語言PHP、ASP、JSP等，以及數據庫SQL Server、MySQL、Oracle等方面的知識。

1.HTML

HTML是HyperText Markup Language的縮寫，即超文本標記語言，是一種用來制作超文本文檔的簡單標記語言，是網頁制作的基本語言。用HTML編寫的超文本文檔稱為HTML文檔，它能獨立于各種操作系統平臺（如UNIX、Windows等）。HTML文檔是一個包含HTML標記、文本內容，并按照HTML文檔結構描述的文本文件，文件的后綴名為.html或.htm。瀏覽器讀取網站上的HTML文檔，再根據此類文檔中的描述組織并顯示相應的Web頁面。

2.XHTML

XHTML即可擴展超文本標記語言。實際上，XHTML是一個過渡語言，它結合了XML的強大功能及HTML的簡單特性。現在所有的瀏覽器都支持XHTML。

HTML在使用初期，為了能被更廣泛地接受，語言標準相對不夠嚴格，例如，標記可以不封閉，屬性可以加引號，也可以不加引號等。這種情況導致出現了很多混亂和不規范的代碼，這不符合標準化的發展趨勢，影響了互聯網的進一步發展。

為此，W3C作為相關規范的制訂者，逐步推出新的版本規范。盡管目前瀏覽器都兼容HTML，但是為了使網頁能夠符合標準，網頁設計者應該盡量使用XHTML規范來編寫代碼，部分需要注意的事項如下。

?在HTML中，標記名和屬性名稱可以大寫或者小寫，但是在XHTML中，標記名和屬性名必須小寫。

?HTML對標記的嵌套沒有嚴格的規定，但是在XHTML中這是不允許的，必須嚴格地使標記封閉。

?在XHTML中即使是空元素的標記也必須封閉。這里說的空元素的標記是指如<img>、<br>等不成對的標記，它們也必須封閉。

例如，下面的寫法在XHTML中是錯誤的。

水平線<hr>
圖像<img src ="tu1.jpg">

而正確的寫法應該是：

水平線<hr/>
圖像<img src ="tu1.jpg"/> 

?在HTML中，屬性可以不必使用雙引號；在XHTML中，屬性值必須用雙引號括起來。

3.CSS

CSS是標準的布局語言，用來控制元素的尺寸、顏色和排版，用來定義如何顯示HTML元素。純CSS的布局與XHTML相結合可使內容表現與結構相分離，并使網頁更容易維護，易用性更好。

4.JavaScript

JavaScript語言是一種解釋性的、基于對象的腳本語言。JavaScript語言與Java語言之間沒有聯系，是兩種完全不同的語言。JavaScript是一種“腳本”（Script），直接把代碼寫到HTML文檔中，瀏覽器讀取代碼的時候才進行編譯、執行，所以能查看HTML源文件就能查看JavaScript源代碼。JavaScript沒有獨立的運行窗口，瀏覽器的當前窗口就是它的運行窗口。

使用JavaScript可使網頁變得生動，增加互動性。它通過嵌入到標準的HTML中來實現。JavaScript語言使得網頁和用戶之間實現了一種實時、動態、交互的關系，使網頁能夠包含更多活躍的元素和更加精彩的內容，并以動態的形式呈現給用戶。

5.Bootstrap

Bootstrap是基于HTML、CSS、JavaScript的開源框架，它包含了功能強大的樣式、組件和插件，為頁面開發人員提供了一個簡潔統一的解決方案。Bootstrap 3.3.7版本得到了所有主流瀏覽器的支持。自Bootstrap 3起，框架的設計采用了的移動設備優先的樣式。Bootstrap支持響應式的布局設計，能夠適應臺式機、平板電腦和手機應用的Web頁面開發，是當前Web開發最流行的框架之一。