移动网页的工作方式

技术和互联网速度在区分移动平台和完整计算机方面起着重要作用，但最终都归结为大小。与计算机监视器相比，即使是对角度超过四英寸（10.2厘米）的最大智能手机屏幕也很小。尽管这些显示器的图像分辨率继续增长，但物理上太小，无法清晰地显示整个网站。阅读它们需要放大，而且通常的现代站点的多列布局使导航和内容消耗变得困难。最佳网站可用性来自对平台定义特征的理解。对于移动设备，这始于屏幕尺寸。

移动网络设计必须集中于单列布局，将所有内容凝结成一个紧凑的布置。这可能需要重新安排导航链接，删除较少重要的页面元素，并使主列更窄以说明手机的尺寸。虽然监视器比高高宽，但大多数手机屏幕都是为肖像方向而设计的 - 您随时可以将手机转动到侧面浏览站点，但是移动布局需要考虑到该默认方向的狭窄。布局不是唯一的问题 - 因为移动设备不使用鼠标个人电脑，“鼠标状态”，例如下拉菜单，必须重新设计以使用触摸输入或电话按钮[来源：粉碎杂志]。

最后一点导致移动网站设计的另一个挑战：浏览器和硬件品种。很难构建完整的网站，这些网站考虑到Internet Explorer等浏览器的特质，火狐浏览器和谷歌浏览器。在移动世界中，有些人在“哑巴”手机上浏览网络，并带有微小的低分辨率屏幕；其他人则使用带有更高分辨率显示器和触摸屏的智能手机！有时，一个移动站点还不够 - 为各种设备设计单独的移动接口是有意义的。例如，Facebook通过检测他们使用的设备的功能来为智能电话访问者提供量身定制的网站。PC世界]。我们将在下一部分中介绍其背后的技术。

尽管移动网络设计需要简化的界面，但它不一定会导致愚蠢的网站。相反，智能手机在计算机上提供了不可用的高级功能。QR码通过电话摄像机扫描可以立即启动网站或下载应用程序。地图可以绑定到GPS数据中，为您提供有关附近餐厅的指示或建议。它需要明智地使用幕后技术来创建有效的移动站点。让我们看一下技术和设计是同一硬币的两个方面。

由于其设计，移动网站很容易识别，但是某人在该产品中为该产品提供了许多巧妙的工程。现代网络设计通常是使用级联样式表（CSS）构建的。顾名思义，样式表控制页面的样式元素 - 字体，文本颜色，页面宽度，边距等。尽管您的网站内容可以存储在数据库或HTML文件中，但CSS确定了如何显示该内容。上一节中提到的所有设计更改都是通过CSS完成的，并且可以进行其他调整以优化移动设备的浏览体验。例如，用简单的纯色代替大图像背景将使移动站点负载更快，并使用更少的带宽。

建立移动网站是第一步。该网站存在后，访问者必须使用它。没有明确的正确方法来交付移动网站，但是有几种可行的选择。最简单的是在整个网站上在某个地方提供“查看移动站点”的链接。通常，开发人员使用子域（通常是M.Website.com）将用户引导到移动网站。这很容易理解。网站网站访问完整网站，m.website.com访问移动网站。有些网站使用i.website.com而不是由于iPhone，但是实现完全相同。尽管许多站点都使用系统自动将移动浏览器自动到移动站点（如下所述）有时到达该移动网站的唯一方法是手动输入M.Website.com地址。有关网站地址如何处理的更多信息，请参见我们的文章域名服务器如何工作。

服务移动页面的其他技术更为复杂。许多网站会自动检测您使用的设备类型来确定要使用哪些CSS文件。这可以通过查询设备并确定一些识别因子（例如，屏幕宽多少像素数量）或读取用户代理字符串来实现这一点，该因素宽了多少像素，该字符串声明了用于加载网页的浏览器[source：source：source：source：source：粉碎杂志]。“媒体查询”是级联样式表中的代码行，可以参考用户代理字符串来挑选其中一个识别因素。如果用户代理将自己标识为具有一定屏幕宽度的移动浏览器，则可以使用该信息来确定要加载哪种类型的网页。这些方法并不总是完美地工作 - 有些浏览器允许您“欺骗”用户代理和新的用户代理字符串始终使用新的浏览器 - 但是通常，Web服务器将正确地将移动站点发送到一个假设他们有一个可以提供的移动设备。这种识别方法可以绑定到另一种选择中：给用户一个选择。在移动设备上导航到IMDB.com将自动加载移动站点，但为用户提供了提示，可以下载提供更多功能的移动应用程序。

这些是构建和提供移动网站的基础知识。但是，还有更多。因为使用手机与使用计算机是如此不同，所以将传统的网络元素带到移动网站面临挑战。下一页将涵盖移动浏览器的优点和缺点，以及构成现代网络的密码字段，表单和闪光视频（例如密码字段，表单和闪存视频）。

移动网站不可避免地比智能手机上的全站点对应物更好，因为它们为小型设备量身定制。“一个尺寸合适”永远不是最好的解决方案。就是说，移动网站并不总是比移动设备上的完整站点“更好”。由于这些站点是为了轻松浏览电话而设计的，因此它们考虑了这些设备的局限性，并因此提供了有限的体验。例如，移动站点导航并不总是可以作为常规导航访问，因为没有足够的屏幕空间可以始终保持可见。

与网站互动可能是移动浏览体验中最困难的部分。滚动浏览输入表格，选择单个字段并在手机上输入它们所需的时间要比计算机上的时间更长。这个问题加剧了触摸屏和软件键盘。值得庆幸的是，电话浏览器可以存储饼干并记住密码，就像桌面浏览器一样，使移动体验变得更加容易。一些浏览器为具有桌面当量的手机构建的，例如用于Android和Opera Mobile的Firefox，可以同步密码以及来自计算机上浏览器设置的其他保存数据。这是一种处理您的数据并简化移动网站和完整网站中的浏览体验的好方法。现代智能手机还可以使他们的袖子插入几个窍门，使导航令人愉悦：捏到Zoom可以轻松地扩大文本区域，大多数浏览器都使用“ Tap-to-Zoom”动作，可将其放大至确切的宽度段落。

当移动网络浏览是手头的主题时，闪光不可避免地进入讨论。Flash视频对处理器和电池寿命有所要求，但多年来有所改善，现在可以在许多移动设备上使用 - 但在Apple生产的任何设备上都不适用。Apple不允许Flash Video在iOS上播放，而是支持HTML5视频，该视频已经被YouTube等许多视频网站使用。虽然Flash视频可以嵌入到移动网页中，但面对移动设计的最大优势，这种练习却苍蝇：简单。轻巧的移动站点很快加载，因为它们主要是文本和小图像。此外，将Flash放在移动网站上意味着限制iPhone用户如何与网页进行交互。

尽管网页设计师必须仔细选择他们显示的内容以及如何安排手机页面，但移动网络体验确实与真实事物没有什么不同。广告在移动网站上也是如此，尽管显然像Google Adsense这样的系统比大型弹出窗口广告更适合小型网站。在智能手机上浏览永远不会像使用鼠标，键盘和大型监视器那样有效，但是它们总是靠近手头。良好的移动设计使体验尽可能无痛。