做HTML5，需要哪些工具？

web前端開發(fā)的小伙伴經(jīng)常會(huì)聽到HTML5這個(gè)詞，那么這個(gè)HTML5到底是什么呢？其實(shí)HTML5 是對(duì) HTML 標(biāo)準(zhǔn)的第五次修訂。其主要的目標(biāo)是將互聯(lián)網(wǎng)語義化，以便更好地被人類和機(jī)器閱讀，并同時(shí)提供更好地支持各種媒體的嵌入。HTML5 的語法是向后兼容的。

HTML5草案的前身名為 Web Applications 1.0，于04年被WHATWG提出，于07年被W3C接納，并成立了新的 HTML 工作團(tuán)隊(duì)。

HTML5手機(jī)應(yīng)用的最大優(yōu)勢(shì)就是可以在網(wǎng)頁(yè)上直接調(diào)試和修改。原先應(yīng)用的開發(fā)人員可能需要花費(fèi)非常大的力氣才能達(dá)到HTML5的效果，不斷地重復(fù)編碼、調(diào)試和運(yùn)行，這是首先得解決的一個(gè)問題。因此也有許多手機(jī)雜志客戶端是基于HTML5標(biāo)準(zhǔn)，開發(fā)人員可以輕松調(diào)試修改。

HTML5將會(huì)取代99年制定的HTML 4.01、XHTML 1.0標(biāo)準(zhǔn)，以期能在互聯(lián)網(wǎng)應(yīng)用迅速發(fā)展的時(shí)候，使網(wǎng)絡(luò)標(biāo)準(zhǔn)達(dá)到符合當(dāng)代的網(wǎng)絡(luò)需求，為桌面和移動(dòng)平臺(tái)帶來無縫銜接的豐富內(nèi)容。

HTML5的設(shè)計(jì)目的是為了在移動(dòng)設(shè)備上支持多媒體。新的語法特征被引進(jìn)以支持這一點(diǎn)，如video、audio和canvas 標(biāo)記。

HTML5的出現(xiàn)大大節(jié)省了人們的開發(fā)成本。因?yàn)樗ǔ訮C、Mac、iPhone、iPad、Android、Windows Phone等跨語言平臺(tái)。程序員們?cè)僖膊槐貫椴煌畹氖謾C(jī)做不同的APP了。那么創(chuàng)建HTML5網(wǎng)站需要哪些工具?

Aptana這個(gè)HTML5編輯器是一個(gè)開源的開發(fā)工具，支持開放的Web開發(fā)。開發(fā)者可以使用單一的設(shè)置來測(cè)試他們的Web應(yīng)用程序。很多人更喜歡Adobe的Dreamweaver等工具，因?yàn)樗?010年獲得了HTML5包。

編輯方式

HTML其實(shí)是文本，它需要瀏覽器的解釋，它的編輯器大體可以分為以下幾種：

基本文本、文檔編輯軟件，使用微軟自帶的記事本或?qū)懽职宥伎梢跃帉懀?dāng)然，如果你用WPS來編寫，也可以。不過存盤時(shí)請(qǐng)使用.htm或.html作為擴(kuò)展名，這樣就方便瀏覽器認(rèn)出直接解釋執(zhí)行了。

半所見即所得軟件，如：FCK-Editer、E-webediter等在線網(wǎng)頁(yè)編輯器；尤其推薦：Sublime Text代碼編輯器（由Jon Skinner開發(fā)，Sublime Text2收費(fèi)但可以無限期試用）。

所見即所得軟件，使用最廣泛的編輯器，完全可以一點(diǎn)不懂HTML的知識(shí)就可以做出網(wǎng)頁(yè)，如：AMAYA（出品單位：萬維網(wǎng)聯(lián)盟）；FRONTPAGE（出品單位：微軟）;；Dreamweaver（出品單位Adobe）。

Microsoft Visual Studio（出品公司：微軟）：其中所見即所得軟件與半所見即所得的軟件相比，開發(fā)速度更快，效率更高，且直觀的表現(xiàn)更強(qiáng)。任何地方進(jìn)行修改只需要刷新即可顯示。缺點(diǎn)是生成的代碼結(jié)構(gòu)復(fù)雜，不利于大型網(wǎng)站的多人協(xié)作和精準(zhǔn)定位等高級(jí)功能的實(shí)現(xiàn)。

用說， Flash的效果大家都清楚。實(shí)際上，HTML5和JavaScript擁有很多新屬性，可以用它們來替代Flash。W3Cschool精選16個(gè)超牛逼的HTML5和JavaScript特效，看了這些特效，未來的Web發(fā)展前途無量。

1.特效：FlowerPower

創(chuàng)作者使用花朵作為畫刷，以貝茲曲線方式繪圖。

