你很有可能已经看到了智能手机是如何展示网站的。它可以一目了然地向您显示整个网页，或者放大以使您感兴趣的文本具有可读性。从某种意义上说，由于iPhone使用Safari，网页设计人员不应该做任何特别的事情来创建一个可以在iPhone上运行的网页。但是，你真的希望你的页面只是工作-还是脱颖而出？当你建立一个网页，你需要考虑谁将会看到它，以及他们将如何查看它。一些最好的站点会考虑页面所使用的设备类型，包括分辨率、颜色选项和可用的功能。移动端网站建设需要特别注意的一些准则，因为他们不能仅仅依靠设备来解决问题。
建立移动设备网站的一般准则
尽可能多地测试设备。您应该做的第一件事是在iPhone和尽可能多的不同移动设备或模拟器上查看您的站点。虽然您可以在所有测试中使用模拟器，但它们给人的感觉与在小屏幕上浏览网站时的感觉不同。您应该尽可能多地在实际设备上进行测试。
使您的页面优雅地降级。您可以为启用Flash的宽屏浏览器编写页面，但请确保关键信息即使在无法处理任何特殊功能(如cookie、Ajax、Flash、JavaScript等)的微型显示器中也可见。任何超越XHTML Basic的东西都将超越一些手机。虽然大多数智能手机可以处理所有这些事情，但其他移动设备不能。
构建特定于无线的页面，并使其易于查找。如果你想为你的手机和无线用户建立一个特定的页面-让它可用。一种很好的方法是将链接放在文档顶部的无线页面上，然后使用手持媒体类型对非手持设备隐藏该链接。毕竟，大多数人都会访问你的主页，即使是在手机上-如果你的无线页面链接不在那里，如果这个页面太难使用，他们就会离开。
在为智能手机市场撰写页面时，你应该记住的第一件事是，如果你不想做任何改变，你就不必做任何改变。大多数智能手机最棒的地方在于，它们使用Webkit浏览器(iOS上的Safari和Android上的Chrome)来显示网页，所以如果你的页面在Safari或Chrome中看起来不错，那么它在大多数智能手机上都会很好(只是小得多)。但是你可以做一些事情让你的浏览体验更愉快：
记住屏幕很小。智能手机会将所有这些列压缩到小窗口中，这会使它们在不缩放的情况下很难阅读。大多数用户习惯于缩放，但它可能会让人感到厌烦，一长列文本更容易阅读。
将页面分成更小的块，在手机上阅读很长的文本片段是很困难的，所以把它们放在多个页面上会让它们更容易阅读。
iPhone上的链接和导航
URL越短越好。如果你曾经尝试在手机上输入URL，你就会知道这是一种痛苦(除了那些习惯于发送大量短信的青少年)。即使在iPhone上，输入长URL也很乏味。把它们剪短。
但是长链接文本更容易点击。当一个页面上有几个单独的单词链接到不同的文章时，如果没有缩放，就很难点击正确的单词。很多人会放弃去别的地方。带有3到5个单词的链接比1个单词的链接更容易在电话上单击。
不要把你的导航放在屏幕的最上面。没有什么比在屏幕和链接屏幕上翻页来找到你想要的信息更烦人的了。如果你看过为手机设计的网页，你会发现首先出现的是内容和标题。下面是导航。不要害怕隐藏你的导航。使用CSS或JavaScript隐藏导航链接，并仅在用户要求时才显示这些链接，这是使智能手机用户更容易访问页面的一种方法。
智能手机网页图像提示
图像必须很小。是的，Android和iPhone可以放大和缩小图片，但无论是在尺寸上还是下载时间上，它们都越小，你的无线用户就会越开心。优化图片一直是个好主意，但对于手机页面来说，这一点至关重要。
图像必须快速下载。当您在移动设备上查看图像时，这些图像占用了网页上的大量空间。而且，虽然它们通常非常漂亮，在全屏Web浏览器上查看时会使页面看起来更好，但在移动设备上它们往往会妨碍页面的浏览。此外，当智能手机用户在手机网络上时，他们最不愿意花钱的事情就是下载一堆巨大的图片或导航图标。
不要把大的图片放在页面的顶部。就像导航一样，等待一个需要3到4个屏幕的图片加载到页面顶部是非常乏味的。这在网页上是非常普遍的。唯一例外的是，如果读者知道，当他们点击时，他们将得到一张图片，例如在图片库。
为移动设备设计时应避免的事项。在构建一个移动友好的页面时，有几件事是你应该避免的，这些基本原则是：
Flash：大多数移动电话不支持Flash，因此将其包含在无线页面上并不是一个好主意。
Cookie：许多手机没有Cookie支持。iPhone确实支持Cookie。
框架：即使浏览器支持框架，也要考虑屏幕的尺寸。框架不能在移动设备上工作-它们很难或不可能读懂。
表格：不要在移动页面上使用表格进行布局。尽量避开餐桌。并不是所有的手机都支持它们(尽管iPhone和其他智能手机都支持它们)，结果可能会很奇怪。
嵌套表：如果必须使用表，请确保不要将其嵌套在另一个表中。对于桌面浏览器来说，这些都是很难支持的，而且充其量也只能使页面加载得更慢。
绝对度量：换句话说，不以绝对大小(如像素、毫米或英寸)定义对象的尺寸。如果您定义的东西为100px宽，那么在一个可能是屏幕一半的移动设备上，而在另一个移动设备上，它可能是屏幕宽度的两倍。相对大小(如EMS和百分比)效果最好。
