您当前的位置:>> 文章 >> 精华论文
  • 设计出适合所有浏览器的网站
    发表时间:2009年3月9日 10:18  【字体:


    正视一个问题:设计出适合所有浏览器的网站,是一件很难的事情。

    现在,大多数设计者为固定浏览器设计网站。而标准更高的设计者,则会考虑创建适合不同浏览器的网站。

    当然,你可以考虑在IE浏览器的Windows XP中,让网站呈现最好状态。但你真的希望让数百万潜在客户,对你的网站产生厌烦吗?

    我看到,最近一项统计显示:12%的网络用户是Macintosh用户。如果忽视这个问题,就等于网站减少了1/8的客户。并且,并不是所有Windows用户都使用Windows XP,有很多用户使用Windows vista,基它浏览器用户也占到不小的一部分。

    并且Linux用户数量正在不断增加,我们不应该忽视这一部分用户。尽管现在这部分用户数量少,但OS普及率每天都在提高。

    尽管微软公司包含所有的Windows装置,但IE并不是唯一的浏览器。Netscape公司拥有数百万的浏览器用户。并且很多公司把Lotus Notes作为标准的浏览器和电子邮件应用程序。

    当然,还有AOL。尽管从根本上说,IE是AOL的默认浏览器,但它包含不同的种类。考虑到大量的AOL用户,网站必须重视这种浏览器。如果网站在AOL浏览器中呈现出糟糕的外观,你会流失掉大量潜在客户。


    网站设计中,我们必须考虑多种浏览器的兼容性。因此,为保证网站在不同浏览器中呈现出精美页面,我们必须了解几种基本、简单的设计技巧。下面几条建议可能会对你的网站设计有帮助。

    1.精美的布局

    为设计最有效的网站,我在电脑上安装两个显示器,鼠标离开一个屏幕,就会出现在另一个屏幕上。因此,我的电脑屏幕宽度为1856像素,超过了32英尺;如果我喜欢,还可以增加到2000像素。但是,大多数客户和游览者不具备两个显示器,其实,大多数用户电脑屏幕分辨率为800x600或者1024x768。更重要的是,每一次见到AOL用户,他们的浏览器窗口设定为640像素,不管显示器分辨率是多少。

    在我设计第一个网站时,把宽度设为700像素,网页顶部设置了精美的导航条。当我进入客户办公室,征求反馈意见时,看到在21英寸的显示屏(分辨率640x480)上,我的网站外观很糟糕。

    要想网站吸引最多用户,必须保证网站在低分辨率的屏幕上,呈现出精美的外观。你可以对某些有代表性的访问者做一个调查,了解他们常用的分辨率类型。

    2.运用表格控制宽度

    控制文章和图片最好的方法就是使用表格。要想设计美观,可以首先考虑表格。

    表格可以设置固定像素宽度或者窗口百分比宽度。这两种方法各有各自的优点,但如果你不介意表格内容垂直安排,你可以利用固定百分比宽度,因为它使布局更加多变。

    然而,如果希望文字更连贯地围绕在图片周围,固定百分比方法可能会导致很大的变化。在不同像素宽度的表格中,文字环绕方式差别很大。

    可以利用固定像素宽度的方法,更好地控制网站。但首先你要做出一个选择。如果希望网站在640x480分辨率显示器中呈现精美外观,就把表格宽度设定在600-620(最大值)之间。你可能希望把表格放在窗口中心位置,在窗口宽度变大时,会使布局非常好看。然而,如果访问者的显示率设定为1600x800,让浏览器呈现最大状态,那么网页就会很难看:600像素表格的两边会出现500像素的空白。

    很幸运,没有人在这种情况下浏览网站。通过与客户、朋友以及家人的交谈,我发现:即使显示器分辨率超过1000像素,浏览器窗口的实际宽度也会被缩小。

    你是否希望在高分辨率的显示器上呈现出带有空白部分的页面呢?或者你是否希望在640x480分辨率状态下,出现水平滚动条浏览呢?这些问题必须要考虑。

    3.字体的运用

    假设:你选择了固定宽度的表格,有一个单元宽度为300像素。你在这个单元中写了标题,选定了字体,尺寸调整到最佳。你可能完成任务了,但标题会在不同系统中呈现不同状态。

    即使在同一台电脑中,字体在IE与Netscape两个浏览器下,呈现的状态也有细微的区别。记住:1/8的用户使用Mac。由于技术原因(就不在这篇文章中介绍了),字体在Mac中比在Windows中要小。不要忘记,用户可以在浏览器中设置默认字号,如果是这样,你就不能控制字体的布局。

    一个解决方案就是利用CSS,但是业余设计者不了解这项技术。另一种解决方案就是做出让步。确保网站在主要的展示平台中呈现精美外观,经常是在Windows中。但是尽量不要使用最小的字体,因为Mac访问者很难浏览这些尺寸很小的文字。

    4.在不同浏览器中检验网站

    我向网站设计用户承诺:网站会在所有的浏览器中呈现精美的布局。为了保证这个目标实现,我准备了两台电脑:Intel以及Macintosh。在Intel电脑上我设置了Windows 98、Windows 2000以及Linux。在这些操作系统下,我测试了所有的网页;同时在Windows与Mac系统下的Netscape和IE浏览器中,测试了所有的网页。同时,一位同事帮我测试了Lotus Notes和AOL浏览器中,网页的布局和运行。

    这个过程看起来很没有必要,但是网页经常会在某些浏览器中出现小问题,需要我们进行修改。如果不做修改,是不是也挺好呢?可能。但是,用户对网站的第一印象很重要,用户只需用5到7秒钟就对网站有了大体的印象,所以每一个细节都很重要,必须要注意。

    如果你不能利用多个浏览器进行测试,你可以请朋友帮忙。你也可以利用图书馆或者Kinkos的电脑,通常那里既有Mac电脑,也有Windows电脑。

    要让大部分用户浏览你的网站,只遵循这四条建议还是不够的。按照这些规则设计网站,只不过是实现目标的开始。完成目标还需考虑很多因素,然而实现目标必须从建立意识开始。

    了解不同浏览器下,网站外观会不同;还要了解根据用户设置设计网站,这是确立意识的第一步。使用表格、慎用字体,让你更进一步。在各种系统中检验网站,可以让你了解还需要作哪些工作。

    然而,每一个过程都是从某个地方开始的。

    Copyright Google-Www.Com.Cn
    ICP: No.0006 Tel:(+86)756 2223203 6219990