1. Web 2. Front-End-Engineer LIG.inc Twitter : @seito_horiguchi 3. 1. 2. 3. 4. 5. 4. 5. 6. JOURNAL STANDARD relumehttp://journal-standard.jp/special/relume/paper/ 7. PCWeb Web 8. 1HTMLCSS3Media Queries 5Web LIGBLOG http://liginc.co.jp/designer/archives/6154 9. Q. 10. 1. 2.SEO 3. . 11. 1. 12. Q. /!!!Web http://tokidoki-web.com/2013/01/ 13. Q. 320px 14. Q. TVetc 15. Q. 16. 1 Q. 17. 18. 19. 20. 21. 22. 23. 24. 25. Web 26. 27. SEO 28. SEO URL1 SEO Google Developers https://developers.google.com/webmasters/mobile-sites/mobile-seo/common-mistakes/faulty-redirects?hl=ja http://googlewebmastercentral-ja.blogspot.jp/2015/02/nding-more-mobile-friendly-search.html 29. SEO SEO 30. 31. 32. % 5Web LIGBLOG http://liginc.co.jp/designer/archives/6154 33. studio-yoggy http://www.studio-yoggy.com/ 34. HTML,CSS,JS 35. viewport 36. //PC // @media screen and (max-width: 767px) { } // @media screen and (min-width: 768px) and (max-width: 1080px) { } media queries 37. display display: block; // or none @media screen and (max-width: 767px) { .header { display: none; } .sp-header { display: block; } } 38. box-sizing: border-box; .hoge { box-sizing: border-box; width: 100%; border: 1px solid #ccc; padding: 0 10px; } box-sizing 39. JS IE8 respond.js https://github.com/scottjehl/Respond css3-mediaqueries.js https://code.google.com/p/css3-mediaqueries-js/ 40. 41. SVG JS wikipedia http://ja.wikipedia.org/wiki/Scalable_Vector_Graphics 42. SVG IE8 wikipedia http://ja.wikipedia.org/wiki/Scalable_Vector_Graphics 43. Web SVG SVG Font-Awesome http://fortawesome.github.io/Font-Awesome/icons/ 44. Web Webicomoon https://icomoon.io/ Android Font-Awesome http://fortawesome.github.io/Font-Awesome/icons/ 45. 46. 47. codrops codrops http://tympanus.net/codrops/ 48. DeNA DeNA http://dena.com/jp/ 49. litrois EC litrois http://litrois.jp/ 50. Haruki Murakami Haruki Murakami http://www.harukimurakami.com/ 51. 52. twitter twitter https://twitter.com/ SNS 53. https://www.mangabox.me/ 54. 55. 56. etc or 57. 58. Special Thanks Twitter : @frontainer http://frontainer.com/ 59. Thank you! @seito_horiguchi 60. 61. https://www.wantedly.com/campaign/ real_wantedly_3 2015325()12:0015:00 13 62. https://poole-job.jp/Poole 63. () 14002000 () 10002000