1. HTML5Photo by Carlos VarelaQcon 2013-4-23Atsushi Miura

2. about.me/atsushi.miura 9 WebUIWeb2DWebSEO()Web AppceleratorTitanium HTML5CSS3JavaScriptFlashPHPJava

3. Photo by LondonAnnie

4. 20.9%79.1% PCPC0 20 40 60 804.1%4.2%6.0%16.2%52.1%39.3%62.6%23http://www.soumu.go.jp/johotsusintokei/statistics/pdf/HR201100_001.pdfWebPC

5. Photo by Leonard John Matthews Photo by World Bank Photo Collection

6.

7. Photo by adactio=

8. Photo by adactioResponsiveWebDesign

9. Photo by adactio

10. Illustration by Tsahi Levent-Levi

11. HTML5 Photo by karola riegler photography

12. HTML5=Technic ?

13. HTML5VocabularyHTML5 MicrodataHTML5 + RDFaApplication CashWeb StrageFile APIWeb WorkersXMLHttpRespons2Web SocketsServer-Sent EventsCSS SelectorCSS NamespaceCSS ColorSVGCanvasWebGLVideoAudioGeolocation APIOrientation EventHTML

14. HTMLCSSJavaScriptCSSPHPCGI

15. StructureUserDeviceContentsTechnicDesign

16. HTMLHTML5VocabularyHTML5 MicrodataHTML5 + RDFaApplication CashWeb StrageFile APIWeb WorkersXMLHttpRespons2Web SocketsServer-Sent EventsCSS SelectorCSS NamespaceCSS ColorSVGCanvasWebGLVideoAudioGeolocation APIOrientation Event

17. Photo by NatBat

18. Photo by yukop

19. Lets start with structure. Lets know what our content is made from.The Personal Disquiet of Mark BoultonStructure First. Content Always. - http://www.markboulton.co.uk/journal/structure-first-content-always

20.

21.

...

Web

Web...

Web...

article section HTML

22. Google Chrome HTML5 Outliner

23. Microdata

Atsushi Miura

196471

atsushi@miura.me

itemscope itemprop HTMLHTML

24.

Alma Pan-Latin Kitchen

33 reviews Rating Details

http://www.yelp.com/biz/alma-pan-latin-kitchen-pittsburghGoogle Web

25. OGPMETAThe Open Graph protocolhttp://ogp.me/OGPOpen Graph ProtocolWebMETAOGPFacebookm i x i G r e e G o o g l e + LinkedInSNSSNS

26. http://www.yelp.com/biz/alma-pan-latin-kitchen-pittsburghFacebook

27. OGPMETAWhats NEW NOTE?http://www.nissan.co.jp/SP/NOTE/SPECIAL/property="og:title"property="og:description"property="og:url"property="og:image"

28. WAI-ARIAhttp://www.w3.org/TR/wai-aria/RDFahttp://www.w3.org/TR/html-rdfa/

29. MicrodataGoogle http://support.google.com/webmasters/bin/answer.py?hl=ja&answer=2722261&topic=21997&ctx=topic

30. Photo by DavidMartynHunt

31. iPad

32.

33. iPad iPad

34. iPad

35.

36. Photo by odonata98

37. Creative CoderPhoto by DavidMartynHunt

38. 3 Reasons Why Learning To Code Makes You A Better Designerhttp://www.uie.com/brainsparks/2011/06/06/3-reasons-why-learning-to-code-makes-you-a-better-designer/t32k.me - http://t32k.me/mol/log/why-valley-wants-designers-can-code/3 Reasons Why Learning To Code Makes You A Better Designer1. 2.3.UI3 Reasons Why Learning To Code Makes You A Better Designer1. 2.3.UI

39. 3,997 distinct devices / 61,389 usersOpenSignal: August, 2012 http://opensignal.com/reports/fragmentation.phpThe many faces of a little green robot

40.

41. Designingin the BrowserNo needPhotoshopDesignFestival - Insights into Form and Function from The Web Designers Roadmaphttp://designfestival.com/insights-into-form-and-function-from-the-web-designer39s-roadmap/Vanseo Design - Workows In A Responsive World: From Waterfall To Agilehttp://www.vanseodesign.com/web-design/responsive-workows/

42. Designing in the BrowserWebWebWeb

43. Illust by mistergeslGoodjob!TechnicIAPresentation=+Creative Coder

44. Photo by tantek? !atsushi@miura.me