初學者Web：介紹一些前端開發中的基本概念和用到的技術

　Web開發是比較費神的，需要掌握很多很多的東西，特別是從事前端開發的朋友，需要通十行才行。今天，本文向初學者介紹一些Web開發中的基本概念和用到的技術，從A到Z總共26項，每項對應一個概念或者技術。

A — AJAX

AJAX 全稱為“Asynchronous JavaScript and XML”（異步JavaScript和XML），是一種創建交互式網頁應用的網頁開發技術。根據Ajax提出者Jesse James Garrett建議，AJAX：

• 使用XHTML+CSS來表示信息；

• 使用JavaScript操作DOM（Document Object Model）進行動態顯示及交互；

• 使用XML和XSLT進行數據交換及相關操作；

• 使用XMLHttpRequest對象與Web服務器進行異步數據交換；

• 使用JavaScript將所有的東西綁定在一起。

類似於DHTML或LAMP，AJAX不是指一種單一的技術，而是有機地利用了一系列相關的技術。事實上，一些基於AJAX的“派生／合成”式（derivative/composite）的技術正在出現，如AFLAX。

B — Browser

網頁瀏覽器 是個顯示網頁服務器或文件系統內的文件，並讓用戶與此些文件交互的一種軟件。它用來顯示在萬維網或局域網等內的文字、圖像及其他信息。這些文字或圖像，可以是連接其他網址的超連結，用戶可迅速及輕易地瀏覽各種信息。大部分網頁為HTML格式，有些網頁需特定瀏覽器才能正確顯示。個人電腦上常見的網頁瀏覽器按照2010年1月的市場佔有率依次是微軟的Internet Explorer、Mozilla的Firefox、Google的Google Chrome、蘋果公司的Safari和Opera軟件公司的Opera。瀏覽器是最經常使用到的客戶端程序。Web開發人員應該確保其程序在各個主流瀏覽器中都能正常工作。

C — CSS

層疊樣式表，又稱：串樣式列表，英文：Cascading Style Sheets，簡寫為CSS，由W3C定義和維護的標準，一種用來為結構化文檔（如HTML文檔或XML應用）添加樣式（字體、間距和顏色等）的計算機語言。目前最新版本是CSS 2.1，為W3C的候選推薦標準。下一版本CSS 3仍然在開發過程中。

D — DOM

文檔對象模型（Document Object Model，簡稱DOM），是W3C組織推薦的處理可擴展置標語言的標準編程接口。Document Object Model的歷史可以追溯至1990年代後期微軟與Netscape的“瀏覽器大戰”（browser wars），雙方為了在JavaScript與JScript一決生死，於是大規模的賦予瀏覽器強大的功能。微軟在網頁技術上加入了不少專屬事物，計有VBScript、ActiveX、以及微軟自家的DHTML格式等，使不少網頁使用非微軟平臺及瀏覽器無法正常顯示。DOM即是當時蘊釀出來的傑作。

E — Events

事件 是可以被控件識別的操作，如按下確定按鈕，選擇某個單選按鈕或者複選框。每一種控件有自己可以識別的事件，如窗體的加載、單擊、雙擊等事件，編輯框(文本框)的文本改變事，等等，現代的Web應用程序很大程度上依靠事件驅動。

事件有系統事件和用戶事件。系統事件由系統激發，如時間每隔24小時，銀行儲戶的存款日期增加一天。用戶事件由用戶激發，如用戶點擊按鈕，在文本框中顯示特定的文本。事件驅動控件執行某項功能。觸發事件的對象稱為事件發送者；接收事件的對象稱為事件接收者。

使用事件機制可以實現：當類對象的某個狀態發生變化時，系統將會通過某種途徑調用類中的有關處理這個事件的方法或者觸發控件事件的對象就會調用該控件所有已註冊的事件處理程序等。

F — Firebug

Firebug 是網頁瀏覽器 Mozilla Firefox 的一個擴展，是一個除錯工具。用戶可以利用它除錯、編輯、甚至刪改任何網站的 CSS、HTML、DOM、與 JavaScript 代碼。Firebug 也有提供其他網頁開發工具，例如 Yahoo! 的網頁速度優化建議工具YSlow。Firebug是哈維（Joe Hewitt）撰寫的。他是最初Firefox創始者之一。

G — Grid

網格，也稱柵格，不過從定義上說，柵格更為準確些。網上找個一個對網頁柵格系統比較恰當的定義：以規則的網格陣列來指導和規範網頁中的版面佈局以及信息分佈。網頁柵格系統是從平面柵格系統中發展而來。對於網頁設計來說，柵格系統的使用，不僅可以讓網頁的信息呈現更加美觀易讀，更具可用性。而且，對於前端開發來說，網頁將更加的靈活與規範。

