Welcome toMVP Lunch Time Talk Series

Building Mobile Web Applications using ASP.NET MVCShravan Kumar KasagoniThomson ReutersMicrosoft MVP – ASP.NET@techieshravan

AgendaBuilding Mobile optimized web applications

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

1 2 3 40%

10%

20%

30%

40%

50%

60%

70%

80%

25%30%

59%70%

Series1

What do we do?• Do nothing

• Change the client to adapt to mobile

• Change the server and target mobile

Demo: do nothing

Meta Viewport

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

Fix it on the client• Responsive design using CSS Media

Queries@media only screen and

(max-width: 1024px) and (max-height: 768px) {

….}

Fix it on the clientPros• optimized for the current device• less duplication of efforts

Cons• Doesn’t consider the differences between

mobile and desktop• inefficient bandwidth usage

Fix it on the server• custom mobile views using display modes• jQuery Mobile or Sencha touch or any

mobile web framework

Fix it on the serverPros• maximum flexibility• less duplication of efforts

Cons• can be repetitive• device detection is not trivial

Demo time

Consider HTML5 for mobile web development• Canvas• audio• video• geolocation• local storage• offline• web forms

Thank you