站长之家首页 > 优化 > 网站加载速度最新资讯 > 正文

网站代码优化:让网站打开速度飞起来

2014-03-12 14:03 · 稿源:顺e网

网站的打开速度是一个非常重要的用户体验考核标准,当然,影响网站打开速度的原因有很多,比如服务器的问题,比如程序的问题等等,本文和大家主要分析的不是外部因素,主要是大家在网站设计过程当中,把内部因素做到极致,加快网站的打开速度就是这么简单!

一、如何判断一个网页的打开速度

1、网页内容的大小

搜索引擎优化网页打开的最佳 速度:2秒!网页内容所包括的文本、产品的图片、视频、Flash文件等。 我们有一个网页访问的时间计算公式:网页打开时间=网页内容大小/最小带宽+解析次数*每次解析时间+服务器处理时间+客户端解析时间。用户最满意的打开网页时间,是在2秒以下。用户能够忍受的最长等待时间的中位数,在 6-8秒之间。这就是说,8秒是个临界值,如果你的网站打开速度在8秒以上,那么很可能,大部分访问者最终都会离你而去。

2、控制页面的总规模

要想把网页做得精彩,内容必须丰富,但不要把所有的内容都放在一个页面上,应控制页面的总规模。首先统计页面中的每个元素,如文字、图像、ActiveX或Java代码 以及HTML文本的大小,页面容量最好在50K以下。

二、网页设计优化

网页优化是指在设计,使用网页各元素时,能够尽量减少网页元素对下载速度所产生的影响。这些细节我们了解后,是能在日常网页制作中可以进行避免的。

1、让网页符合W3C标准

(1)在网页制作中使 用结构层同表现层完全分离。也就 是布局使用用CSS而不用TABLE。这样做不仅能替换掉专业的表现层的垃圾代码如标签。而且也能让你的网站在重构方而能够轻松实现。几年来的多项研宄已证实,如果对一个网站进行重写,使用DIV+CSS布局取代表格布局,那么可以砍掉原XHMTL文档大小的一半。

(2)让HTML标记有始有终。不管是我们自己写或是查看他人的HTML代码时,会发现HTML代码标签写得不规范。有的标记有头无尾,如标签li,标签p。它并没有妨碍代码的正确执行。但浏览器却会花费时间来判断和计算段落或者列表项目在哪里结束。所以,我们一定要让标记有始有终,这样做不仅使HTML代码格式规范,更可以加速页面的显示速度。

2、优化层叠样式表

(1)层叠样式表css是HTML的装扮器,一个漂亮的Web页面不可能没有它。一般来说,我们要合并精减CSS代码,移除无用多余代码;图片尽量不要使用CSS的滤镜来渲染; CSS的选择器尽量简单定义。

(2)HTML页面中有多种引用CSS的方法,不同的方法导致的效率也不一样。通常,我们可以将定义于 

3、优化图片

图片可以说是影响网页加载速度最大的因素,不管是使用图片优化工具,还是减小图片大小。在质量和文件大小之间必须找到一个合适的均衡点。主要有以下几个需了解的方面。

(1)一般在网页上使用的图片格式有三种,jpg、png、gif。我们只 需要知道在什么时候应该使用什么格式,以减少网页的加载时间。

(2)图片的使用显示。需要显示图片时,尽量使用背景图片,而不是直接加载。也需要注意的是尽量不要用一个很小的图片当背景,这样做会加大客户端CPU处理时间。比如说预载入下一页的主要内容时。在用户看到大图之前先把小图展开,让用户不至于在等待的过程中太焦虑。