H — HTML

超文本置標語言（英文：HyperText Markup Language，HTML）是為“網頁創建和其它可在網頁瀏覽器中看到的信息”設計的一種置標語言。HTML被用來結構化信息——例如標題、段落和列表等等，也可用來在一定程度上描述文檔的外觀和語義。由蒂姆·伯納斯-李給出原始定義，由IETF用簡化的SGML（標準通用置標語言）語法進行進一步發展的HTML，後來成為國際標準，由萬維網聯盟（W3C）維護。

最新版本是HTML5它是HTML下一個的主要修訂版本，現在仍處於發展階段。目標是取代1999年所定訂的HTML 4.01和XHTML 1.0 標準，以期能在互聯網應用迅速發展的時候，使網絡標準達到符合當代的網絡需求。廣義論及HTML5時，實際指的是包括HTML、CSS和JavaScript在內的一套技術組合。

I — IE

Windows Internet Explorer（舊稱Microsoft Internet Explorer，簡稱Internet Explorer，縮寫IE），是微軟公司推出的一款網頁瀏覽器。截至2010年9月止，統計的數據顯示Internet Explorer的市場佔有率高達59.65%。雖然它依然是使用最廣泛的網頁瀏覽器，但與2003年最高峰時相比，市場佔有率相差超過30%。

Internet Explorer對一些標準化技術都有一定程度上的支持，但亦有很多運行上的差距和兼容性的故障
，這導致技術開發者的批評日益增加。批評增加的情況，在很大程度上是歸因於Internet
Explorer的競爭對手相對地已提供完全的技術支持，標準規格（Standards-compliant）的應用亦越來越廣泛起來。因為Internet
Explorer在全球廣為應用，網絡開發者們在尋求跨平臺的代碼時常常會發現Internet Explorer的漏洞、私有的功能集合和對標準支持的不完善。

J — JavaScript

JavaScript 是一種廣泛用於客戶端Web開發的腳本語言，常用來給HTML網頁添加動態功能，比如響應用戶的各種操作。它最初由網景公司的Brendan Eich設計，是一種動態、弱類型、基於原型的語言，內置支持類。JavaScript是Sun公司的註冊商標。Ecma國際以JavaScript為基礎制定了ECMAScript標準。JavaScript也可以用於其他場合，如服務器端編程。完整的JavaScript實現包含三個部分：ECMAScript，文檔對象模型，字節順序記號。

Netscape公司在最初將其腳本語言命名為LiveScript來Netscape在與Sun合作之後將其改名為JavaScript。JavaScript最初受Java啟發而開始設計的，目的之一就是“看上去像Java”，因此語法上有類似之處，一些名稱和命名規範也借自Java。但JavaScript的主要設計原則源自Self和Scheme.JavaScript與Java名稱上的近似，是當時網景為了營銷考慮與Sun公司達成協議的結果。為了取得技術優勢，微軟推出了JScript來迎戰JavaScript的腳本語言。為了互用性，Ecma國際（前身為歐洲計算機制造商協會）創建了ECMA-262標準（ECMAScript）。現在兩者都屬於ECMAScript的實現。儘管JavaScript作為給非程序人員的腳本語言，而非作為給程序人員的編程語言來推廣和宣傳，但是JavaScript具有非常豐富的特性。

K — Keyword Optimization

關鍵詞優化，也叫搜索引擎優化（Search Engine Optimization，簡稱SEO）是一種利用搜索引擎的搜索規則來提高目的網站在有關搜索引擎內的排名的方式。由於不少研究發現，搜索引擎的用戶往往只會留意搜索結果最前面的幾個條目，所以不少網站都希望通過各種形式來影響搜索引擎的排序。當中尤以各種依靠廣告維生的網站為甚。

所謂“針對搜索引擎作優化的處理”，是指為了要讓網站更容易被搜索引擎接受。搜索引擎會將網站彼此間的內容做一些相關性的數據比對，然後再由瀏覽器將這些內容以最快速且接近最完整的方式，體現給搜索者。

搜索引擎優化對於任何一家網站來說，要想在網站推廣中取得成功，搜索引擎優化都是至為關鍵的一項任務。同時，隨著搜索引擎不斷變換它們的排名算法規則，每次算法上的改變都會讓一些排名很好的網站在一夜之間名落孫山，而失去排名的直接後果就是失去了網站固有的可觀訪問量。所以每次搜索引擎算法的改變都會在網站之中引起不小的騷動和焦慮。可以說，搜索引擎優化是一個愈來愈複雜的任務。

