Your SlideShare is downloading. ×
0
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Solutions for a_world _of_countless_devices
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Solutions for a_world _of_countless_devices

3,559

Published on

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

No Downloads
Views
Total Views
3,559
On Slideshare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
1
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 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. Viewports
  • 3. Viewports
  • 4. Viewports
  • 5. Viewports
  • 6. Meta viewport<meta name=”viewport”content=”width=device-width”>
  • 7. Media queries@media all and (max-width: 600px) { .sidebar { float: none; }}
  • 8. Meta viewport + media queries= repsonsive web design
  • 9. Responsive Web Design<meta name=”viewport”content=”width=device-width”>@media all and (max-width: 600px) { .sidebar { float: none; }}
  • 10. Interaction modes
  • 11. No hover
  • 12. No hover• There is no hover on touchscreen devices
  • 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. 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. 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. 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

×