何が来るか分からない未来に反応（レスポンシブ）するには、どうしたら良いのでしょうか。それはレスポンシブWebデザインという作り方だけで解決するものではなく、企画／運営／ビジネスモデルなどもレスポンシブでいる必要がでてきます。レスポンシブに対応するために何が必要なのか、どのような解決策が考えられるかを紹介します。

4. 320px 480px 600px 768px 960px 1200px 1600px

5. 320px 480px 600px 768px 960px 1200px 1600px

8. 320px 480px 600px 768px 960px 1200px 1600px

10. Sharp AQUOS Phone Kindle Fire
720x1280 600x1024
BlackBerry Bold 9900 Galaxy Tab
480×640 600×1024
Xperia PLAY SO-01D Arrows Tab LTE
480×854 800x1280
HTC Nexus LG Optimus Pad
480×800 768x1280
LG Optimus LTE Samsung Series 7
720×1280 768x1366

11. 320px 480px 600px 768px 960px 1200px 1600px

12. 27
WOFF: iOS5, Opera Mobile 11+
* No Android Support (yet)
** All major webkits support @font-face

22. @media screen and (max-device-width: 480px) {
style..
}
@media screen and (orientation:portrait) {
style..
}

23. 320px 480px 600px 768px 960px 1200px 1600px

24. 320px 480px 600px 768px 960px 1200px 1600px

27. photo by John Manoogian III

28. Review
Test
Design

29. Review Review Review
Test Test Test
Design Design Design

36. photo by Trey Ratcliff

37. <img src="small.r.jpg" data-fullsrc="large.jpg">

38. <img src="small.r.jpg" data-fullsrc="large.jpg">

41. A
B

42. A
B

43. A
B

49. photo by Trey Ratcliff

51. Do websites need to look exactly the same in every browser?

53. IE8