L — Less

Less 最早是一個ruby的gem，讓CSS具有動態語言的特性，這些特性包括變量，操作符，嵌套規則。其實Less真正的作用是將使用高級特性的CSS轉換成標準的CSS。這些都是在Web客戶端發起請求時通過Http

Handler來完成的。也可以是編輯時就完成的。此外，Less可以配置成自動最小化所生成的CSS文件，不僅節省了帶寬，並且使最終用戶體驗更上一層。另外有.Net版本的Less。

M — MVC

MVC模式（Model-View-Controller）是軟件工程中的一種軟件架構模式，把軟件系統分為三個基本部分：模型（Model）、視圖（View）和控制器（Controller）。MVC模式最早由Trygve Reenskaug在1974年提出，是施樂帕羅奧多研究中心（Xerox PARC）在20世紀80年代為程序語言Smalltalk發明的一種軟件設計模式。MVC模式的目的是實現一種動態的程序設計，使後續對程序的修改和擴展簡化，並且使程序某一部分的重複利用成為可能。除此之外，此模式通過對複雜度的簡化，使程序結構更加直觀。軟件系統通過對自身基本部份分離的同時也賦予了各個基本部分應有的功能。

N — Node.JS

Node 是一個Javascript運行環境(runtime)，實際上它是對Google V8引擎（應用於Google Chrome瀏覽器)進行了封裝。V8引

擎執行Javascript的速度非常快，性能非常好。Node對一些特殊用例進行了優化，提供了替代的API，使得V8在非瀏覽器環境下運行得更好。例

如，在服務器環境中，處理二進制數據通常是必不可少的，但Javascript對此支持不足，因此，V8.Node增加了Buffer類，方便並且高效地
處理二進制數據。因此，Node不僅僅簡單的使用了V8,還對其進行了優化，使其在各環境下更加給力。Node.js包羅萬象，但最主要的一點是，它提供了一種在Web瀏覽器之外運行Javascript的途徑。Javascript廣泛應用於網站的前端開發。Node使得這種流行的編程語言能夠在更多環境下運行，甚至是網站的服務器端。

O — Object

對象（object），是面向對象(Object Oriented) 中的術語，既表示客觀世界問題空間(Namespace)中的某個具體的事物，又表示軟件系統解空間中的基本元素。在軟件系統中，對象具有唯一的標識符，對象包括屬性(Properties)和方法(Methods)，屬性就是需要記憶的信息，方法就是對象能夠提供的服務。在面向對象(Object Oriented) 的軟件中，對象(Object)是某一個類(Class)的實例(Instance)。

P — PHP

PHP（Hypertext Preprocessor）是一種在電腦上運行的腳本語言，主要用途是在於處理動態網頁，也包含了命令行運行接口（command line interface），或者產生圖形用戶界面（GUI）程序。PHP最早由Rasmus Lerdorf在1995年發明，而現在PHP的標準由PHP Group和開放源代碼社區維護。PHP以PHP License作為許可協議，不過因為這個協議限制了PHP名稱的使用，所以和開放源代碼許可協議GPL不兼容。

PHP的應用範圍相當廣泛，尤其是在網頁程序的開發上。一般來說PHP大多運行在網頁服務器上，通過運行PHP代碼來產生用戶瀏覽的網頁。PHP可以在多數的服務器和操作系統上運行，而且使用PHP完全是免費的。根據2007年4月的統計數據，PHP已經被安裝在超過2000萬個網站和100萬臺服務器上。

Q — Query

查詢，有很多種意思。例如查詢語言用來和存儲數據的擴展系統交互，一個很好的例子就是SQL用來操作關係數據庫。另一種意思是，一個查詢字符串，作為URL的一部分用於Web應用程序中傳遞數據，查詢字符串的格式一般是鍵值對形式。

R — Regular Expressions

正則表達式（英語：Regular Expression、regex或regexp，縮寫為RE），也譯為正規表示法、常規表示法，在計算機科學中，是指一個用來描述或者匹配一系列符合某個句法規則的字符串的單個字符串。在很多文本編輯器或其他工具裡，正則表達式通常被用來檢索和/或替換那些符合某個模式的文本內容。許多程序設計語言都支持利用正則表達式進行字符串操作。例如，在Perl中就內建了一個功能強大的正則表達式引擎。正則表達式這個概念最初是由Unix中的工具軟件（例如sed和grep）普及開的。

S — Source Control

