现在移动互联网的盛行，跨平台并兼容不同设备的HTML5越来越盛行，很多公司都在将自己过去的非HTML5网站应用渐进式的转化为HTML5应用，使得一套代码可以兼容不同的物理终端设备和浏览器，极大的提高了系统的可维护性和可扩展性。于此同时，HTML5提供了很多的新特性，比如新的架构元素、代替cookie的Web存储技术、WebSocket等，也使得网站应用能够更好适应新的商业环境和技术更新。
本系统的网站模块使用.NET技术堆栈中的ASP.NET MVC框架，此框架是微软公司推出的开源框架，相关源代码可以在Codeplex.com网站上找到。该技术框架经过7年多的发展，当前已发展到5.1版本，新增了包括移动客户端模板、WebAPI模板、OAuth认证等功能在内的新特性，便于当前的以互联网为主题背景的项目开发。
在实际的项目中，主要面临的两个问题分别是：实际用户使用的终端设备的厂商、型号等可能千变万化，如何在不同的Web终端上呈现出适合的样式；ASP.NET MVC默认提供WebForm和Razor两种视图引擎，但他们并不能支持HTML5页面的呈现，如何扩展视图引擎用于支持HTML5页面的渲染。实际选择的技术解决方案是，使用Media Queries等技术手段来实现响应式的CSS3设计，用自定义静态HTML5视图引擎扩展ASP.NET MVC框架。接下来，将分别详细介绍两个解决方案在项目中的实施应用。
首先，介绍响应式的网页布局，这个概念首先由Ethan Marcotte于2010年5月提出，目的是使得一个网站可以兼容多个终端—而不是为每一个终端开发一个特定的版本，可以说它就是为解决移动互联网相关痛点应运而生的。实际上，当前正在运营的很多大型网站上，仍然是维护多套的网站程序，有的还使用不同的域名来服务不同的终端。同时往往对移动端网页中的业务功能进行了一定的删减，虽然也能提供不错的用户体验，但这并不是最合理的解决方案，尽可能的统一用户接口是很有必要的。响应式的页面布局在具体的实现上，主要包含以下的几个步骤。
第一步，在html页面的head部分增加名为viewport的meta元素，viewport表示一个虚拟的窗口，通过它来设置适应移动设备屏幕的大小，代码如下所示。
1 <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=0" /> 2 <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>