HTML5-sovelluskehitys

HTML5-sovelluskehitys

1. päivä

Miksi HTML5?

• Mobiilikäytön räjähdys
• Apua sovelluksiin
• Eroon Flashista

HTML5-sivu

• Sivun rakenne
• Uudet HTML5-elementit
• Erot HTML4:een verrattuna

Lomakkeet

• Auta mobiilikäyttäjää uusilla input-tyypeillä
• Käytettävyys ja validointi

CSS3

• Helppoa visuaalisuutta: Pyöristykset, gradientit ja heittovarjot
• Piirrä CSS:llä!
• Flashia ilman Flashia: Transformaatiot, transitiot ja animaatiot
• Varaudu eri päätelatteisiin: Media queryt
• Uudet valitsimet
• Viimeinkin järkeviä layout-ratkaisuja: border-box, calc() ja flexbox

Canvas

• HTML5:n ohjelmalliset piirto-ominaisuudet
• Pikselipiirto JavaScript:llä

SVG

• Vektorigrafiikkaa XML:llä
• Efektit mukaan CSS:llä
• Ja ohjelmointi JavaScript:llä

Lisätietoa: Same-origin policy

• JSONP
• CORS

Paikkatiedon hallinta

• Geolocation API: Mahdollisuudet
• Paikkatiedon kuuntelu ja hyödyntäminen osana sovellusta

2. päivä

Web Storage

• Merkitys sovelluskehityksessä; offline-sovellusten tuki
• localStorage
• sessionStorage

History API

• Palvele käyttäjiä: Hallitse itse back-painiketta Ajax-sovelluksissa

Web worker

• Säieohjelmointi JavaScript-sovelluksissa

Offline-sovellusten luonti

• Application cache

WebSocket

• WebSocket-liikennöinnin mahdollisuudet
• Selainasiakkaan toteuttaminen
• Palvelun ohjelmoinnin vaihtoehdot; harjoitusesimerkkinä suosittu Node.js

Liite: Cross-document messaging

• Same origin policy -rajoituksen kiertäminen cross-document messaging -tekniikalla

 

Avainsanat: CSS, CSS3, HTML, HTML5, JavaScript