每个网站的设计者都希望自己所设计的网页能让浏览者一见倾心, 为实现这一目标, 在进行网页设计时设计者常有追求尽善尽美的倾向。因此将网页设计得异常复杂, 并使用大量的图片和动画, 以期对浏览者产生感染力。这虽然无可非议, 但 Elementor 网站设计的最终目的不是孤芳自赏, 而是以满足浏览者访问需求为最终目的。对浏览者而言, 他们希望网站提供精美内容的同时, 首先必须保证一定的访问速度, 否则即使网站内容精彩绝伦, 但却千呼万唤始出来, 同样会使浏览者因无法忍受漫长的等待而弃之。
就目前国内网络现状来看, 网络频宽仍是瓶颈, 拥塞现象非常严重。低频宽依然是 Elementor 网站设计时必须正视的现实 (除非您所设计的网站只在单位内部的区域网中使用), 因此如何使自己的网站适应低频宽网络环境成为不少 Elementor 网站设计者面临的主要挑战。从技术角度而言, 若想使自己的网站在低频宽环境下同样有出色的表现, 无外乎是在不影响网站功能的前提下, 尽量减少频宽消耗因素, 让浏览者能够得到较为理想的访问速度。
1. 减小图片尺寸
图片可能是扼杀您的网页的凶手! 精美的图片有时自然可以成为 Elementor 网站设计的画龙点睛之笔, 但更多时候却耗蚀了浏览者有限的频宽。一幅图片所占用的空间通常需要成千上万位元组, 您在制作网页时可能感觉不到什么, 但是对于浏览者来说就显得太大了。您到网上看看就会发现, 大块的等待时间是由图片下载造成的。网页的浏览者往往是没有耐心等待的, 您的图片再精美, 但如果对于网络速度来说过于庞大, 则大多数浏览者在没有看到您的图片时就已经转向别处。因此在非必要的情况下, 尽量减少图片的使用是提高网站访问速度的要诀之一。
如果必须使用图片, 则应设法将图片的尺寸减到最小。图片尺寸除了受画面大小的影响外, 色彩数的多少也是关键因素, 因而减少图片中的色彩数也可以得到较为显著的瘦身效果。在不影响 Elementor 网站设计初衷的前提下, 将图片色彩从真彩调整为 256 色或 16 色就可以让多数体态臃肿的图片苗条不少, 而这种色彩调整一般通过常用的图片编辑软件就可以轻松搞定。
另外, 在图片使用较多的情况下, 将图片分割成小块, 然后再进行组合也不失为一种行之有效的瘦身途径。您可以将网页上的图片一幅幅进行比较, 找出相同的部分, 将其分割出来, 这样浏览者在访问您的网页时, 相同部分的图片只要下载一次即可了, 如果使用巧妙, 可以大大节省下载时间。
2. 尽量不用图片来代替文字
现在, 有很多网页制作者喜欢用图片来代替文字, 这样虽然可以美化网页的版面, 但却带来网络频宽资源的耗蚀。因此, 能使用文字的地方尽量不用图片, 这几乎成了设计网页的基本准则。
对于那些需要强调的内容, 或需要营造某种特殊的视觉效果以引起浏嵬者的兴趣时, 可以通过特殊字摹等显示技术加以实现。这一技术的缺点是在不同型别的浏览器中的效果可能会有所不同, 设计时需要进行相关的测试, 但它却是加快网站访问速度行之有效的途径。
3. 少用动画
动画是加强网页视觉效果和吸引注意力的有效手段。活泼有趣、动感十足的画面有时可以收到出奇制胜效果, 但您必须意识到, 动画对网络频宽的要求更为苛刻, 滥用动画的结果可能会导致许多浏览者对其望而生畏。如果感觉网站上的动画必不可少, 则应通过一定的动画编辑技术尽量压缩动画尺寸, 以免彩响访问速度。如果动画与访问速度出现较大的冲突时, 对其忍痛割爱当为明智之举。例如, 将按钮的图片从动态改为静态就可以明显地加快访问速度。
4. 表格使用技巧
表格在网页制作中几乎是必不可少的, 网页的排版大部分都是通过表格来实现的。但在使用表格时需要注意的是, 设计者对表格的不同处理方式将会给网页的载入速度带来截然不同的后果。
将整个网页放置于一个单一表格内并将表格巢状使用, 会导致网页无法在浏览者的浏览器上逐行显示, 而只有等到整个表格下载完毕, 且浏览器根据计算确定不同表格元素的位置后才能一次性显示。这会让浏览者因等待时间过长而转向其他网站, 适当地分割表格并减少表格巢状层数可使浏览器在网页全部下载完之前就能够显示部分内容, 不致出现长。时间的网页显示停滞现象。另外, 给出固定的表格单元格尺寸, 则可以在需要较长时间下载的内容前先显示文字等内容。
5. 相容性
除了上面提到的访问速度外, 网页的相容性也是非常重要的。设计网页时必须考虑到浏览者所使用的浏览器是各式各样的, 可能有人还在使用早期的浏览器。虽然一些新技术可以让您的网页大放光彩, 但如果您不想失去这部分浏览者的话, 就不要使用那些新浏览器才增加的功能。