源代碼管理，也稱版本控制，是一種軟件工程技巧，藉此能在軟件開發的過程中，確保由不同人所編輯的同一程式檔案都得到同步。軟件設計師常會利用版本控制來追蹤、維護源碼、文件以及設定檔等等的更動，並且提供控制這些更動控制權的程序。在最簡單的情況下，軟件設計師可以自己保留一個程式的許多不同版本，並且為它們做適當的編號。這種簡單的方法已被用在很多大型的軟件專案中。這是一個可以達到目的的方法，但不夠有效率。除了得同時維護很多幾乎一樣的程式碼備份外；而且極度依賴軟件設計師的自我修養與開發紀律，但這卻常是導致錯誤發生的原因。

有時候，一個程式同時存有兩個以上的版本也有其必要性，例如：在一個為了部署的版本中程式錯誤已經被修正、但沒有加入新功能；在另一個開發版本則有新的功能正在開發、也有新的錯誤待解決，這使得同時間需要不同的版本並修改。此外，為了找出只存在於某一特定版本中的程式錯誤、或找出程式錯誤出現的版本，軟件除錯者也必須藉由比對不同版本的程式碼以找出問題的位置。

T — TDD

測試驅動開發（Test-driven development）是現代計算機軟件開發方法的一種。利用測試來驅動軟件程序的設計和實現。測試驅動開始流行於20世紀90年代。測試驅動開發是極限編程中倡導的程序開發方法，方法主要是先寫測試程序，然後再編碼使其通過測試。測試驅動開發的目的是取得快速反饋並使用“illustrate the main line”方法來構建程序。

測試驅動開發的比喻。開發可以從兩個方面去看待：實現的功能和質量。測試驅動開發更像兩頂帽子思考法的開發方式，先戴上實現功能的帽子，在測試的輔助下，快速實現正確的功能；再戴上重構的帽子，在測試的保護下，通過去除冗餘和重複的代碼，提高代碼重用性，實現對質量的改進。可見測試在測試驅動開發中確實屬於核心地位，貫穿了開發的始終。

U — Unit Testing

單元測試（又稱為模塊測試）是針對程序模塊(軟件設計的最小單位)來進行正確性檢驗的測試工作。程序單元是應用的最小可測試部件。在過程化編程中，一個單元就是單個程序、函數、過程等；對於面向對象編程，最小單元就是方法，包括基類（超類）、抽象類、或者派生類（子類）中的方法。

通常來說，程序員每修改一次程序就會進行最少一次單元測試，在編寫程序的過程中前後很可能要進行多次單元測試，以證實程序達到軟件規格書(en:Specification)要求的工作目標，沒有臭蟲；雖然單元測試不是什麼必須的，但也不壞，這牽涉到項目管理的政策決定。

V — VIM

Vim 是從vi發展出來的一個文本編輯器。代碼補完、編譯及錯誤跳轉等方便編程的功能特別豐富，在程序員中被廣泛使用。和Emacs並列成為類Unix系統用戶最喜歡的編輯器。Vim的第一個版本由Bram Moolenaar在1991年發佈。最初的簡稱是Vi IMitation，隨著功能的不斷增加，正式名稱改成了Vi IMproved。現在是在開放源代碼方式下發行的自由軟件。

W — WordPress

WordPress 是一種使用PHP語言開發的博客平臺，用戶可以在支持PHP和MySQL 數據庫的服務器上架設自己的網誌。也可以把 WordPress 當作一個內容管理系統（CMS）來使用。WordPress 是一個免費的開源項目，在GNU通用公共許可證下授權發佈。目前最新版本為2011年2月24日發佈的3.0.5官方簡體中文版，另外還有包括英文在內的多種語言可選。

X — XSS

跨網站指令碼（Cross-site scripting，通常簡稱為XSS）是一種網站應用程式的安全漏洞攻擊，允許惡意使用者將程式碼注入到網頁上，其他使用者在觀看網頁時就會受到影響。這類攻擊通常包含了HTML以及使用者端腳本語言。

Y — YUI

Yahoo! UI Library (YUI) 是一個開放源代碼的 JavaScript 函數庫，為了能建立一個高互動的網頁，它採用了AJAX，DHTML 和 DOM 等程式碼技術。它也包含了許多 CSS 資源。

Z — Z index

Z-Index 是CSS屬性，設置元素的堆疊順序。擁有更高堆疊順序的元素總是會處於堆疊順序較低的元素的前面。該屬性設置一個定位元素沿 z 軸的位置，z 軸定義為垂直延伸到顯示區的軸。如果為正數，則離用戶更近，為負數則表示離用戶更遠。