Advanced HTML5 and CSS3

Day 1

1. Custom Media Controls

• HTML5 Media Basics
• Customizing The Controls
• Tracking Playback
• Moving The Playback Position
• Volume Controls
• Lab - Adding Play/Pause

2. Offline Applications

• โครงสร้างของ Offline Application
• Caching types
• Progression of Events

3. Geolocation

• แนะนำการใช้ Geolocation
• การกำหนด Options ต่างๆ
• การแสดงตำแหน่งปัจจุบัน

4. CSS3

• Intro To CSS3
• Using Prefixes For Specific Browsers
• CSS3 Colours And Backgrounds
• CSS3 Gradients
• CSS3 Borders
• CSS3 Image Borders
• Text Effects
• Adding Your Own Web Fonts
• Lab - Adding New CSS3 Styles

Day 2

5. Web storage

• การใช้งาน Web storage
• การสร้าง Task list ด้วย Web storage
• Handling the Storage Event
• Access Methods

6. HTML5 Canvas

• HTML5 Canvas Graphics
• Fills And Strokes
• Creating Paths
• Rounded Corners
• Arcs And Circles
• Drawing Curves
• Gradients Fills
• Pattern Fills And Shadows     
• Canvas Text
• Lab - Adding Canvas Graphics - Part 1
• Lab - Adding Canvas Graphics - Part 2

7. Web worker

• การใช้งาน Web worker
• การประยุกต์ใช้ Ajax กับ Web worker
• ontrolling Web workers

8. Transforms And Animation

• CSS3 Transforms
• CSS3 Transitions
• CSS3 Animation
• Canvas Transforms
• Canvas Animations
• Lab - Create Photo Frames For Images

9. Web sockets

• Web sockets and communication formats
• Web sockets vs HTTP
• Architecture Context

Day 3

10. Microdata

• การใช้งาน Microdata
• Data Vocabulary
• Vocabulary Anatomy

11. Mobile Apps

• Mobile App Web Storage
• Web Storage with Numbers
• Media Queries
• JavaScript Arrays
• Lab - Add Places
• Lab - Show Places

12. Responsive web Design

• รู้จัก Responsive design
• เรียนรู้หลักการออกแบบพื้นฐานแบบ Responsive design ด้วย CSS3
• การประยุกต์ใช้งาน html5 and css3 ในการออกแบบเว็บที่หลากหลายหน้าจอแสดงผล

13. Live Workshop

• ฝึกออกแบบการใช้งาน CSS3 Animation จาก Workshop งานจริงที่น่าสนใจ
• ฝึกออกแบบเว็บเพจแบบ Responsive
• ออกแบบเว็บ Application สำหรับทุกหน้าจอด้วย HTML5 and CSS3