在很多情况下，与web页面(前端) seo的优化相关的点是页面的紧凑化。 本教程概述了如何精简网页，以及关于缩短网站加载时间和提高网站性能的建议。




从相反的方面考虑，如果网页杂乱，网页打开的速度慢，会怎么样呢？




首先，直接结果是web代码复杂，网站加载速度慢。 鉴于国内互联网速度慢的大环境，存在复杂的网页打开慢、加载慢的问题。




其次，移动用户的兴起导致了许多用户通过移动用户(如手机和平板电脑)访问网站的情况，网站打开速度慢的问题变得更加突出。




另外，站点加载速度的速度和速度直接影响站点对搜索引擎友好的多与少。




最后，对于网站管理者和seo优化者来说，繁琐的网页存在维护困难的问题。




其实，优化网站页面(前端)不是技术难题，减肥页面也是很容易操作的。 小明seo教程的建议是很容易做到的，很快就会做到的。 网页(前端)的优化方法和建议如下。




启用GZIP压缩页面。




什么是GZIP压缩？ GZIP最初由Jean-loup Gailly和Mark Adler创建，用于UNIX系统的文件压缩。 在Linux中，GZIP格式的后缀. gz文件是很常见的。 现在，它是互联网上非常常见的数据压缩格式或文件格式。




什么是GZIP压缩页？




HTTP协议上的GZIP编码是提高WEB应用程序性能的技术。




在大流量网站上，用户经常使用GZIP压缩技术感觉更快。




这通常是安装在WWW服务器上的功能，当有人访问此服务器的网站时，服务器的这个功能将被压缩并传送到访问过的计算机浏览器中显示。 通常可以将纯文本内容压缩到原始大小的40%




以小明seo教程为例，使用AlibabaCloud (阿里巴巴云)服务，其默认有GZIP压缩模块，网站原来的网页大小为78120，压缩后的大小为10544，估计的压缩率。 忽略硬件条件时，网站代码越少越紧凑，相对打开的速度越快。




2 :网页(前端)支持浏览器缓存，达到速度优化效果。




浏览器缓存有什么用？ 浏览器缓存为了节约网络资源加速阅览，浏览器将最近请求的文档保存在用户磁盘上，访问者再次请求此页面时，浏览器可以从本地磁盘上显示文档，因此可以加速页面的阅览。




浏览器缓存在哪里？




文件、内存(session等)、cache (缓存)、cookie、session、viewstate等我们经常使用的东西，可以认为是缓存数据。 实际上，cache与session具有相似的功能，但cache可以为代码设置到期日期和依赖关系。 如果所谓的依赖关系(例如，微软的cachedependcysqlcachedependency类)依赖关系更改，则会通知cache过期且无效。 缓存有服务器缓存、客户端缓存。




示例：如何使用浏览器缓存优化网页(前端)。




使用浏览器缓存优化网页(前端)




对seo优化者来说，不需要掌握浏览器缓存代码的使用方法，但需要知道原理。




3 :利用内容分发网络(CDN )优化网站的加载速度。




/2017/09/1-45.jpg




内容分发网络(CDN )的概念： CDN是建立在网络上的内容分发网络，依赖于部署在各地的边缘服务器，通过中央平台的负载均衡、内容分发、调度等功能模块




内容分发网络(CDN )的原理： CDN的基本原理广泛采用各种缓存服务器，将这些缓存服务器分布在用户访问比较集中的地区和网络，用户访问网站时，辉光




内容分发网络(CDN )的目的是使用户能够在附近获取所需的内容，解决互联网拥挤的情况，提高用户访问网站的响应速度。




内容分发网络(CDN )的主体不是站点管理者本身而是空间商。




4 :删除剩馀代码。




一个网站的网页通常有很多余地的代码。 就像首页使用的js一样，列表页不能使用。 如果所有站都使用标头调用，则不需要相关代码的页面也无缘无故地添加很多代码。 这些代码的紧凑化有助于前端打开的速度。 也就是说网站内的所有页面都不需要多余的代码。




5 :有效利用CSS控制模式。




站点页面(前端)优化方法和推荐-css样式




