前端介紹 · PHP學習第一階段web前端入門

## 一、從網頁制作到前端開發 ### 1、web1.0時代的網頁制作網頁制作是web1.0時代的產物，那個時候的網頁主要是靜態網頁，所謂的靜態網頁就是沒有與用戶進行交互而僅僅供讀者瀏覽的網頁，例如一篇QQ日志、一篇博文等展示性文章。在web 1.0時代，用戶能做的唯一一件事就是瀏覽這個網站的文字圖片內容，這時用戶也不能像現在在大多數網站都可以評論交流（缺乏交互性）。現在大多數人都聽過“網頁三劍客Dreamweaver+Fireworks+Flash”吧，這個組合就是web 1.0時代的產物。 ：網頁三劍客指的是“Dreamweaver、Fireworks和Flash”。 ### 2、web2.0時代的前端開發 “前端開發”是從“網頁制作”演變而來的。從2005年開始，互聯網進入web 2.0時代，由單一的文字和圖片組成的靜態網頁已經不能滿足用戶的需求，用戶需要更好的體驗。在web 2.0時代，網頁有靜態網頁和動態網頁。所謂動態網頁，就是用戶不僅僅可以瀏覽網頁，還可以與服務器進行交互。舉個例子，你登陸新浪微博，要輸入賬號密碼，這個時候就需要服務器對你的賬號和密碼進行驗證通過才行。web2.0時代的網頁不僅包含炫麗的動畫、音頻和視頻，還可以讓用戶在網頁中進行評論交流、上傳和下載文件等（交互性）。這個時代的網頁，如果是用“網頁三劍客Dreamweaver+Fireworks+Flash”制作的，那是遠遠不能滿足需求。現在網站開發無論是開發難度，還是開發方式上，都更接近傳統的網站后臺開發，所以現在不再叫“網頁制作”，而是叫“web前端開發”。所以，處于web2.0時代的你，如果要學習網站開發技術，就不要再相信所謂的“網頁三劍客Dreamweaver+Fireworks+Flash”，因為這個組合已經是上個互聯網時代的產物。而且這個組合開發出來的網站問題也非常多，例如代碼冗余、網站維護困難（學習到后期，你會知道為什么不用這個組合了）。 ## 二、前端技術 ### 1、前端開發最核心技術我們知道，用所謂的網頁三劍客已經不能滿足需求了，那前端開發究竟要學習什么技術呢？網頁最主要由3部分組成：結構、表現和行為。網頁現在新的標準是W3C，目前模式是HTML、CSS和JavaScript。 #### （1）HTML是什么？ HTML，全稱“Hyper Text Markup Language（超文本標記語言）”，簡單來說，網頁就是用HTML語言制作的。HTML是一門描述性語言，是一門非常容易入門的語言。 #### （2）CSS CSS，全稱“（層疊樣式表）”。以后我們在別的地方看到“層疊樣式表”、“CSS樣式”，指的就是CSS。 #### （3）JavaScript JavaScript是一門腳本語言。 #### （4）HTML、CSS和JavaScript的區別我們都知道前端技術最核心的是HTML、CSS和JavaScript這三種。但是這三者究竟是干嘛的呢？ “HTML是網頁的結構，CSS是網頁的外觀，而JavaScript是頁面的行為。” #### （1）HTML是什么？ HTML，全稱“Hyper Text Markup Language（超文本標記語言）”，簡單來說，網頁就是用HTML語言制作的。HTML是一門描述性語言，是一門非常容易入門的語言。 #### （2）CSS CSS，全稱“（層疊樣式表）”。以后我們在別的地方看到“層疊樣式表”、“CSS樣式”，指的就是CSS。 #### （3）JavaScript JavaScript是一門腳本語言。 #### （4）HTML、CSS和JavaScript的區別我們都知道前端技術最核心的是HTML、CSS和JavaScript這三種。但是這三者究竟是干嘛的呢？ ### “HTML是網頁的結構，CSS是網頁的外觀，而JavaScript是頁面的行為。” ### 2、前端開發其他技術前端技術最核心的是HTML、CSS和JavaScript，但是對于一個真正的前端工程師來說，哪怕你精通這三個，你也不能稱為一個真正的“前端工程師”。因為前端技術除了HTML、CSS和JavaScript這三種，還需要學習Ajax、SEO等。 #### （1）Ajax Ajax，即“Asynchronous Javascript And XML（異步JavaScript和XML）”，是指一種創建交互式網頁應用的網頁開發技術。通過在后臺與服務器進行少量數據交換，Ajax可以使網頁實現異步更新。這意味著可以在不重新加載整個網頁的情況下，對網頁的某部分進行更新。傳統的網頁（不使用Ajax）如果需要更新內容，必須重載整個頁面。 Ajax是前后端交互的技術，主要實現在前端。（不懂？！沒關系，我們在Ajax教程中會講解到） #### （2）SEO SEO，即“Search Engine Optimization（搜索引擎優化）”。SEO優化是專門利用搜索引擎的搜索規則來提高目前網站在有關搜索引擎內的自然排名的方式（國內常見的搜索引擎有百度、360、搜狗等）。簡單來說，你建好了網站并不代表你網站就能被搜索引擎搜索到，我們一般使用百度搜索資料時，搜索出來的網頁有很多，但是我們一般看了搜索結果的第一、二頁就不再往下看了。SEO，就是為了我們的網站能排在搜索結果的前面，這樣你的網站才會有流量。你做網站，相信你也是想讓你網站有更多人瀏覽的吧。