我开始为多种设备设计网站：台式机/笔记本电脑、平板电脑（例如 iPad、Galaxy Tab 和移动设备（例如 iPhone）。
我目前有一些页面有一些 javascript 可以重定向到完全不同的子域。例如，如果用户www.example.com在 iPhone 上访问，他们将被重定向到m.example.com或者t.example.com如果他们在平板电脑上。显然，这需要您创建可能具有相似内容的不同页面，而媒体查询将允许您根据屏幕大小稍微不同地布置内容。
所以在我看来，媒体查询将是处理不同屏幕分辨率的首选。不过，这给我留下了一些问题。例如，您在桌面网站上有一个导航栏，select在移动网站上可以更好地使用类似的导航栏。实现这一点的最佳方法是什么？
为我可能语无伦次的漫无边际道歉，但我想我的问题是实现移动版网站的最佳方式是什么，其中差异可能不仅限于布局（例如，简单的媒体查询），而且可能需要页面上的不同元素?
媒体查询通常是您想要实现的最佳解决方案。如果你开始为不同的设备创建不同的版本，你会让自己非常头疼，试图让所有东西都保持最新。最好有一组代码来适应用户正在使用的设备。
看看 Twitter Bootstrap 项目。这是一个现成的框架，可以帮助您整合响应式设计。
您可以创建一个视图、一个 js 和一个 css 并在单个文件中处理所有内容，或者为了获得更好的性能，我建议使用 MVC 模式，您需要检测用户代理，然后在此基础上加载相应的视图 + css + js。加载这个页面+代理+扩展之类的东西
例如：
home.web.html、home.tablet.html、home.mobile.html
home.web.js、home.tablet.js、home.mobile.js（也可以制作单个js文件）
您可以放置一个通过媒体查询处理布局的 css
* Js 布局切换非常慢。有复合设计模式如果你喜欢使用 *
您可以通过使用 CSS 媒体查询来实现，借助媒体查询，您可以为不同的布局维护 css，您可以隐藏移动不需要的东西。
对，就是这样。您可以为桌面显示 Normal UL LI Nav，并使用 meida 查询为移动版本启用选择下拉导航。