【課程介紹】
一、什么是HTML5
1、一次編寫,隨處部署--HTMl5可以在多種設備上運行,這是其他方式都無法做到的.
2、在互聯網中分享--HTML5應用都有一個URL,因此它可以在互聯網中被隨意分享,并且在搜索時即可被找到。
3、多廠商標準,建立在協議之上--HTML5是眾多公司努力的結果,沒有一家廠商可以左右它的方向。
4、適用于多種環境--HTML5應用可以使用交互式設計來提供佳體驗,而不需要更改代碼。你可以從桌面到手機到平板電腦無縫進行切換,而無需重復安裝不同的應用。
二、HTML5發展前景
1、HTML5是WEB的未來,不僅在電腦端,而且在移動端也一定會得到廣泛的應用。
2、據統計2013年全球將有10億手機瀏覽器支持HTML5,同時HTML Web開發者數量將達到200萬。
3、毫無疑問,HTML5將成為未來5-10年內,移動互聯網領域的主宰者。據IDC的調查報告統計,截至2012年5月,有79%的移動開發商已經決定要在其應有程序中整合HTML5技術。
4、WEB技術發展越來越迅速,HTML5的到來更是把WEB技術推向了,目前HTML5技術已經日趨成熟,HTML5的未來十分光明,值得我們去學習。
三、HTML5可以做什么
除了實現之前HTML可以實現的功能外,HTML5做以下特別的事情:
1、本地存儲 基于HTML5開發的網頁APP擁有更短的啟動時間,更快的聯網速度,這些全得益于HTML5 APP Cache,以及本地存儲功能。
2、實現多媒體更加簡單 利用HTML5的video和audio非常方便的在網頁上添加視頻和音頻,不需要很復雜的代碼,就能打造一款功能齊全的HTML5播放器。
3、三維圖形和動畫 HTML5的3D引擎卻可以更方便的實現3D效果,而且更加逼真。
4、CSS3的運用 CSS3提供更多的CSS屬性,可以做更豐富的渲染效果。
四、HTML的優勢
1、一次編寫,隨處部署--HTMl5可以在多種設備上運行,這是其他方式都無法做到的.
2、在互聯網中分享--HTML5應用都有一個URL,因此它可以在互聯網中被隨意分享,并且在搜索時即可被找到。
3、多廠商標準,建立在協議之上--HTML5是眾多公司努力的結果,沒有一家廠商可以左右它的方向。
4、適用于多種環境--HTML5應用可以使用交互式設計來提供佳體驗,而不需要更改代碼。你可以從桌面到手機到平板電腦無縫進行切換,而無需重復安裝不同的應用。
【課程內容】
一、設計基礎
1、photoshop應用
基本的使用方法和技巧,及新增功能、圖層的基本概念與應用、圖像的各種選擇應用及操作技巧。
2、illustrator應用
內容包括Illustrator概念,繪圖與著色,畫筆和符號,文本和漸變、漸變網格和混合,透明度、外觀屬性、圖層與蒙版等工具運用,著重講解一些常用的應用技巧。
3、多種風格界面設計
WEB界面設計的內容和規范。
掌握各類網站的網頁特點認知,了解流行的設計風格,根據不同特點進行頁面視覺設計,達到建站目標。
4、蘋果與安卓移動界面設計
了解安卓與蘋果不同的規范原則,針對與不同的平臺要求進行設計。
二、WEB前端基礎
1、HTML基礎
前端開發環境配置(DreamWeaver、Notepad++、HBuilder、PhpStorm),HTML快速入門,熟悉文本、圖像、鏈接、表格、列表、表單等標簽使用方法。
2、CSS詳解
CSS的基礎和入門。了解CSS的使用方式及優先級。熟悉CSS字體樣式、段落樣式、背景樣式、布局樣式設置、常用樣式在不同瀏覽器的兼容解決方案和CSS優化。
3、靜態網頁實現實戰
學員在講師的專業指導下,規范的將階段設計的WEB界面從零開始,實現成靜態網頁作品。充分了解和熟悉網頁布局的常用結構、常用樣式處理和兼容方案。
4、HTML5和CSS3核心
熟悉HTML5新特性,新標簽如audio、video、svg、canvas的使用。
熟悉CSS3新增選擇器、特性、動畫的應用,以及結合SVG制作常見動畫、動效豐富頁面體驗。
熟悉背景圖合并技術、常用布局技術、結構優化技巧等。
5、HTML5和CSS3應用實戰
JavaScript的基本數據類型、常量、變量、運算符、數組、流程控制語句。 熟悉JavaScript中的對象、函數,類和面向對象結構的編程。 了解Document對象、節點樹模型,節點操作、文檔操作、Window對象、Screen對象、定時器、Location對象、History對象等。
6、JavaScript語言和面向對象
充分運用HTML5中的新特性構建修改頁面內容,融入豐富的CSS3動畫、動效,來理解和掌握用戶體驗的重要性以及如何通過細節來提高用戶體驗決定一個作品的成敗。
7、正則表達式
熟悉JavaScript中RegExp對象的使用,常用的方法、場景,以及技巧練習,能書寫常見表達式如“用戶名格式、郵箱格式、日期格式、網址格式”等。
8、DOM編程和AJAX
Bitmap 熟悉文檔結構中的節點增、刪、改操作,document、window、form、table對象的深入了解和使用。熟悉HTML文檔流中的事件機制及使用方法、技巧,以及事件冒泡、阻止,瀏覽器兼容等。
9、異步加載項目實戰
通過異步刷新機制,實現大批量內容(以圖片瀑布流為例)的延遲加載,從而優化頁面性能,進一步優化提高用戶體驗。
10、JavaScript常見面試題講解
目前如騰訊、百度、阿里巴巴等大型企業面試中常用的JavaScript面試題分析和講解。
11、京東專題頁
熟悉常見的大型專題頁實現細節、處理技巧,掌握企業應用開發中常用的開發技巧。
三、WEB前端框架
1、jQuery框架
了解jQuery的基本語法,鏈式操作、隱式迭代的特性,jQuery選擇器、屬性樣式、HTML操作、事件、動畫、AJAX等。熟悉jQuery的插件擴展機制,了解第三方插件的使用和常用設計方法。熟悉自定義插件設計,以及常見的問題和注意事項。
2、jquery實戰
結合運用HTML5、CSS3、JavaScript、JQuery知識模擬實現window桌面操作系統,如window窗口、桌面圖標、雙擊打開應用、任務欄、時間日期等操作系統元素。
3、LESS樣式預處
熟悉CSS預處理語言的設計、編譯和運用技巧,以及配置LESS的開發環境。熟悉LESS變量、混合、嵌套、運算、函數、作用域、注釋、import。
4、樣式實戰
在學習Bootstrap之前,先行分析、實現按鈕組、輸入框組、選項卡等常見布局組件,為后面的課程提供知識儲備和指導
5、Bootstrap框架
基礎模板的使用,可視化布局工具使用,字體圖標、表格、表單、Tab選項卡等。網格系統和布局、響應式布局,常用排版技巧,以及按鈕組、輸入框組、導航欄、頁標題、縮略圖、列表組、面板和JavaScript插件使用技巧。
6、vue框架
vue事件和控件的使用,指令及過濾器的實現,vue核心組件的使用,自定義組件及常用插件開發,通過過渡動畫提升用戶體驗,大型應用的開發規范和技術。
四、后端開發
1、PHP語言后端開發
熟悉PHP語言基礎, 表單的驗證及處理,文件上傳,Cookies和Seesions的使用,異步AJAX數據傳輸,數據交互及API接口開發等。
2、NodeJS后端
理解這門神奇的服務端“JavaScript”語言,及其非阻塞式特性,模塊化和npm包管理器使用,事件、路由、數據交互方法等。
五、項目實戰
1、移動項目實戰
移動端微閱讀網站整站項目實戰,綜合運用前端框架、AJAX數據交互、移動UI組件技巧,按照企業標準流程進行需求分析、項目構建、頁面設計,框架運用等,終實現整體項目的開發。
2、游戲專題實戰
移動端廚藝類網站整站項目實戰,熟練常用組件的開發原理和技巧,如評論版塊、下拉菜單、邊欄菜單、分享版塊、導航欄、滑塊按鈕、下拉刷新等。
3、攝影網站實戰
婚紗攝影主題網站首頁制作實戰,結合運用新框架解決網站兼容性問題。
【師資介紹】
張雄軍
HTML5產品副總監
10余年互聯網從業經驗,熟練Web前端及移動前端開發。熟練 PHP+MySQL 架構各類型后端開發。精通FLASH視覺設計,AIR桌面應用、以及AS3頁游開發、Web前端插件開發。擅長Web網站、Web APP、數據服務、OA辦公、后臺管理、企業應用、FLASH游戲等。
【教學環境】