手机网站建设的页面设计技巧

1、狭窄布局

        在小屏幕上显示大的web页面仍旧需要一些信息视觉处理方法。目前一些浏览器采用狭窄布局作为默认查看模式，Opera将其称为小屏幕渲染，NetFront将其称为SmartFit，我们称之为狭窄布局，因为整个内容的显示窄且长，并且所有内容都做了简化以符合屏幕宽度。我们对这一布局做过很多用户研究[参见注释5]，狭窄布局的主要好处就是文本容易阅读，如果文本的宽度超过屏幕的宽度，用户的阅读就会很困难，虽然可以采取滚动的方法处理这一问题。不过根据我们的调查，狭窄布局仍有很多问题。最糟糕的就是为了符合屏幕宽度，一些大图片被删减，结果导致图像细节丢失。第二个问题就是表格。如果有一行表格不与屏幕吻合，就会自动调至下一行。

        还有一点就是内容排序。如上图，所有内容的显示变得很长，所以用户很难找到一些想要的内容，经常需要在屏幕滚动时去寻找关键词，这也就意味着滚动速度不能太快，结果看完所有内容会是一个非常漫长的过程。如果加快滚动速度，用户又可能丢失一些重要信息。一个典型的Web页面中，最左边往往有很多链接，主要内容显示在页面中部。在狭窄布局中，用户必须滚过这些链接，才能看到主体内容。不过在浏览一个网站时，这些链接多数情况下是不相关，用户会变得很生气。还有一个相关的问题就是，一个网站的任何页面的上端往往很类似，用户会弄不清楚自己在哪个页面，所以如果这些链接中包含用户已经点击过的，那么用户很有可能再点击这些链接。我们遇见过很多用户由于这个问题而放弃阅读，他们会说浏览器坏掉了。

2、原始布局

        由于狭窄布局存在很多可用性方面的问题，所以很多浏览器还提供原始布局页面模式，这很类似在PC上，让用户根据内容来选择不同的视图模式，原始布局中，大图片细节和表格的效果会更好，同时如果用户知道PC上的网站的结构，那么就很容易找到自己所需要的内容。当然原始布局并非什么问题都没有。最糟糕的就是阅读宽文本内容，会很费力。用户每次都得向前向后拉动滚动条。另外由于页面很大，所以需要滚动的地方也越多。

3、理想布局

        很明显，小屏幕移动终端上的页面浏览仍需要很多改进和革新。如果想让自己的网站在小屏幕上具有可读性，可以遵守以下3个指导建议：避免那些一眼就能看出来的大物体；避免在图片上使用小文本；页面要轻化。