`

如何提高网页的效率 第十条到第十四条

阅读更多
第十条:Minify JavaScript and CSS 
    减少JavaScript和CSS文件的体积这点很好理解。在你的最终发布版本中把没有必要的空行、空格和注释全部去掉。显然手工去处理效率太低,好在网上到处都是用于压缩这些东西的工具。压缩JavaScript代码体积的工具随处可见,我便不再列举了,这里我只提供一个用于压缩css代码体积的在线工具网站——http://www.cssdrive.com/index.php/main/csscompressor
它提供了多种压缩方式,可以适应多种要求。

第十一条:Avoid Redirects 避免跳转
    我只从网页开发人员的角度来解读此条。那么我们可以解读到什么东西呢?2点——
1:“此域名已过期,5秒钟以后,页面将跳转到http://www.xxxxxx.com/index.html页面”,这句话看起来的确很熟悉。但是,我就奇怪了,为什么不直接链接到那个页面呢?
2:一些链接地址请更明确的写出来。例如:将http://justinyoung.cnblogs.com/ 写成http://justinyoung.cnblogs.com (注意最后面一个“/”符号)。的确,这两个网址都能访问到我的博客,但是,事实上,它们是有区别的。http://justinyoung.cnblogs.com 的结果是个301响应,它会被重新指向http://justinyoung.cnblogs.com/ 。但是显然,中间多浪费了一些时间。

第十二条 Remove Duplicate Scripts 移除重复的脚本

图:对重复说“不!”
这个准则的道理很浅显,但是真正在工作中,很多人却因为“项目时间紧”、“太累了”、“初期没有规划好”……这样的理由搪塞过去了。你,的确可以找很多的理由不去处理这些多余重复的脚本代码,如果你的网站不需要更高的效率和后期维护的话。
也真是这点,我提醒大家一些,一些javascript框架、javascript包一定要慎用。至少要问一下:用了这个js kit 到底给我们多少方便,提高了多少工作效率。然后,再与它因为多余的、重复的代码带来的负面效果比较一下。

第十三条:Configure ETags 配置你的实体标签
    首先来讲讲什么是Etag吧。Etag(Entity tags )实体标签。这个tag和你在网上经常看到的标签云那种tag有点区别。这个Etag不是给用户用的,而是给浏览器缓存用的。Etag是服务器告诉浏览器缓存,缓存中的内容是否已经发生变化的一种机制。通过Etag,浏览器就可以知道现在的缓存中的内容是不是最新的,需不需要重新从服务器上重新下载。这和“Last-Modified”的概念有点类似。很遗憾作为网页开发人员对此无能为力。他依然是网站服务器人员的工作范畴。如果,你对此有兴趣,可以咨询贵公司的网站服务器管理员。

第十四条:Make Ajax Cacheable 上面的准则也适用Ajax
   
图:Ajax的使用要恰当
现在的Ajax好像有点被神话了,好像网页只要Ajax了,那么就不存在效率问题了。其实这是一种误解。拙劣的使用Ajax不会让你的网页效率更高,反而会降低你的网页效率。Ajax的确是个好东西,但是请不要过分的神话它。使用Ajax的时候也要考虑上面的那些准则。


后记:
    当然,上面的这些也只是供你参考的理论上的准则。具体的情况还是要具体的去对待。理论和准则只是用来指导现实工作的,却是万万不可死记硬套。
分享到:
评论

相关推荐

    第十四届蓝桥杯省赛Python研究生组题目pdf

    《第十四届蓝桥杯省赛Python研究生组题目解析》 蓝桥杯竞赛,作为国内极具影响力的编程竞赛之一,旨在提升大学生与研究生的编程技能,尤其是对于Python这门广泛应用于数据处理、科学计算以及人工智能等领域的语言。...

    南财-网页设计与制作练习4(附答案).doc

    16. 在Dreamweaver MX中,可以利用模板生成具有相似结构和外观的网页,从而大幅度提高网页制作效率,并简化繁琐的网页编辑和维护工作。 17. 模板文件的扩展名为dwt。dwt是Dreamweaver模板文件的扩展名。 18. 在...

    2023年第十四届蓝桥杯软件省赛 python研究生组真题

    《2023年第十四届蓝桥杯软件省赛 Python研究生组真题解析》 蓝桥杯是一项备受瞩目的全国性编程竞赛,旨在提升大学生和研究生的编程技能,特别是对于Python这种在数据科学、人工智能等领域广泛应用的语言。每年的...

    ASP.NET开发实战1200例(第II卷)第十四章 part1.rar

    总的来说,《ASP.NET开发实战1200例(第II卷)第十四章 part1.rar》是一个全面的学习资源,涵盖了ASP.NET开发的多个方面,从基础概念到高级应用,对于初学者和进阶开发者都有很高的参考价值。通过深入学习和实践,...

    电子课件-《Dreamweaver 网页设计与制作(第二版PPT教程)》

    学习者将学习如何创建和调整框架,提高网页的组织性和导航效率。 7. **项目七:制作美容网站——应用样式表** CSS(层叠样式表)是现代网页设计的核心,本项目教授如何使用CSS来控制文本样式、布局和网页的视觉...

    网站建设与网页制作课程PPT.ppt

    最后一部分课程,即第十三章和第十四章,简要介绍了Flash 8和Fireworks 8这两个工具。Flash 8曾是创建动态交互内容的主流工具,而Fireworks 8则擅长处理网页图像和图标设计。尽管现在前端技术已经日新月异,但这些...

    网页制作实例进度表.pdf

    学习如何使用模板和库来提高工作效率,以及如何插入和配置表单元素,以便收集用户信息。 第十部分:SPRY表单对象、层的使用(2周) 引入SPRY表单对象和层的概念,提升动态网页交互设计的能力。 第十一部分:行为与...

    Dreamweaver网页设计(计算机应用).doc

    最后,第十部分,媒体对象的应用,涵盖插入各种多媒体元素,如Flash、视频、音频和ActiveX控件,丰富网页内容。 通过这门课程的学习,学生不仅能够熟练掌握Dreamweaver的使用,还能具备独立设计和维护网站的能力,...

    div+css网页设计教程

    8. **第十到第十四章节**:深入探讨了表格样式、圆角框制作、以及各种新型网页元素的创建,如Tab面板、折叠面板和伸缩面板等,同时总结了不同布局的设计方法。 9. **第十五到第十七章节**:通过CSS禅意花园的案例...

    电子教案-《Dreamweaver网页设计与制作(第二版)》

    《Dreamweaver网页设计与制作(第二版)》是一本专为职业教育设计的教材,旨在教授学生如何使用Adobe Dreamweaver这一强大的网页设计工具进行网页创作。本教程分为多个项目,覆盖了从基础到进阶的各个关键知识点,...

    《中文版Dreamweaver 8网页制作实用教程》Dreamweaver素材

    9. **13-04.html**:第十三章的第四节,可能涉及到了JavaScript和Dreamweaver的集成,讲解如何在网页中添加动态效果和交互性。 10. **10-04.html**:第十章的第四部分内容,可能继续讨论表单,可能包含验证用户输入...

    大学网页作业

    10. **第十一章:响应式设计与移动优先** 最后一章,学生们将学习如何为各种屏幕尺寸和设备设计和开发网页,包括媒体查询的使用,以及移动优先的设计策略。 这些作业涵盖了网页设计和开发的关键概念,旨在帮助...

    jquery网页特效

    它广泛应用于各种类型的网站和应用程序,极大地提高了开发效率。 二、jQuery网页特效 1. 图片轮转:图片轮转是一种常见的网页动态效果,可以用于展示产品、新闻或者摄影作品等。jQuery提供了多种实现图片轮转的插件...

    [SSH+Maven+Bootstrap视频教程] 第 四十一 讲.zip

    【SSH+Maven+Bootstrap视频教程】第 四十一 讲是一个综合性的IT教程,主要涵盖了Java开发中的三个重要技术:Struts、Spring和Hibernate(SSH),并结合了Maven项目管理和Bootstrap前端框架。本讲内容可能涉及这些...

    CSS网页布局,html布局

    第九至十四章重点讲述了使用CSS设计导航菜单。这包括横向导航、带当前标识的标签式导航以及下拉和多级弹出式菜单。这些菜单通过CSS的伪类选择器(如`:hover`、`:active`)和定位(`position`)属性实现动态交互效果...

    CSS 设计彻底研究 php

    第十三和第十四章系统总结了不同布局方式的设计方法,提供丰富的实例。最后,从第十五章到第十七章,作者通过分析CSS禅意花园的作品,教授读者如何进行整体页面布局的设计。 学习CSS的过程中,除了本书,还可以参考...

    十天学会php之第四天

    在“十天学会php之第四天”的学习过程中,我们将深入探讨PHP这门强大的服务器端脚本语言的关键概念和核心语法。尽管十天的学习可能不足以让你立即成为PHP开发的专家,但这种系统化的学习方法确实可以帮助你构建一个...

    JSP网页编程技术大全(中文)

    **JSP网页编程技术大全** **一、JSP概述** JSP(JavaServer Pages)是Java平台上的一个标准,用于创建动态网页。它允许开发者在HTML、XML或其他标记语言中嵌入Java代码,实现了服务器端的业务逻辑和表示层的分离,...

    十天学会DIV+CSS(WEB标准).doc

    XHTML是一种结合了XML严格语法规则的HTML版本,它的使用可以提高网页的可读性和可维护性。CSS(层叠样式表)则是用来控制网页元素样式和布局的关键工具。文档类型定义(DOCTYPE)是HTML或XHTML文档的开头,用于告知...

Global site tag (gtag.js) - Google Analytics