关于网页对客户端分辨率自适应策略的研究

                   作者：杨宏伟　华艳辉　单弘江

[摘要] 从网页信息传播角度提出网页对客户端分辨率的适应问题，将解决方法归纳为调整和选择策略;阐述了两种实现策略的原理与具体实现方法。
　　[关键词] 自适应分辨率调整选择
　　
　　一、前言
　　
　　网页是现代信息传播的媒介，网页在客户端的显示效果直接关系到信息传播的有效性。那么如何让自己的网页自动适应浏览者的显示分辩率呢？解决方法是多种多样的，但归结起来不外乎两种策略： 论文检测天使-免费论文检测软件http://www.jiancetianshi.com
第一种就是调整策略即调整网页要素以适应分辨率的变化。第二种就是选择策略即根据分辨率的不同选择不同规格的网页或网页样式。下面我分别阐述其实现原理和操作。
　　
　　
　　论文检测天使-免费论文相似性查重http://www.jiancetianshi.com
二、网页调整策略及其实现
　　
　　网页调整策略就是根据网页的信息传达的需求，调整影响网页要素属性设置以期达到与浏览器显示分辨率自动匹配的策略。表格是目前网页制作大量使用的手段之一，也是影响网页信息传达的主要因素；当分辨率调整时，窗口尺寸发生变化，导致表格被压缩或拉伸，显示位置发生变化，从而影响了网页的整体显示效果。究其成因可能有两种：一种原因将表格尺寸设置为固定值，当窗口尺寸变小时，表格被压缩；或者表格尺寸设为百分比形式，当拉伸时表格被拉大，同样影响网页的正确显示。二是表格对齐方式的设置，表格的默认对齐方式设置为居左，这样分辨率设置变化发生变化时，比如提高分辨率，窗口尺寸变大，表格右侧就会出现大量空白，从而也会影响网页的显示效果。
　　对于上面提到的两种情况，我们可以采用简单的表格嵌套的办法加以解决，即内层表格以较小的固定尺寸居中显示，确保传递效果的实现，外层表格则作为背景按百分比居中显示。既保证了所传递信息的有效性，同时又能自动保证网页有一个良好的外观。
　　上述处理只是简单的实现了表格网页对显示分辨率的自动适应，其应用还存在很大局限性，比如内层表格主要用来传递信息，其尺寸是以假想浏览者的最小分辨率为设计前提；当浏览者的分辨率提高，内层用于传递信息的表格并不会变大，信息传播的效果也就必然会受到影响。

　　[8]电大学习网.免费论文网[EB/OL]. /d/file/p/2024/0425/fontbr />　　三、网页选择策略及其实现
　　
　　网页的选择策略就是根据网页的信息传达的需求，对网页或网页构成格式进行选择以期与传播对象显示分辨率自动适应的策略。根据解决策略在实现方法的不同，我们可将其归纳为两种：
　　1.调用适合不同分辨率的网页
　　这种做法是我们所期待的,也是算法上容易实现的一种。我们可以事先制作出展示信息内容相同但适合不同分辨率设置的网页，然后，检测浏览者显示分辨率的设置，调用相应的网页，从而保证信息传播的有效性。这种调用适合不同分辨率网页的方法的关键就在于如何测试浏览者的显示分辨率。通过javascript脚本的编写可以轻松实现该操作。
　　首先准备2个可供在800*600像素和1024*768像素下调用的页面htm1.htm和htm2.htm，分别为在头文件中加入Javascript代码，利用脚本查验浏览者的显示器分辩率；然后根据常用的分辨率设置设定调用条件，调用相应规格网页。脚本应用实例如下：
　　在上述情形中，网页载入时首先要进行分辩率的检测；如果检测到符合if条件所设定显示器宽度值如常用的分辨率设置有1024*768和800*600，就会从服务器调用相应的网页。但是，这种设置基本上解决了常用显示分辨率设置条件下网页的正确显示问题，但仍然存在不完善的地方，比如非常规的显示分辨率设置，显示仍然有可能出现问题。为此，我们可对上述代码进行改进，使之适合分辨率的变化，程序改进代码如下：
　　上述改进中，MultiHref（）函数的参量设置了4种，调用时可以分别调用4种不同的网页，考虑到网页制作的工作量问题，上述改进中只设置了两个网页htm1和htm2供程序调用。
　　2.调用适合不同分辨率的css（样式表文件）
　　CSS(Cascading Style Sheet) 即层叠样式表 ，它是一系列格式规则，主要用来控制网页内容的外观。使用 CSS 样式可以非常灵活并可以精确地控制网页外观，例如css可以精确确定网页布局、字体和表格样式等。Css的这些特点使其在网页制作中被广泛的应用。在网页中加入样式表的方法有内部嵌入方式或外部链接方式。其中外部链接方式就是让网页调用独立的css文件用以控制网页显示的外观，这种方式为实现网页对分辨率的自动适应提供了可能性。在设计网页时，事先建立一组适合不同分辨率的css文件，然后根据css文件建立网页布局；在页面加载过程中取得屏幕分辨率，重新设定页面元素应该应用的css文件。选用不同的链接样式的方法也可用javascript脚本来实现,其代码可如下：
　　在使用时，将上述代码嵌入到与之间即可实现适合不同分辨率的css调用。
　　
　　四、结束语
　　
　　上述两种策略在实现上各有千秋。前者比较适合流行的显示器设置，但操作相对简单且不需要对分辨率进行检测，因而网页载入延时较小；后者适用范围较广，但需要准备多个可供调用的网页文件，因而网页制作工作量加大，同时该操作需要侦测终端显示器的分辨率，网页显示上存在一定的延时，但却可准确表达网页信息。两种策略虽有不同，但却有着共同的特点，其一是都能够自动适应浏览者的显示器分辨率设置，从而都可保证网页信息的有效传播；其二是都不需要动态网站的支持，从而具有广泛的应用性。

　　[8]电大学习网.免费论文网[EB/OL]. /d/file/p/2024/0425/fontbr />