【中培課堂】2016最新HTML5基礎(chǔ)指南!
參加2016HTML5培訓(xùn)最新基礎(chǔ)指南!從HTML5的基礎(chǔ)出發(fā),通過各種精彩的實例,將走進(jìn)HTML5的精彩世界。各種實例精彩紛呈且通俗易懂,深入淺出,引人入勝。詳細(xì)講解HTML5技術(shù)的各個部分,深入到HTML5的核心,充分學(xué)習(xí)并體驗HTML5。 越分享越成功,想做好一件事,必須要花費一些功夫,然后是多學(xué)、多思、多練、多交流、多總結(jié),發(fā)現(xiàn)自己的問題,然后一定要克服,在狀態(tài)不好的情況下,往往要及時調(diào)整。新手學(xué)習(xí)前端的話,一定要想想為什么要學(xué)習(xí)它,是出于一種什么心態(tài),然后定位好自己,多向大牛請教,多教一些沒有自己水平高的人,那樣往往能讓自己成長的快,切勿急躁。 初學(xué)可以看一些入門視頻教程,之后可以買一些書,做一些小項目,要學(xué)會投資,分析自己的現(xiàn)狀及能力,實時調(diào)整,一定要有自己的想法,懂得創(chuàng)新。在這里一定要對自己做分析,然后找出一種適合的學(xué)習(xí)方法。 一個優(yōu)秀的前端開發(fā)工程師必備的知識技能!到底有哪些知識點。在此附兩張前端知識點總結(jié)圖: 圖.1 圖.2 1)有一定web基礎(chǔ)的技術(shù)人員,深入學(xué)習(xí)移動HTML5新技術(shù) 2)產(chǎn)品、設(shè)計人員,對HTML5及周邊技術(shù)能得到很好的了解和提高 3)移動HTML5基礎(chǔ)Java詳解 1. Basic Java 1) HTML5頁面的層級結(jié)構(gòu)剖析 2) 實例詳解:Hello World的文檔結(jié)構(gòu) 2. Java變量 1) 函數(shù)中變量的使用 2) 實例詳解:Java陷阱知多少 3. 執(zhí)行環(huán)境和作用域 4. 引用類型 1) Object對象 2) 日期對象 3) 實例詳解:上線時間的地雷千萬不要踩 4) Java小技巧之a(chǎn)pply和call 5. JSON 6. 面向?qū)ο蟆 ?) Java對象簡介 2) 工廠模式 3) 原型模式 4) 構(gòu)造函數(shù) 5) 面向?qū)ο髮嵗斀猓夯麅缘木帉憽 ?. BOM 1) BOM的重要性 2) location你不知道的那些事 3) navigator行業(yè)標(biāo)準(zhǔn) 4) 實例詳解:獲取用戶的分布 8. DOM 1) 移動手機(jī)頁面層級結(jié)構(gòu)的再探究 2) 實例詳解:兼容pc與移動端的任意添加塊 9. 事件處理 1) 冒泡和捕獲的歷史是與非 2) 事件監(jiān)聽機(jī)制的重要 3) 實例詳解:隨手指拖拽的小方塊 10. 閉包 11. Ajax與Comet 1) Ajax的興起與Java的血淚史 2) Comet機(jī)制的引入 3) 實現(xiàn)Comet的兩種方式 12. Java調(diào)試與監(jiān)控 1) 調(diào)試工具一覽 2) Chrome面板 3) 深度瀏覽你的頁面,各種資源盡收眼底 4) 熟悉網(wǎng)絡(luò)的情況 二、 移動HTML5精彩世界 1. 移動HTML5的殺手效應(yīng)——新浪移動H5網(wǎng)站架構(gòu)分析 1) HTML5到底是什么? 2) 為何H5能在這幾年快速的發(fā)展起來 2. 今日頭條:移動端H5標(biāo)簽全解析 1) 新標(biāo)簽與div到底有什么區(qū)別? 2) 爬蟲從此不再孤單 3. 繪圖canvas的世界 1) 從方圓開始的計算機(jī)圖形學(xué) 2) 手機(jī)財經(jīng):騰訊canvas繪制手機(jī)股票行情圖細(xì)節(jié)分析 3) canvas處理位圖 4) canvas制作動畫 5) 實例詳解:windows98屏保再回憶 6) canvas與flash的性能分析 7) 提高canvas繪圖性能的幾個秘籍 4. HTML5多媒體 1) 如此快捷的多媒體應(yīng)用 2) 如何制作兼容所有瀏覽器的多媒體播放器 3) 把視頻當(dāng)圖片一樣來處理?canvas的威力再現(xiàn)! 4) 實例詳解:九宮格大屏幕 5. 如何通過H5表單提升用戶體驗 1) 移動時代的到來 2) 從chrome瀏覽器的發(fā)展,展望H5表單的未來 6. 本地存儲Local Storage深入探討 1) 傳統(tǒng)cookie與H5本地存儲之間的博弈,到底該選擇誰? 2) 移動百度首頁分析:如何巧妙使用H5提升網(wǎng)站性能,節(jié)省帶寬 3) 動手練習(xí):最簡單的本地存儲程序,計數(shù)器 7. HTML5離線應(yīng)用 1) H5離線應(yīng)用打造終極本地APP 2) HTML5 APP分析:新聞客戶端 8. HTML5跨域請求 1) 新浪與淘寶的合作:頁面之間域的限制 2) 傳統(tǒng)的跨域解決方法 3) 橫空出世HTML5的PostMessage 4) 實例詳解:跨瀏覽器的解決方案 9. H5手機(jī)方向感應(yīng) 1) HTML5與立體三維空間的完美結(jié)合 2) 用HTML5開發(fā)微信“搖一搖”功能 10.如果你是H5規(guī)范制定者,你會如何制定地理定位的規(guī)范? 1) 如何利用手機(jī)H5地理位置,快速測量辦公室大小 2) 地理定位Geo Location深入探究 11. H5實時通訊Web Socket 1) 我們?yōu)槭裁葱枰猻ocket? 2) 新浪網(wǎng)消息推送架構(gòu)詳解:H5本地存儲、跨域post、socket三箭齊發(fā)的結(jié)構(gòu) 12. Java的瓶頸,我們需要更高的效率 1) HTML5的多線程 2) H5線程與線程之間的通訊 13. HTML5展望 1) 微信H5分享的爆發(fā) 2) webAPP與本地APP的選擇“第三天下午 三、 CSS3與移動端HTML5布局 1. 為何移動端HTML5離不開CSS3 1) CSS3概述 2) 實例詳解:Hello World 2. CSS基礎(chǔ)簡述 1) 盒子模型深入解析 2) float排版你所不知道的妙用 3) 多種方法,固定寬度且居中的布局 4) position定位的性能到底怎么樣? 5) 實例詳解:手機(jī)上的一鍵換膚 6) CSS禪意花園 3. 處理移動端的瀏覽器兼容性 1) 常見的手機(jī)瀏覽器兼容性問題詳解 2) CSS Hack在移動端的使用那些事 4. CSS3與移動端HTML5媒體支持 1) 處理不同手機(jī)屏幕的排版 2) 實例詳解:ipad橫豎屏講解分析 5. 外引字體 1) 為什么需要外引字體? 2) 瀏覽器兼容性處理 3) 中文字體的困惑,裁剪字體 6. CSS3分欄 1) 用戶閱讀習(xí)慣的那點事 2) 分欄的制作方法 3) 實例詳解:華爾街日報 7. CSS3與HTML5變幻與動畫 1) 動畫的巧用 2) 實例詳解:圖片幻燈效果 8. CSS3與Java 1) CSS3與js之間的聯(lián)系 四、H5框架及基于zepto的移動HTML5設(shè)計 1. Java框架 1) 為什么我們需要Java框架 2) 框架之間的大比拼 3) 移動端上的框架詳解 2. JQuery 1) 最流行的JQuery 2) 利與弊之間的博弈 3) JQuery實例簡單分析 3. JQuery Mobile 1) JQuery Mobile簡介 2) JQuery Mobile實例簡單分析 4. Sencha Touch 1) Sencha簡介 2) Sencha與jQuery Mobile之間的區(qū)別 3) 你的選擇? 5.zepto 1) zepto的橫空出世 2) 移動端HTML5的利器 6. 框架之間的綜合比較 1) 明確你的需求 2) 選擇合適的框架 7. 基于zepto的移動HTML5設(shè)計 1) zepto中的選擇器 2) 自適應(yīng)手機(jī)屏幕尺寸的解決辦法 3) zepto對DOM元素的操作 4) zepto中引入的那些移動事件 5) 觸屏手勢詳解 五、 HTML5頁面性能優(yōu)化及響應(yīng)式web 1. HTML5頁面性能優(yōu)化 1) 頁面的時間都花在哪里? 2) HTTP請求概覽 3) 減少HTTP請求 4) 使用CDN 5) 采用Gzip技術(shù) 6) 合理放置樣式以及腳本 7) 減少DNS請求 8) 避免重定向 9) 管理您的cookie 2.性能優(yōu)化實踐:新浪首頁性能全解析 3. 響應(yīng)式web設(shè)計 1) 什么是響應(yīng)式設(shè)計 2) 傳統(tǒng)的解決方案 4.如何做一個響應(yīng)式設(shè)計 1) 明確你的需求 2) 找到尺寸突破點 3) 一把雙刃劍 5. 合理使用HTML5和CSS3 1) 一個HTML,多個CSS 2) 處理橫豎屏 3) 圖片的自適應(yīng)選擇 6. 漸進(jìn)增強(qiáng) 1) 什么是漸進(jìn)增強(qiáng) 2) 163的示例 3) 如何應(yīng)對高清屏幕 技術(shù)只是生活的一部分,曾經(jīng)雄心斗志,如今低頭寫碼。改變能改變的,接受不能改變的。人生有限,兄爭朝夕啊。人生學(xué)習(xí)的態(tài)度是:不急不躁,不快不慢。持之以恒,相信自己。不求能改變世界,但求能改變自己的生活。不求健步如飛,但求一步一腳印。感謝磨難,他使我們內(nèi)心更為堅強(qiáng)。 感謝挫折,他使我們不斷的成長,感謝bug,他使我們的思維更加深邃。感謝前端,他使我們更加的相信,撐起一片天空需要十八般武藝。藍(lán)鷗科技:愿你在前端的路上越走越遠(yuǎn)!早日邁向web前端開發(fā)技術(shù)大牛!