ASP.NET for Mobile and Tablet Development

Damian EdwardsSenior Program ManagerMicrosoft Corporation

mobile is huge

1 billion active mobile broadband

subscriptions

Source: International Telecom Union (http://www.itu.int/ITU-D/ict/statistics/at_glance/KeyTelecom.html)

that‘s one for every 7 people on earth

Source: basic math

mobile is fast becoming the primary way

people browse the web

mobile only web users

US/UK China India Egypt0%

10%

20%

30%

40%

50%

60%

70%

80%

25%30%

59%70%

Mobile only web users

what do we do?

Do nothing

Change the client to adapt to mobile

Change the server and target mobile

demo

do nothing

if you do absolutely nothingat least add a viewport meta tag!

<meta name="viewport" content="width=device-width" />

if you do absolutely nothingat least add a viewport meta tag!

<meta name="viewport" content="width=device-width" />

Fix it on the client

• custom css• media css• responsive design

demo

responsive design

Good Design

Fix it on the client

Pros• optimized for the current device• less duplication of efforts

Cons• glosses over the differences between

mobile and desktop• inefficient bandwidth usage

Fix it on the server

• custom mobile views using display modes

• jQuery Mobile

demo

display modes + jQuery Mobile

Fix it on the server

Pros• maximum flexibility• less duplication of efforts

Cons• can be repetitive• device detection is not trivial

how do we dial up mobile support?

Web Sites vs. Web Applications

the approach you choose depends on the type of app you build

HTML5 is a collection of technologies

• canvas• video• geolocation• local storage• offline• web forms• microdata• history

demo

html5 mobile web application

Conclusion

Why is supporting mobile devices important? It’s becoming the primary way folks access the internet.

What is one tip you can use today to improve your existing mobile websites?

Adaptive rendering using viewport and media CSS

What is at least one thing ASP.NET MVC 4 is doing to make mobile web development better easier?

Display modes, default project template, view switcher.

Resources

Connect. Share. Discuss.

http://northamerica.msteched.com

Learning

Microsoft Certification & Training Resources

www.microsoft.com/learning

TechNet

Resources for IT Professionals

http://microsoft.com/technet

Resources for Developers

http://microsoft.com/msdn

Complete an evaluation on CommNet and enter to win!

© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to

be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS

PRESENTATION.