为移动浏览器设计网页的提示？

Question

我在设计专门针对移动浏览器的网络应用程序时首次亮相。虽然我之前在C＃/ ASP.NET中编写过网页，但我从来没有专门针对有限的屏幕空间和移动浏览器的其他特性做任何事情。所以我在这里寻找一些指针：

• 我应该考虑哪些设计考虑因素（除了明显更小的屏幕）？
• C＃中有哪些有用的功能可以为移动客户端带来良好效果？
• 您如何确保为所有不同的移动浏览器提供相对统一的用户体验？
• 您有其他建议吗？

谢谢！

Answer 1

我应该考虑哪些设计考虑因素 （除了 明显更小的屏幕）？

用户交互如何，例如，允许“悬停”的设备很少，因此不依赖于无法在移动设备上模拟的伪类，但不会完全忽略它们，所以移动设备可以使用它们。

如果设备支持横向和横向查看，请考虑设计的方向。

使用触控笔无法使用iPhone等一些设备以毫米级的精度操作，因此请勿使输入危险地变小。

如果使用效果挞了UI，大多数移动设备不显示效果（如的jQuery提供的）非常好...

最后测试，测试，再测试！在尽可能多的真实移动设备上进行测试，并且在完成后考虑使用仿真器（例如BlackBerrys或iPhone），但这不会为您提供使用设备的感觉，它应该显示任何渲染问题。

Answer 2

可能很明显，但请确保您定义了一个定制的手持样式表。

<link rel="stylesheet" href="http://domain.tld/mobile.css" type="text/css" media="handheld" /> 

虽然现代智能手机（如iPhone）可以处理普通网站的不断放大和缩小是更好地避免了专门的移动应用程序。但是，如果用户想要使用笔记本电脑/台式机访问应用程序，则需要设计两个版本。

Answer 3

制作良好的移动设备体验主要是关于用户界面，而不是后端应用程序。

• 使用移动设备的样式表（media="handheld"属性上link - 元素）
• 尽可能少的HTTP的请求尽可能：
  • 压缩所有的脚本和样式到一个单一的文件（一个用于.js，一个用于。的CSS，这是）
  • 尽可能少的图像尽可能
• 记住触摸设备和非触摸设备之间的差异（按钮的尺寸，例如）
• 小心处理的内容量你适合一个页面。

Answer 4

不要重定向到移动版本的网站，失去预期的目标。如果我想查看网站上的文章，请不要将我带到移动主页。您可以带我到文章的移动视图，但完全劫持我的目标是不可接受的。

一定CR *** ed.com这是否始终这是令人难以置信的真气....

Answer 5

压缩，缩小文件，优化有两个原因。带宽不是很好，在桌面上几秒钟加载的页面可能需要30秒以上的移动设备。移动设备上的缓存功能非常差。一个例子是iPhone不会缓存25k以上的网站组件。所以让你的图片，脚本，样式表尽可能小。

Answer 6

你应该检查出WURFL这基本上是一个巨大的XML文件，可以帮助您识别设备。您可以获取用户代理并使用其API访问该文件，以获取该设备的所有功能和功能。我曾在众多项目中使用过它，取得了巨大的成功。