WEB前端显示的特效和相应加载速度的取舍

  随着互联网的发展和普及,越来越多的人将加入到这个大家庭当中来。网民的成分也随之复杂,这意味着他们的需求将出现多元化趋势。这就对 WEB 前端的显示提出了更高的要求。

  作为 WEB 前端开发的技术人员,有很多方法来实现它: .Adobe 公司推出 flash 系列就是一个 WEB 前端显示互动性很好的一个应用。它可以展示绚丽的色彩和跳动、流畅的画面等许多效果。但是它对于目前来说存在一个加载速度问题,同时这个也是一个令人很头痛的问题。如果 WEB 前端大量的应用了 flash ,网页加载速度会比没加载它之前慢很多,会让你感觉无法忍受(当然,除了自己架设服务器,同时这里说的是在同等情况下比较)。

  大家都知道,可以说加载网页的“速度”和前端显示的“内容”决定 WEB 前端显示的质量:

  一方面:加载速度一直是大家比较关心的问题。现在大家上网无论是查找信息还是做其他的事情首先都要打开网页,如果网页打开很慢或者都打不开,那预期效果将大打折扣。而且在现在快节奏的生活时代,大家的性格都比较急躁,如果一个网页在 2-4 秒没打开 ( 个人看法 ) ,就会感到烦躁,然后关闭它 ;

  另外一个方面: WEB 前端显示内容的质量也是很关键的。大家都知道内容为王 ( 同等情况下 ) :假如一个游客浏览进你的网页,但是你的网页没什么实质性、有用的信息,那么下次他也就不会在浏览你的网页了,这就不利于网站的长久发展。

  那么鱼与熊掌可不可以兼得呢?根据现在的情况来看,目前实现的还不是很好,诺干时间后一定可以实现的。嘿嘿!

  那么我们可不可以在它们之间找到一个平衡点呢 !

  这个时候,也许 gif 动画可以帮你。它可以实现简单的效果,它相对 flash 等其他加载速度要快很多了,但是 gif 动画只能实现简单的效果。这个就看大家的选择了,不过一般情况, gif 动画还是可以满足大家要求的。

  也许大家都知道怎么制作它了,可能还有些不是 IT 行业的人不知道怎么制作。我在这里简单说下怎么制作它: 1. 先打开图像编辑软件,我这里以 PS 为例(其它的同样原理,很简单的)。 2. 在“窗口”菜单栏下面有“动画”选项,选择它。 3. 可以在编辑区域底部看到动画(帧),在里面有一副一副的图片,你只要把它们对的图片或者层内容改动,然后存为 gif 格式。那么该 gif 图片就会从第一帧开开始到最后一帧重复播放,这个就是简单的 gif 动画,简单吧!呵呵!

  如果有什么错误的地方,请大家留言,欢迎探讨 WEB 前端开发相关技术问题!

时间: 2024-09-15 12:30:12

WEB前端显示的特效和相应加载速度的取舍的相关文章

400% 的飞跃-web 页面加载速度优化实战

前言 一个网站的加载速度有多重要? 反正我相信之前来博主网站的人至少有 50% 在加载完成前关闭了本站. 为啥捏? 看图 首页完整加载时间 8.18s,看来能进来看博主网站的人都是真爱呀,哈哈. 正常来讲一个网页 4s 加载不完就会流失很大一部分用户,而博主的网站加载时间竟然达到了 8s 还是在电脑端,如果在移动端,加载时间会更久,体验会更差. 这样的话网站做得再难看批判者进不来不是白搭嘛,于是针对 web 页面加载速度的优化迫在眉睫. 基于博主以前优化过其他网站,于是博主准备把这次的优化过程记

Ext.net的系统发布在iis7上,系统内容显示不全,菜单无法加载

