php - 开发手机网页的最佳实践

Question

我想知道如何制作一个在大多数手机上看起来都不错的网页。对于制作普通网页，我使用dreamweaver cs3。我真的不想使用模拟器，除非我也有。我能不能把所有东西都放在中间，两边都有自动边距。

当我查看迄今为止制作的页面时，它们看起来还不错，但在手机中有些东西会变得混乱。我打算去掉所有非必要的信息和标记，以便在手机上使用。

然后就是问题了，基本上是我现在最重要的一个

如果手机去同一个地址，如何显示不同的页面？

编辑

我没有得到最后一个答案，但我找到了一个可以使用的浏览器检测脚本。

谢谢，理查德

score 2 · Accepted Answer

为了获得最大程度的兼容性，您必须放弃大多数在台式计算机上运行的花里胡哨的浏览器，考虑到磨坊的运行。

用您的 XHTML 文档声明移动文档类型，并确保您的标记和样式表有效。
让您的 CSS 真正简单。不：悬停，不要使用图像作为设计的一部分，限制您使用固定尺寸/边距。
仿真器在测试方面不如实际设备本身有效。支持 Wifi/蓝牙 PAN 的手机可以让生活更便宜，但通过运营商的网络进行测试也将帮助您更好地了解速度和延迟。
没有“典型设备”，但如果您可以在不使用 webkit 的 CSS 插件的情况下让您的网站在 webkit 下看起来非常好，那么您已经涵盖了大量设备（诺基亚 S60、iPhone、Android 等）。使用 Opera Mini，您将进一步扩展该块。
尽可能压缩你的输出。您的最终用户不仅会受到屏幕和 CPU 处理的限制，而且他们很可能会受到网络的限制。您将数据推送给他们的速度越快，您的网站感觉就越慢。

score 1 · Accepted Answer

只是我的两分钱：

就个人而言，我会让布局变得流畅，以便它根据显示器的长度和宽度自动调整。请记住，许多手机都有加速度计，当横向平铺时，它可以改变页面的方向。在这种情况下，水平滚动是一个很大的禁忌。
把所有无用的东西放在一边，只显示基本信息，高级或详细信息应该放在更多按钮下。
不要使用图像，或者我说 - 尽可能少地使用它。这将占用用户的大部分带宽。如果您将其定位为下的人GPRS/EDGE，那么最好避免使用图像。人们3G有更好的机会。
你可以看看Facebook或Gmail移动界面有一个想法。Google Reader's手机界面也不错，但还是不合格。
我不知道有多少人会同意我——保持AJAX低调。如果您的页面高度 ajaxified，大多数手机都无法处理如此多的负载。请记住，它是手机而不是电脑。它确实有一些限制。可能非常高端的手机可以渲染它，但要保持强大的用户群，请尽量减少使用。

内容加载：如果页面加载时间很长，那么用户可能不会费心使用它。他们更愿意使用可以完成他/她的工作的任何其他替代/服务。

CSS：尽可能少使用 CSS。正如我上面多次说过的那样，使用颜色多于图像。您应该使用浮动来使页面正确地适合屏幕。如果您愿意，可以使用较小的字体 - 但请注意，不要低于某个级别。

score 1 · Accepted Answer

A List Apart 有一篇很棒的文章，关于有条件地为移动设备使用不同的样式表：

您还可以查看有关为 iPhone 设计 Web 内容的 Apple 文档，虽然它是特定于 iPhone 的，但它通常适用于移动设备：

3 回答 3