課程簡介
HTML5 是目前最為流行的前端網(wǎng)頁構(gòu)建技術(shù)，提供了廣泛而豐富的 API，為制作內(nèi)容豐富的網(wǎng)頁提供
了良豐富的技術(shù)支撐，本課程將結(jié)合移動網(wǎng)頁開發(fā)特點，介紹如何使用 HTML5 這些豐富的 API 來實現(xiàn)
移動互聯(lián)網(wǎng)時代的網(wǎng)頁開發(fā)與設(shè)計。
目標(biāo)收益
掌握 HTML5 的新技術(shù)特性
掌握 CSS3 新技術(shù)特性
掌握移動網(wǎng)頁開發(fā)的主要技術(shù)特點
培訓(xùn)對象
希望使用 HTML5 構(gòu)建網(wǎng)頁的前端開發(fā)人員
課程大綱
| HTML5新的頁面組織標(biāo)記 | HTML5中從應(yīng)用角度出發(fā)提供了許多新的網(wǎng)頁標(biāo)記，專門用于定位各種網(wǎng)頁內(nèi)容，本節(jié)課程我們將介紹這些新標(biāo)記，并說明如何使用這些新標(biāo)記來組織你自己的文檔結(jié)構(gòu) |
| 智能表單設(shè)計 | 數(shù)據(jù)提交從來都是web應(yīng)用設(shè)計中的重要部分，而其中的數(shù)據(jù)格式驗證等功能需要腳本的輔助，HTML5為了解決這一問題提供了一些新的表單樣式工具，為開發(fā)者開發(fā)更智能的表單輸入提供了良好支持，本節(jié)課程著重于介紹如何制作這樣一個智能表單 |
| 引入多媒體對象（video audio webrtc） | 在網(wǎng)頁當(dāng)中播放多媒體對象長期以來一直都是多媒體控件的專利，從HTML5開始，HTML標(biāo)記中也可以引入多媒體音頻和視頻，如何應(yīng)用這些新標(biāo)記讓自己的網(wǎng)頁內(nèi)容更豐富呢，本節(jié)課程將帶大家制作一個簡單的多媒體應(yīng)用，來分享這一特性 |
| Canvas 對象你的畫布: |
網(wǎng)頁中直接繪制圖表也曾經(jīng)是控件壟斷的天下，各種圖報表的繪制曾經(jīng)困擾著廣大開發(fā)者，現(xiàn)在 HTML5 中引入了原生的圖形繪制工具，可以讓你在 HTML 代碼中直接繪制圖表，本節(jié)課程將介紹如何使用這一 功能 |
|
擴(kuò)展圖形標(biāo)記 |
本節(jié)課程介紹一些新的圖形繪制方式和對象，幫助開發(fā)者更好的繪制自己的圖形應(yīng)用 |
|
HTML5 中的地理應(yīng)用 |
LBS（Location Based Service）是基于位置的服務(wù)縮寫，LBS 應(yīng)用目前已經(jīng)成為了移動互聯(lián)網(wǎng)時代的新興 的最重要應(yīng)用。HTML5 中提供了對 LBS 的天然支持，可以讓用戶方便的開發(fā)出基于地理位置的網(wǎng)頁應(yīng) 用。本節(jié)課程介紹如何使用這一特性 |
| 獨立數(shù)據(jù)存儲 | Web應(yīng)用中經(jīng)常需要做一些異步交互，此次HTML5中專門提供了用于在后臺取回數(shù)據(jù)的連接對象，本節(jié)課程介紹如何使用這一連接對象進(jìn)行工作 |
|
Web Workers |
Web 開發(fā)中經(jīng)常需要大量的交互式腳本，其中一些腳本耗時費力，影響響應(yīng)時間，降低用戶體驗，為了 解決這一問題 HTML5 提供了一個獨立線程，專門用于在后臺運(yùn)行各種腳本，大大提高了用戶響應(yīng)，這 就是本節(jié)課程介紹的 Web Worker 技術(shù)。本節(jié)課程通過兩個例子說明這一技術(shù)的優(yōu)勢。為廣大開發(fā)者開 發(fā)具有良好性能的 Web 應(yīng)用提供幫助。 |
|
CSS3 技術(shù) |
CSS3 概述 CSS 簡史 CSS3 新特點 CSS 基礎(chǔ)簡述 盒子模型 float 排版 position 定位 固定寬度且居中的布局 實例：一鍵換膚 CSS3 媒體支持 處理不同屏幕的排版 實例：ipad 橫豎屏 CSS3 透明度 不同瀏覽器的兼容問題 塊透明與文字透明 外引字體 字體的重要性 中文字體的困惑 實例：裁剪字體 CSS3 分欄 用戶的閱讀習(xí)慣 實例：華爾街日報 CSS3 盒子屬性 排版模型的改變 盒子屬性特點 實例：自動適應(yīng)的排版 CSS3 變幻與動畫 動畫的運(yùn)用 實例：變化的菜單 CSS3 與 javascript CSS3 與 js 之間的聯(lián)系 控制你的動畫 CSS3 的其它特性 |
|
移動應(yīng)用框架及其特點 |
IPhone 適配框架 Android 適配框架 微信適配框架 WebApp 架構(gòu) 混合應(yīng)用與打包 |
|
HTML5新的頁面組織標(biāo)記 HTML5中從應(yīng)用角度出發(fā)提供了許多新的網(wǎng)頁標(biāo)記，專門用于定位各種網(wǎng)頁內(nèi)容，本節(jié)課程我們將介紹這些新標(biāo)記，并說明如何使用這些新標(biāo)記來組織你自己的文檔結(jié)構(gòu) |
|
智能表單設(shè)計 數(shù)據(jù)提交從來都是web應(yīng)用設(shè)計中的重要部分，而其中的數(shù)據(jù)格式驗證等功能需要腳本的輔助，HTML5為了解決這一問題提供了一些新的表單樣式工具，為開發(fā)者開發(fā)更智能的表單輸入提供了良好支持，本節(jié)課程著重于介紹如何制作這樣一個智能表單 |
|
引入多媒體對象（video audio webrtc） 在網(wǎng)頁當(dāng)中播放多媒體對象長期以來一直都是多媒體控件的專利，從HTML5開始，HTML標(biāo)記中也可以引入多媒體音頻和視頻，如何應(yīng)用這些新標(biāo)記讓自己的網(wǎng)頁內(nèi)容更豐富呢，本節(jié)課程將帶大家制作一個簡單的多媒體應(yīng)用，來分享這一特性 |
|
Canvas 對象你的畫布: 網(wǎng)頁中直接繪制圖表也曾經(jīng)是控件壟斷的天下，各種圖報表的繪制曾經(jīng)困擾著廣大開發(fā)者，現(xiàn)在 HTML5 中引入了原生的圖形繪制工具，可以讓你在 HTML 代碼中直接繪制圖表，本節(jié)課程將介紹如何使用這一 功能 |
|
擴(kuò)展圖形標(biāo)記 本節(jié)課程介紹一些新的圖形繪制方式和對象，幫助開發(fā)者更好的繪制自己的圖形應(yīng)用 |
|
HTML5 中的地理應(yīng)用 LBS（Location Based Service）是基于位置的服務(wù)縮寫，LBS 應(yīng)用目前已經(jīng)成為了移動互聯(lián)網(wǎng)時代的新興 的最重要應(yīng)用。HTML5 中提供了對 LBS 的天然支持，可以讓用戶方便的開發(fā)出基于地理位置的網(wǎng)頁應(yīng) 用。本節(jié)課程介紹如何使用這一特性 |
|
獨立數(shù)據(jù)存儲 Web應(yīng)用中經(jīng)常需要做一些異步交互，此次HTML5中專門提供了用于在后臺取回數(shù)據(jù)的連接對象，本節(jié)課程介紹如何使用這一連接對象進(jìn)行工作 |
|
Web Workers Web 開發(fā)中經(jīng)常需要大量的交互式腳本，其中一些腳本耗時費力，影響響應(yīng)時間，降低用戶體驗，為了 解決這一問題 HTML5 提供了一個獨立線程，專門用于在后臺運(yùn)行各種腳本，大大提高了用戶響應(yīng)，這 就是本節(jié)課程介紹的 Web Worker 技術(shù)。本節(jié)課程通過兩個例子說明這一技術(shù)的優(yōu)勢。為廣大開發(fā)者開 發(fā)具有良好性能的 Web 應(yīng)用提供幫助。 |
|
CSS3 技術(shù) CSS3 概述 CSS 簡史 CSS3 新特點 CSS 基礎(chǔ)簡述 盒子模型 float 排版 position 定位 固定寬度且居中的布局 實例：一鍵換膚 CSS3 媒體支持 處理不同屏幕的排版 實例：ipad 橫豎屏 CSS3 透明度 不同瀏覽器的兼容問題 塊透明與文字透明 外引字體 字體的重要性 中文字體的困惑 實例：裁剪字體 CSS3 分欄 用戶的閱讀習(xí)慣 實例：華爾街日報 CSS3 盒子屬性 排版模型的改變 盒子屬性特點 實例：自動適應(yīng)的排版 CSS3 變幻與動畫 動畫的運(yùn)用 實例：變化的菜單 CSS3 與 javascript CSS3 與 js 之間的聯(lián)系 控制你的動畫 CSS3 的其它特性 |
|
移動應(yīng)用框架及其特點 IPhone 適配框架 Android 適配框架 微信適配框架 WebApp 架構(gòu) 混合應(yīng)用與打包 |
近期公開課推薦
