http://2014.artsy.net/
https://codepen.io/Yakudoo/full/rJjOJx
https://codepen.io/pissang/full/geajpX
https://codepen.io/tsuhre/full/BYbjyg
https://wangyasai.github.io/Stars-Emmision/
https://pissang.github.io/papercut-box-art/
https://demo.marpi.pl/biomes/
https://pissang.github.io/voxelize-image/
http://echarts.baidu.com/examples/index.html#chart-type-globe
https://tympanus.net/Development/AudioVisualizers/（推薦戴耳機）
step1:欣賞一些震撼美的網站
step2:瞭解基本概念：
借鑑網站：
http://www.w3school.com.cn/html/index.asp
首先了解用戶、前端和網站服務器三大部分，構成的網站最基本結構
- 前端開發語言—html、css、js
html和css
**:
如果不用css，效果是這樣的，按照瀏覽器默認的樣式顯示出列表、圖片、超鏈接、輸入框、按鈕等等。
很醜，需要用css來定義樣式：
比如知乎頂上那個藍色的導航條，它的 CSS 大約是這樣的
大概解釋一下就是：
就是它的位置（position）應該是不動（fixed）的，所在我們在頁面上翻來翻去頂上那個導航條都會死死地黏在窗口頂部不跟着滾動。
JavaScript
有了表示內容和語義的 HTML，規定樣式的 CSS，得到的是一個靜態的頁面，沒什麼動畫（其實用 CSS 還是可以有一些動畫的，不過這個跑題了），按 F5 纔會刷新數據， Javascript（JS） 給頁面添加一些動態的效果，比如點到一個地方會彈出一個窗口。
到目前爲止，我好像理解了前端語言的概念（誰知道有多少錯誤），但是前端的本質對於用戶而言並不是那麼友好，以下是構成前端內容的html代碼示例，css和js的代碼也類似。
根本看不懂
前端小知識點：
1.json/xml:
xml是可擴展標記語言,通常用於傳輸和儲存數據,相似的還有json.前端和服務器之間通常需要一種雙方都認可的格式進行數據的傳遞和存儲。 .xml/json或其他格式指定了數據內容的存儲格式,使用該數據的雙方只需按照規定的格式寫入/讀出內容即可完成數據的傳輸和存儲.
2.AJAX (Asynchronous Javascript And XML) 異步JavaScript和XML
利用已有的js/css/xml等技術達到前端數據及時更新(自動刷新)的效果.
3.DOM
HTML DOM 定義了訪問和操作 HTML 文檔的標準方法。
4.jQuery
jQuery 是一個 JavaScript 庫。
- 翻譯—–瀏覽器
瀏覽器就是對HTML+CSS+JS文件內容進行翻譯，並允許用戶通過頁面與網站進行交互的一種軟件。
後端—底層開發語言
服務器腳本：
SQL 是用於訪問和處理數據庫的標準的計算機語言。
ASP 是創建動態交互性網頁的強大工具。
PHP 是一種創建動態交互性站點的強有力的服務器端腳本語言。
注意：
ASP.NET 是一個開發框架，用於通過 HTML、CSS、JavaScript 以及服務器腳本來構建網頁和網站。
Web Services 可以將應用程序轉換爲網絡應用程序。