(3)图片在HTML代码里要标明大小。这样浏览器就能事先留好空。当你在网页上添加图片或表格时,你应该指定它们的高度和 度,也就是参数。如果浏览器没有 找到height和width这两个参数, 它需要一边下载图片一边计算大小,如果图片很多,浏览器需要不断地调整页面。这不但影响速度, 也影响浏览体验。

  • 大家在看
  • 相关推荐
  • 苏宁回应要求全员卖货:更好地了解用户需求 优化用户体验

    近日,针对“要求全员参与社群推广带货”一事,苏宁方面回应称,目前的特殊形势下,苏宁通过多年积累的O2O能力让宅经济发挥最大价值,也成为“苏宁推客”社群营销产品的机遇与使命。而社交电商的方式要求管理干部深入一线,也能够更好地了解用户需求优化用户体验。

  • 微众银行不断探索科技前沿,优化企业内核与用户体验

    从市场痛点来看,移动互联网时代,对80%的长尾客户而言,当前的金融服务存在着许多空白点和痛点,传统金融服务难以完全覆盖。“融资难、融资贵、门槛高”等问题不一而足。在这种背景下,微众银行应运而生,微众银行是国内首家民营银行和互联网银行,一直本着以合规经营和稳健发展为基础,致力于为普罗大众、微小企业提供差异化、有特色、优质便捷的金融服务。微众微众银行在 2015 年 8 月份,微众银行正式推出首款独立APP“微众银?

  • 越来越多用户更新Windows 10后尴尬:电脑速度变慢

    据外媒报道称,Windows10 更新KB4535996、KB4540673 和KB4551762 可能会使电脑启动速度比平时慢,已经有不少用户反馈了这个问题。

  • 三种配色可选 iQOO 3用速度美学定义新速度

    昨天是iQOO家族最新成员iQOO3 正式开卖的第一天。截止当天中午 11 点,iQOO3 全网销售额破亿的同时,一举斩获京东手机3000- 4000 元价位段销量&销售额双冠军、天猫平台行业单品销售额冠军、苏宁安卓手机3000+价位段销量销售额双冠军三项桂冠,用事实和数据说明iQOO3 是一台具备重新定义5G性能旗舰实力的强悍产品。iQOO3 的强悍性能源自高通骁龙 865 这颗强大的心脏,配合业界首家UFS 3. 1 以及LPDDR5 的出色发挥,iQOO3 可以跑出 6

  • 微信正式支持深色模式 并优化语音消息转化成文字体验

    昨日,微信发布了IOS最新的7.0.12版本,据更新内容显示,微信已正式支持深色模式,同时还优化了语音消息发送,可将语音消息转化成文字。IOS用户只需在“设置”—“显示与亮度”中选择深色模式,最新版微信就会跟随系统,自动进入深色模式。

  • 微众银行打造极致用户体验,不断完善智能服务

    微众银行作为国内第一家民营银行和互联网银行,所有的业务都在线上完成,对互联网金融形式的变革做出了卓越的贡献。微众银行APP更是以安全、便捷著称,不断推出更加智能、多样化的服务。微众银行APP打造极致用户体验微众银行APP引入微众银行AI团队自研的营销解决方案:长效推荐模型+智能运营平台,以“数据+算法+平台”驱动的站内广告形式,打造极致用户体验。其长效推荐模型针对性解决用户在互联网平台的“复杂交互行为”和“长短

  • 没等来魅族17 Flyme 8体验版先来了 优化了这几个地方

    在电动车领域,特斯拉一直备受关注,旗下的多款车型也成为很多消费者的最爱。 3 月 10 日上午,特斯拉CEO埃隆·马斯克在社交平台发文,庆祝特斯拉第 100 万辆车下线,这对特斯拉而言也是一个里程碑。

  • 藏身代码背后的战疫

    为了防控疫情,许多小区实行封闭管理,居民足不出户,卖菜需求在线上爆发。步步高超市虽有到家业务,但此前模式是以门店为中心,覆盖门店半径三公里内的客户,第三方提供配送。特殊时期,原有模式存在覆盖面窄、配送成本高且运力不足的短板,提升到家业务覆盖范围和效率成为步步高面临的首要难题。

  • 金融业数字化转型加快 榕树贷款专注提升用户体验

    近日,人民银行等部门联合印发《统筹监管金融基础设施工作方案》,进一步加强对我国金融基础设施的统筹监管与建设规划,以适应金融科技兴起所带来的变化,为金融科技的未来发展创造适宜、规范的制度环境。疫情期间,“非接触”服务和金融服务数字化转型的速度加快。事实上,“非接触”金融服务早已深刻改变我们的生活,金融机构也已纷纷布局线上,加快数字化转型。线上业务优势的进一步凸显,提升了金融机构从传统网点走向线上的紧

  • 维信卡卡贷实践信用科技创新,持续完善用户体验

    当前,政府在催收环节的监管正在逐渐收紧,对个人信息催收也提出诸多限制,给贷后催收带来新的挑战。贷后风险管理离不开个人信息等数据的支持,只有正确使用数据,才能真正做到风险防控。目前,维信金科研发出了智能化催收系统,旗下维信卡卡贷已经接入央行征信数据库,给用户带来不断升级的信用管理体验。据了解,作为维信金科旗下的明星产品,自 2015 年 4 月 17 日正式上线以来,维信卡卡贷专注于向广大信用卡持卡人群提供安全?

  • 不断提升用户体验,ColorOS 7 限量尝鲜适配机型再次加量推送

    3 月 5 日,ColorOS 官方微博表示将在3 月 7 日 10 点展开对 Reno Ace 、Reno 10 倍变焦版、R17、R17 Pro、Reno2、Find X 等 13 款机型的「限量尝鲜适配版」招募,其中最受用户关注的Reno Ace系列的招募数为2w、Reno 10 倍变焦系列为3w、Find X系列为1.3w,此次ColorOS的限量适配加量推送可谓诚意满满,手持相关机型的朋友千万别错过。以用户为重,ColorOS 7 限量尝鲜适配版加量推送自 2019 年 11 月发布后,ColorOS 7 凭借着舒适?

  • OPPO 牵手乐播投屏,ColorOS用户尽享无线投屏新体验

    作为全球五大手机品牌之一的OPPO,其系统ColorOS全球月活用户数已突破3. 2 亿,覆盖超过 140 个国家和地区,支持 72 种语言,深受全球各地用户的喜爱。据悉,为了让用户拥有更好的投屏体验, ColorOS计划逐步接入乐播投屏SDK,并于 2020 年 3 月份正式上线。相比安卓原本内置的镜像功能,接入乐播投屏SDK能够使OPPO手机兼容国内更多电视设备,使OPPO ColorOS 用户的投屏体验有很大提升。对于疫情时期的国内用户来说,无疑是一项好?

  • 苹果为iOS 13用户体验拼了:下月起调整新老应用、更好支持全面屏

    今天苹果发出公告称,从 2020 年 4 月开始,苹果表示所有新App和App更新都需要使用iOS 13 SDK构建,而新的应用和老的应用都要支持iPhone XS Max或更高版本的全面屏设计。

  • 创新驱动,维信金科旗下维信卡卡贷用户体验持续升级

    随着消费金融行业的发展,传统银行、持牌消费金融、互联网消费金融领域均有领先的优势企业出现。其中,维信金科在业内首提智能金融战略,以人工智能算法集成大数据采集和风控服务,结合和构建各类场景,为用户提供智能化、自动化、打破时间和地域限制的消费金融服务,其旗下维信卡卡贷用户体验不断升级,领跑业界。据了解,维信金科成立于 2006 年,专注于个人消费金融服务。自成立以来,维信金科坚守“让金融服务触手可及”的普惠

  • 预防新冠新武器:网站弹窗提醒用户不要用手摸脸

    ,新上线的网站DoNotTouchYourFace.com,通过摄像头监视用户的动作,每当用户下意识地用手触摸自己的脸时,它就会大喝一声“No”(不要)。该网站就是通过这种方式,帮助坐在电脑前的办公室白领预防感染新冠肺炎病毒。

  • 澳洲政府网站MyGov直接崩了 众多用户涌入申请补助资格

    澳洲政府门户网站MyGov周一早上突然不能看,原因是很多澳大利亚人涌入该网站确定他们是否有资格获得该国Centrelink计划的支持。

  • 微软重构Windows 10:越来越多用户体验到新图标等内容

    越来越多的用户发现其中一些Windows10 的新图标正在向非内部人员推出。邮件和日历套件的应用程序正在快速更新到所有用户,据推测,其他应用的图表改进也将很快推出。

  • iOS 14 代码泄露,外媒提前「发布」了今年的苹果新品

    考虑到最近各种大会宣布取消,看网上爆料的理由好像更充足了一些。根据外媒 9to5Mac 的报道,他们已经获取了泄露的 iOS 14 代码,里面不仅包含下一代 iOS 系统的新功能,还透露了一些苹果新产品的信息。

  • iOS 14 代码显示苹果新 iPad 将支持全系统鼠标光标

    代码显示,通过这一次软件升级,Mac 桌面体验中的大部分光标功能都将被引入 iOS 系统。有一个不同之处可能是,如果用户几秒钟未触碰外接鼠标或触控板,则光标指针会自动消失,这是为了保证 iPad 触控优先体验而作出的让步。当用户再次尝试移动光标时,指针会重新出现。

  • 腾讯首度披露开源协同成果 内部代码开源率提升至70%

    腾讯今日对外发布《腾讯研发大数据报告》,披露了2019 年公司在产品及技术研发方面的重要数据,据悉,这也是腾讯自技术委员会成立以来第一次主动对外披露研发相关大数据。

  • 参与评论
文明上网理性发言,请遵守新闻评论服务协议