问题描述 Ext.net的系统发布在iis7上,系统内容显示不全,菜单无法加载 Ext.net的系统发布在iis7上,系统内容显示不全,菜单无法加载,在iis6上没有问题, <system.webServer> <handlers> <remove name="WebServiceHandlerFactory-Integrated"/> <remove name="ScriptHandlerFactory"/> <

jquery显示loading图片直到网页加载完成的方法

  本文实例讲述了jquery显示loading图片直到网页加载完成的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <!DOCTYPE html> <html class="no-js"> <head> <meta charset='UTF-8'> <title>Simpl

jquery显示loading图片直到网页加载完成的方法_jquery

本文实例讲述了jquery显示loading图片直到网页加载完成的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html> <html class="no-js"> <head> <meta charset='UTF-8'> <title>Simple Loader</title> <style> /* This only works with JavaScript, if it'

IOS设备访问有DWR推送功能的WEB页面时加载速度很慢

问题描述 PC.Android机访问页面时是正常的,但是就是用IPAD.Iphone设备访问那些页面时,加载速度异常的慢大概要等个10-20s左右才会显示.在这之前我具体也网上查了一下相关DWR加载慢的问题,别人加载慢是出现在PC的某些浏览器上.唯一共同点就是加了DWR推送功能的页面都是在IFRAME里面的子页面,但是我PC上的各种浏览器都没出现加载慢的情况.所以我想请教一下各位大神有没有什么好的解决办法呀?顺便说一下我用的DWR是3.0的. 解决方案 解决方案二:可以不可以找到那个地方慢.解决

让广告代码不再影响你的网页加载速度_表单特效

做一些联盟广告时,由于联盟广告的加载慢,整体页面的显示速度也会变慢,如果加入下面的代码就可以有效地解决这个问题. 第一步:把这段代码放在你要放广告的网页位置: <span id=\"andy\">广告载入中...</span> 第二步:把这段代码放到页底: <span id=\"span_andy\">  这里放广告的JS代码或其他加载速度比较慢的内容都可以.  </span>  <script type=\&q

【软件周刊第 32 期】Ubuntu 最新构建版启用 GNOME;Android 端 Chrome 59 提升页面加载速度

在最新发布的 Ubuntu 17.10 每日构建版中,Unity 桌面环境已消失,GNOME 已经正式成为即将推出的Ubuntu 17.10(Artful Aardvark)版本的默认桌面环境. 据悉,Ubuntu 17.10 将在 9 月 28 日发布 Final Beta 版本,这时候才会基本确定下来所有的内容,10 月 19 日 Ubuntu 17.10(Artful Aardvark)将正式发布. Android O 开发者预览版 Beta3 发布:包含最终 API 谷歌为参与 Andr

【原】提高网站加载速度的3项黄金守则

如何优化网页加载速度是每个前端开发工程师需要了解的,也是前端开发工程师需要具备的基本条件. 优化网站加载速度的原理主要是减少网站文件的大小,减少HTTP请求数.网站文件越小,浏览器加载页面会比较轻松,打开页面的速度也会提升:一个HTTP请求,对页面打开速度造成的延时大概是0.01秒,HTTP的请求数越多,网站打开的速度就会越慢. 那么如何减少网站文件的大小,减少HTTP请求数呢?笔者做前端(重构方向)有2年多了,这里分享3项优化网站加载速度的方法,希望能给有需要的同学以及刚接触前端的初学者带来帮

什么措施能影响网页加载速度呢?

摘要: 从我开始知道 SEO 这几年起,基本上所有的 SEO 活动都是基于前端的,从header 到 body,从小标签到 CSS,从链接到关键词密度:初期牛人们诊断一个网站 SEO 的标准也是从前端页面着手,不 从我开始知道 SEO 这几年起,基本上所有的 SEO 活动都是基于前端的,从header 到 body,从小标签到 CSS,从链接到关键词密度:初期牛人们诊断一个网站 SEO 的标准也是从前端页面着手,不过的确也是,从排名算法前端的代码的确占了大部分的比例,但后端的服务器速度优化,也开