现在大家已经开始着迷于开发移动站点。也许我们不会对口袋中小巧的性能优秀的移动设备印象深刻，但会对手机上体验良好的网站感到惊艳。
这里有一些将你的网站移动互联网化的方法，其中重要的思想就是找到平衡点。你可以：
- 什么都不做。你的网站也许能在移动设备上运行但是在挑剔的用户不断增长的期望当中，它会看上去越来越糟。
- 使用可调配的\相应式的设计。这个是我最喜欢的选择。如果你的网站大部分是内容展示（相对于数据录入），你可以通过根据屏幕尺寸来渲染页面布局从而在各种设备上都能获得良好的浏览体验。如果你比较关注性能，你可以添加一个服务器端组件来为移动设备调整图片大小。更多信息可以访问http://mediaqueri.es。
- 使用为移动设备设计的框架。现在已经有很多功能强大的框架，如Sencha, Kendo, jQuery Mobile等。这些框架能帮你使用html 5开发出看上去近似于原生app的产品。
- 开发原生app。在现阶段想要不使用原生app技术开发出原生体验的app很困难。在移动设备上想要得到最好的原生app体验还是只有创建原生的app，这需要花费大量工作来得到做好的体验。然而，如果你使用其它技术，你可用以少于90%的精力换来90-95%的体验。另外不用强制用户去下载讨厌的移动app，而只是像浏览手机网页一样。
PS:优化体验 效果与付出关系
如果你用手机访问我的站点http://hanselman.com，或者缩小浏览器的尺寸，你会看到这个blog使用了Jeremy Kratz的响应式设计。博客会更加不同设备的屏幕大小来改变它的外观布局。如，可以留意到当浏览器变得很窄时导航栏会变成一个下拉菜单。
这个变化相对较小，但是十分人性化，立即使我的博客能让那8%使用手机访问的人可以更有效地浏览。
对于那些基于数据的站点，或者考虑将其做成现有站点的移动应用版本。通常可以使用上面提到的那些移动应用框架。我在这里会用jQuery Mobile做例子。假设我有一个会议浏览系统程序，在桌面浏览器上看是这样的。我可以查看日期、演讲人、标记，也可以查看会议详细信息。
如果我在手机浏览器或者移动设备模拟器上如Electric Plum Mobile Simulator浏览同一个页面，它看上去十分糟糕。
我可以只为手机定义移动应用自定义样式，或者我可以使用CSS3 media query来使我现有的样式对移动设备更友好，如：
这里是一个新的_Layout.Mobile.cshtml，作为我的会议浏览系统移版本的的起点。你可以在Visual Studio中选择 文件-->新建项目-->ASP.NET MVC4，选择手机站点创建项目。
现在我已经为移动版本创建了一个自定义的_Layout.mobile.cshtml，当我在移动设备上访问时会去自动识别并使用_Layout.mobile.cshtml 而不是_Layout.cshtml。
到这步，我的应用已经使用了移动版本的layout，但是现有的界面看上去已经很糟糕。原因是我的移动版本的layout依旧和桌面版布局结构相同。
桌面版本使用的是table布局，在桌面浏览器中即使table没有css样式，也完全没有问题，只是一个信息表的展示。
但是在更小的屏幕尺寸下，我需要一个能更清晰地展示内容的移动应用布局。我可以复制SessionsTable.cshtml 创建并修改 SessionsTable.Mobile.cshtml，如下：
在这段HTML中有几点需要注意。首先，我喜欢那些标签元素不是用描述和表现外观的CSS来表达，而是使用HTML5 data-attributes 来表达一个元素。如UL使用data-role=“listview”来告诉你这是一个listview但是不用管它的外观是什么样子的。
在UL中我添加了一些LI，LI中包含了A、H3、P、STRONG等语义化的标签，使用了默认的主题。现在它看上去漂亮多了，在移动设备上。
未完待续。。。
原文地址：http://www.hanselman.com/blog/CreateAGreatMobileExperienceForYourWebsiteTodayPlease.aspx