2.特效：Breathing Galaxies

動(dòng)態(tài)變換直徑及顏色，可通過鼠標(biāo)或鍵盤產(chǎn)生新形狀，這個(gè)效果不錯(cuò)!

3.特效：Noise Field

移動(dòng)鼠標(biāo)可改變粒子運(yùn)動(dòng)，點(diǎn)擊可隨機(jī)生成不同粒子效果。

4.特效：HTML5 Canvas粒子效果文字動(dòng)畫特效

W3Cschool利用HTML5，制造出了粒子效果文字動(dòng)畫特效。只要你輸入框中輸入想要展示的文字，回車后即可在canvas上繪制出粒子效果的文字動(dòng)畫，相當(dāng)酷的動(dòng)畫效果。

5.特效：Swirling Tentacles

三維脈沖效果，沿著脈沖線有運(yùn)動(dòng)的顏色漸變模塊。

6.特效：Keylight

雙擊生成兩個(gè)以后的鍵即可發(fā)出聲音，移動(dòng)鍵的位置可產(chǎn)生不同的聲音效果。W3Cschool上面有很多這樣的教程，有興趣可以去看一下！

7.特效：Rotating Spiral

旋轉(zhuǎn)的螺旋效果，單擊可以控制開始和停止旋轉(zhuǎn)，是不是覺得高大上？

8.Blob

拖動(dòng)水滴有重力效果，雙擊可以分離，小水滴碰到大水滴會(huì)合并。

9.Trail

彩色顆粒跟隨鼠標(biāo)運(yùn)動(dòng)效果，帶尾巴淡出效果。

10.Graph Layout

一種交互的力向圖布局效果，刷新三觀。

11.Typographic Effects

使用HTML5 Canvas實(shí)現(xiàn)的文本特性，效果超過Flash。

12.Crazy Tentacles

移動(dòng)鼠標(biāo)可以進(jìn)行涂鴉，點(diǎn)擊鼠標(biāo)可以清除畫布，看著確實(shí)瘋狂。

13.Nebula

吸引眼球的粒子系統(tǒng)，目的是測(cè)試WebGL性能，如果滑動(dòng)鼠標(biāo)，可以產(chǎn)生絢麗效果。

14.WebGL Globe

WebGL Globe 是一個(gè)開放的地理數(shù)據(jù)可視化平臺(tái)，我們鼓勵(lì)你復(fù)制代碼，添加自己的數(shù)據(jù)，創(chuàng)建自己的應(yīng)用。

15.Particle Playground

用鼠標(biāo)和粒子進(jìn)行交互，能發(fā)現(xiàn)不一樣的精彩。

16.Surface

使用WebGL實(shí)現(xiàn)的水面特效實(shí)驗(yàn)，可放入一張照片，使用鼠標(biāo)觸動(dòng)水面會(huì)有奇特效果。

上面的HTML5和JavaScript特效，簡(jiǎn)直趕超F(xiàn)lash。W3Cschool上面有很多用戶留言稱HTML5和JavaScriptit將替代Flash，不過對(duì)于這種說法，也不知道怎么去評(píng)判。畢竟這些用戶說的也是很有道理，你認(rèn)為JavaScriptit會(huì)替代Flash嗎?很想知道你的答案!

公眾號(hào)：w3c技術(shù)教程

提供專業(yè)的web技術(shù)教程、手冊(cè)、工具。

T之家3月4日消息 Remote Desktop遠(yuǎn)程桌面是一項(xiàng)非常有用的技術(shù)，用于支持和遠(yuǎn)程工作。微軟已經(jīng)為Windows 10、Win10 Mobile、iOS、Mac OS X和Android推出了官方的Remote Desktop客戶端。

不過更佳的方式是使用網(wǎng)頁(yè)版客戶端，無需安裝任何軟件程序，開放的Web接口是通用的解決方案。

IT之家報(bào)道，微軟最近推出了一款基于HTML 5的預(yù)覽版Web客戶端，稱為RD Web客戶端。當(dāng)然這也需要在服務(wù)器機(jī)器上安裝軟件，支持Edge瀏覽器、IE11、Google Chrome、Firefox和Safari瀏覽器訪問。不過遺憾的是，移動(dòng)版客戶端還不支持該功能。

想看到更多這類內(nèi)容？去APP商店搜IT之家，天天都有小歡喜。

在線咨詢

上一篇：網(wǎng)頁(yè)編程之文字標(biāo)題：H1、H2到H6
下一篇：如何利用HTML5實(shí)現(xiàn)音頻和視頻嵌入的方法

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。

整合營(yíng)銷服務(wù)商

做HTML5，需要哪些工具？

編輯方式

您的項(xiàng)目需求

做HTML5，需要哪些工具？