1. MOBAS Tutorial 2010 Tutorial on Mobile Applications & Systems 2010.10.29 권오현, 김기환

2. 목차 Background – 왜 HTML5 가 대두되는가 ? – 앞으로의 웹 개발의 방향은 ? Overview of HTML5 –HTML5 개요 –HTML5 표준안 개발 현황 Examples of HTML5 –HTML5 가 적용된 사이트의 모습은 ?

3. BACKGROUND MOBAS Tutorial 2010

4. Smartphone Wars 2007 : Success of iPhone 2008 : Success of AppStore iPhone : Mobile internet machine iPhone + AppStore : Application contents matter

5. Mobile Apps Wars Apple is the only winner 20M iPhone & iPod touch (iOS) users in 2008 iPod, iPhone2G, iPhone3G users Followers can’t defeat this

6. Anti Apple alliances Operators Handset markers Too many platforms –Windows Mobile, Limo, Android, Brew, SHP, Symbian, Proprietary OS, WebOS… What can be the cross platform?

7. It’s WEB! Cross Device Cross Platform

8. History of Web HyperText –1965, Nelson HyperCard –1987, apple World Wide Web –1990, CERN Tim Berners-Lee Mosaic Web Browser –1993, Marc Andreeseen & Eric Bina WWW Consortium –1994, http://www.w3c.orghttp://www.w3c.org

9. HTML versions 1991, HTML 1.0 (Berners-Lee) 1995, HTML 2.0(IETF) 1997, HTML 3.2(W3C) 1997, HTML 4.0(W3C) 1999, HTML 4.01(W3C) 2000, XHTML 1.0(W3C) ??, XHTML2.0(W3C)

10. WHATWG Web Hypertext Application Technology Working Group –Open Community, 2004 Developing –Web Form 2.0, Web Application 1.0

11. Why “new HTML”? Fail of XHTML2 Developer Productivity Browser Compatibility Rich Web functions Now, Web is a Platform –Web on Everything

12. Why HTML5? For Desktop For Mobile For Any Devices

13. Why HTML5? IT goes to CE Market –Web + CE industry –Web will be the key technology

14. Youtube IE6 support ended http://techcrunch.com/2010/07/07/youtube-iphone-mobile-html5/

15. Vimeo uses HTML5 http://venturebeat.com/2010/08/17/vimeo-uses-html5-to-get-more-iphone-friendly/

16. Google & HTML5 http://www.engadget.com/2010/04/02/google-tweaks-gmails-html5-web-app-to-better-utilize-ipad-scree/

17. Apple & HTML5 http://www.apple.com/html5/

18. 향후 모바일 애플리케이션 전망 Issues related with HTML5 –Performance, Development tools, time Outlook –HTML5 Web App It is appropriate for multi-platform environment Webkit based browser is so popular in the mobile HTML5 web appis more faster than legacy web app HTML5 based Private Web Store Hybrid Mobile Application –phoneGap, QuickConnect, Titanium, etc

19. 향후 모바일 애플리케이션 전망 보안 이슈가 대두 –Mobile device 의 Context Sensor 정보가 HTML 의 API 로 제공되는 과정에서의 보안 문 제가 중요한 이슈로 다뤄지고 있음

20. OVERVIEW OF HTML5 MOBAS Tutorial 2010

21. What is “HTML5”? 웹문서를 만들기 위한 기본 프로그래밍 언 어 HTML 의 최신 규격 액티브 X 를 포함한 기타 여러 플러그인을 설치하지 않고도 동일한 기능을 구현 – 어도비 플래시나 마이크로소프트의 실버라이 트, 썬의 자바 FX 와 같은 플러그인 기반의 인터 넷 어플리케이션에 대한 필요를 줄이는 데 목 적을 둠 http://ko.wikipedia.org/wiki/HTML5

22. HTML5 표준화 W3C WGs related with HTML5 –HTML WG HTML5, HTML+RDFa, HTML Microdata, HTML Canvas 2D Context, HTML: The Markup Language, HTML5 diffs from HTML4, etc –Web Application WG Web Storage, Indexed Database API, File API, Server-Sent Event, Web Sockets API, Web Workers, Programmable HTTP Caching and Serving, Web SQL Database, etc –Device APIs and Policy WG Calendar, Contact, Media Capture, Messaging, System Information, File Writer, Gallery, Powerbox, Application Launcher, etc –Geolocation WG Geolocation API, DeviceOrientation Event, Acceleration –New WGs Web Notification WG, Touch Interfface WG, Web Performance WG

23. W3C HTML WG Old Milestones (This schedule was removed) –2007-05 HTML5 and Web Forms 2.0 specs adopted as basis for review –2007-11 HTML Design Principles First Public Working Draft –2008-02 HTML5 First Public Working Draft –2010-01 HTML5 Last Call Working Draft –2010-12? HTML5 Candidate Recommendation –2012-01? HTML5 Proposed Recommendation –2012-03? HTML5 Recommendation New Milestones (2010/09/07) –2010 년 10 월 1 일 : HTML5 표준 초안 Last Call –2011 년 5 월 22 일 : HTML5 표준 초안 Last Call 종료 http://www.w3.org/QA/2010/09/html5_getting_to_last_call.html

24. HTML5 Structure HTML5 HTML

25. HTML5 Structure Structure and SemanticAPIs

26. HTML5 Structure http://html5.creation.net/flow-element/html5-flow-element-detection.jpg

27. Device + HTML5 웹 애플리케이션이 자바스크립트를 이용해 서 디바이스의 기능을 활용할 수 있는가 ? HTML + 자바스크립트 + CSS 웹 플랫폼 (platform specific) GPS, contacts, photo, SMS 등 자바스크립트 표준 API 플랫폼 제공 API

28. HTML5 Features for Mobile Offline web apps Geolocation Web Socket Web Storage Video / Audio Web Workers Web Font Web Form Canvas / SVG More features….http://html5rocks.comhttp://html5rocks.com

29. [Ref.] Useful site for HTML5 http://www.w3.org/html/wg http://webstandards.or.kr/html5 http://html5rocks.com http://html5test.com http://html5doctor.com http://html5demos.com http://www.html5video.org http://html5gallery.com

30. EXAMPLES OF HTML5 MOBAS Tutorial 2010

31. Apple HTML5 Showcase http://www.apple.com/html5/

32. Youtube HTML5 Version http://www.youtube.com/html5

33. HTML5STUDIO http://studio.html5rocks.com/

34. HTML5Demos.com http://html5demos.com/

35. Asteroids HTML5 Canvas and JavaScript demo http://www.kevs3d.co.uk/dev/asteroids/