Introducing ASP.NET MVC 4 Mobile Features

Introducing ASP.NET MVC 4 Mobile Features:

The world in which we live is changing rapidly. Almost everyone now seems to own a smartphone, a tablet, or both, and we spend a lot of our time (too much?) viewing web sites on these devices. This trend has created a challenge for developers because mobile browsers and desktop browsers behave differently.

Adding to that challenge is the fact that there is a plethora of devices with different form factors. Building web applications that look good and are fully functional on these devices can quickly become a titanic task.

ASP.NET MVC 4 introduces a new set of features that is intended to help developers create web applications that work seamlessly both in desktop browsers and in mobile browsers. Views can now be created to target specific browsers. Also, with the help of CSS3, we can apply styles based on the form factor of the device.

Let me start by saying that, to provide the best user experience across desktop and mobile browsers, you should work with HTML5 for the markup and CSS3 for the styling of elements.

You can quickly identify in the listing the enhanced HTML5 markup, known as semantic markup, with tags such as <header> , <footer> , <nav>, <section>, and a simplified <!DOCTYPE html>.

Another important aspect of mobile browsers is the viewport, a virtual browser window that is defined in most mobile browsers. This virtual window is normally defined with dimensions that are larger than the actual device screen, which allows users to zoom in on page content that is of interest. If the viewport, on the other hand, is defined by the developer with the actual device screen dimensions, then zooming is not available as the content in the page is supposed to fit correctly.