Solutions for a_world _of_countless_devices

3,758 views

Published on

Published in: Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,758
On SlideShare
0
From Embeds
0
Number of Embeds
2,949
Actions
Shares
0
Downloads
1
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Solutions for a_world _of_countless_devices

  1. 1. Installed base Q2 2012 2011 2010Android 41% 27% 9%Symbian 25% 35% 49%iOS 19% 16% 11%BlackBerry 10% 12% 14%bada 2% 1% -Windows Phone 1% 1% -Other 3% 8% 17% Source: Tomi Ahonen
  2. 2. Viewports
  3. 3. Viewports
  4. 4. Viewports
  5. 5. Viewports
  6. 6. Meta viewport<meta name=”viewport”content=”width=device-width”>
  7. 7. Media queries@media all and (max-width: 600px) { .sidebar { float: none; }}
  8. 8. Meta viewport + media queries= repsonsive web design
  9. 9. Responsive Web Design<meta name=”viewport”content=”width=device-width”>@media all and (max-width: 600px) { .sidebar { float: none; }}
  10. 10. Interaction modes
  11. 11. No hover
  12. 12. No hover• There is no hover on touchscreen devices
  13. 13. No hover• There is no hover on touchscreen devices• No way of saying “I might be interested in this element, but I’m not sure yet.”
  14. 14. No hover• There is no hover on touchscreen devices• No way of saying “I might be interested in this element, but I’m not sure yet.”• It’s technically very hard: finger above the screen has to be detected
  15. 15. No hover• There is no hover on touchscreen devices• No way of saying “I might be interested in this element, but I’m not sure yet.”• It’s technically very hard: finger above the screen has to be detected• Sony recently announced the Xperia Sola, which seems to do this trick
  16. 16. No hover• There is no hover on touchscreen devices• No way of saying “I might be interested in this element, but I’m not sure yet.”• It’s technically very hard: finger above the screen has to be detected• Sony recently announced the Xperia Sola, which seems to do this trick• But even then your finger obscures the screen

×