前端代码是紧凑的站点，css代码和div是分离的，前端不需要在一些代码中使用style定义样式，全部用css控制即可。 例如，即使在一个网页中使用style定义样式，使用css定义样式也会重复代码，从而降低网站前端的加载速度。




6:CSS代码的优化和控制。




小明seo教程提供的所有网站页面(前端)的优化方法和建议最终目的是加快网站的打开速度。 这些方法和建议的落地点是简化代码，减肥网站前端。 css代码的优化点如下： css代码的排列同属性提取共同css选择器把网页的颜色和背景设定样式分离(大网站需要注意)条理性化css代码等。




7 :前端js代码优化。




与css代码一样，前端js代码的优化方法包括但不限于：




避免全局搜索：在将全局对象存储为局部变量的函数中，访问全局变量比访问全局变量更快，因此可以减少全局搜索。




计时器：如果是针对持续执行的代码，则必须使用setInterval而不是setTimeout。 因为setTimeout每次都初始化计时器，setInterval只在开始时初始化计时器。




字符串连接：如果连接多个字符串，则为=； 如果是收集字符串，例如多次=操作同一字符串，建议使用一个缓存，使用JavaScript数组收集，最后使用join方法连接。




避免with语句：与函数类似，with语句创建自己的范围，因此增加要执行的代码的范围链的长度。 通过搜索其他范围链，在with语句中执行的代码总是慢于在外部执行的代码。 如果不使用with语句，请尽量不要使用with语句。




把数字转换成字符串：一般最好”1把数字转换成字符串看起来很丑，但实际上这个效率最高。




将浮点转换为整数：许多人使用parseInt ()，但实际上parseInt ()用于将字符串转换为数字，而不是浮点和整数转换。 Math.flo ()或Math.round ()； 如果要定义toString ()方法并进行类型转换，最好显式调用toString ()。 内部操作在尝试所有可能性后，会尝试对象的toString ()方法是否可以转换为String，因此直接调用更有效率。




多种类型声明： JavaScript可以用单个var语句声明所有变量。 这是一个分组语句，用于减少整个脚本的执行时间。 和上面的代码一样，上面的代码格式也非常规范，容易看到。




插入迭代子： var name=values； I； 前面两个句子是var name=values；




使用DocumentFragment优化多次append。




使用innerHTML赋值代替构建dom元素。




根据模板元素clone，代替createElement；




使用firstChild和nextSibling而不是childNodes来遍历dom元素。




删除DOM节点




使用事件代理程式




重复使用的调用结果预先保存在局部变量中。




有关优化前端js代码的其他说明，请访问http:cn blogs/LI yunhua/p/4529086.HTML。 我有详细的说明。




注意： seo优化人员不需要掌握前端js代码优化的具体代码。 这是前端负责人的工作。




8 :使用tab表的提案




tab表单布局页是过时的技术，现在更有效的是div。 关于使用tab表，建议尽量不要使用tab表，并禁止在嵌套条件下使用表。




9 :站点图像seo优化。




网站图像优化是加快整个工作站打开和提高加载速度的重要一环，对网站来说，需要使用正确的图像尺寸和格式，在不损害画质的情况下压缩图像。




首先，使用jpg格式等正确图像格式的图像。




其次，使用合理的图像尺寸。 图像尺寸越大，对加载速度的影响就越大。 据统计，图像减少了50%，整个网站的页面减少了75%。 处理图像尺寸的基本要求是在满足用户需要的基础上使用合适尺寸的图像。




再次使用工具压缩图像。 图像变小可以加快网站的打开速度，使用压缩工具可以减少图形占用的空间。




10 :删除多馀的字体和web注释。




从字体方面分析，如果字体使用过度，则网站加载速度会变慢，不利于提高网站前端的打开速度。




根据网页注释分析，网页注释有利于前端开发者网站的维护，但另一方面，这些注释对搜索引擎不起作用，是多余的“噪音”。




小明seo教程评价：




网站页面(前端)的优化方法和建议既为硬件也为软件设计，与车站内外有关。 车站外侧是内容分发(CDN )、GZIP压缩页面等优秀的空间商的责任。 在局内侧，seo优化者和前端开发人员需要精简网页，优化图像。 总的来说，网站页面(前端)的优化是目前技术条件下比较容易完成的工作，也是seo优化的基础工作。