【发布时间】：2010-07-05 11:15:57
【问题描述】：
我在设计一个专门针对移动浏览器的网络应用程序方面首次亮相。虽然我以前用 C#/ASP.NET 编写过网页，但我从未专门针对移动浏览器的有限屏幕空间和其他特性做过任何事情。所以我在这里寻找一些指针：
- 我应该考虑哪些设计注意事项（除了明显更小的屏幕）？
- C# 中有哪些有用的功能可以为移动客户端带来良好的效果？
- 您如何确保为所有不同的移动浏览器提供相对统一的用户体验？
- 您还有其他建议吗？
谢谢！
【问题讨论】：
【发布时间】：2010-07-05 11:15:57
【问题描述】：
可能很明显，但请确保您定义了定制的手持式样式表。
<link rel="stylesheet" href="http://domain.tld/mobile.css" type="text/css" media="handheld" />
虽然现代智能手机（例如 iPhone）可以处理普通网站，但对于专门的移动应用，最好避免不断放大和缩小。但是，如果用户也想使用笔记本电脑/台式机访问应用程序，则值得设计两个版本。
【讨论】：
-
请注意，很多智能手机会忽略这个样式表，因为它们有能力像桌面一样呈现
我应该考虑哪些设计因素 考虑到（除了 明显更小的屏幕）？
用户交互如何，例如允许“悬停”的设备很少，所以不要依赖无法在移动设备上模拟的伪类，但不要完全忽略它们，所以移动设备可能会使用它们。
如果设备支持横向和横向查看，请考虑设计的方向。
某些设备（如 iPhone）无法使用触控笔操作到毫米精度，因此不要将输入设置得太小。
如果使用效果来修饰UI，大多数移动设备都不能很好地显示效果（例如jQuery提供的那些）......
终于测试，测试，测试！在尽可能多的真实移动设备上进行测试，完成后考虑使用模拟器（例如用于BlackBerrys 或iPhone 的模拟器），虽然这不会为您提供使用设备的感觉，但应该显示任何渲染问题。
【讨论】：
打造良好的移动设备体验主要是关于 UI，而不是后端应用程序。
- 使用移动设备样式表（
link-元素上的media="handheld"属性） - 尽可能少的 HTTP 请求：
- 将所有脚本和样式表压缩到一个文件中（即一个用于 .js，一个用于 .css）
- 尽可能少的图片
- 请记住触摸设备和非触摸设备之间的区别（例如按钮的大小）
- 注意一页内容的数量。
【讨论】：
压缩、缩小、优化有几个原因。带宽不是很好，在桌面上几秒钟加载的页面在移动设备上可能需要 30 多秒。手机上的缓存真的很差。一个例子是 iPhone 不会缓存超过 25k 的网站组件。所以让你的图片、脚本、样式表尽可能的小。
【讨论】：
您应该查看WURFL ，它基本上是一个巨大的 xml 文件，可以帮助您识别设备。您获取用户代理并使用他们的 API 将其与文件核对，以获取该设备的所有功能和特性。我已经在许多项目中使用它并取得了巨大的成功。
【讨论】：
不要重定向到网站的移动版本，否则会失去预期的目标。如果我想查看网站上的文章，请不要将我带到移动主页。您可以将我带到文章的移动视图，但完全劫持我的目标是不可接受的。
某个 cr***ed.com 总是这样做，这令人难以置信的愤怒....
【讨论】：