网站的html标签和代码该怎么优化 看看懒猫的讲解

更新时间:2019-08-05 17:41点击:  来源:http://www.lanmaoseo.com/  作者:懒猫

  随着时代的不发展,seo专员不仅仅只需要做网站优化了,对于站长来说,我们只有学的越多,才能独立做的更好,才能不断的进步。网站的html标签和代码就是需要我们了解的其中之一,因为这关系到网站布局的修改。今天懒猫就讲讲网站的html标签和代码该怎么优化吧。

  网站的html标签和代码该怎么优化?

  1、头部代码规范化

  头部代码是搜索引擎爬行网站的入口部分。目前,许多网站的头码相当统一,刻板印象效果明显。类似蜘蛛的模板框架不喜欢这样的网站代码。我们需要做的是标准化网站代码,设置网站独特的头部,使搜索引擎新鲜,以吸引蜘蛛爬行。

  2、使用div+css布局网页

  尽管div+css现在已经成熟,但是考虑到网页的兼容性和布局的简单性,许多网页设计者可能仍然使用旧的表格布局。虽然桌子布局很方便,但它的缺点是显而易见的,即它会大大增加网页的大小,尤其是多层表格的嵌套。如果嵌套数量太多,这种布局不仅会增加容量,还会影响搜索引擎的爬行和网站的收集。

  另外,一些网站会使用外部文件,将css和js放在外部文件中,页面html中只要放一样代码调用就可以了,有时候我们去查看的一些源文件代码,会看到很多css代码以及javasript代码,将javascript放置在网站页面的html文件中的最前面,而真正能用到得一些文字部分这被推倒了html的后面,马海祥认为这种代码都需要精简。

  3、CSS优化

  CSS是页面渲染的一个非常重要的组成部分,包括颜色、大小、背景和字体。编写CSS非常简单和容易,但是仍然有许多技巧来编写精炼的CSS代码。

  (1)、CSS位置

  CSS说明如果出现在网站之后,页面需要重新渲染,打开速度受到影响,所有css定义代码的位置要放到网站之前。

  (2)、css sprite技术

  网站上的一些图片可以采用css sprite技术进行合并,减少加载请求次数,从而提高网页的加载速度。

  (3)、CSS代码优化

  通过对css代码属性的简写、移除多余的结构(frameworks)和重设(resets)等一系列的方法和技巧来简化css代码,减小css文件的大小。

  (4)、尽量不要使用内嵌式CSS

  内嵌式CSS分为两种,一是在head区域的普通内嵌式;二是在标签内出现的行内内嵌式CSS,无论是何种内嵌CSS方式结果都会提升页面的体积,对此,我们可以尽量使用外调式的CSS来为站点页面的体积瘦身。

  4、JS优化

  JS优化与其他语言的优化也仍然有相同之处,JS优化的关键,仍然是要把精力放在最关键的地方,也就是瓶颈上,一般来说,瓶颈总是出现在大规模循环的地方,这倒不是说循环本身有性能问题,而是循环会迅速放大可能存在的性能问题。

  (1)、JS位置

  网页代码中对js进行优化的时候,马海祥建议将JS放在页面最后,这样可以加快页面打开速度。

  (2)、合并JS

  合并相同域名下的js,通过减少网络连接次数从而提高网页的打开速度。

  (3)、LazyLoad(延迟加载)技术

  Lazy Load是一个用JavaScript编写的jQuery插件,它可以延迟加载长页面中的图片,在浏览器可视区域外的图片不会被载入,直到用户将页面滚动到它们所在的位置。

  (4)、JS代码外部的调用

  我们知道当前的搜索引擎还是不能够识别JS代码的,倘若在网站中出现大批量的js代码网站在收录上就会出现困难,而我们要做的就是将用到Javascript代码用外部调用的形式放在网站中,这样可以简化搜索引擎的工作,也不会在无形中衍生出无效代码累及网站。

  不仅如此,马海祥觉得可以采用外部调用的还有css代码,建站之初可以将网站的文字、颜色定义在css代码文件中,尽量不要在页面代码内出现过多的样式代码。

  (5)、降低页面对于JS的依赖性

  现在来说,JS对于搜索引擎并不不友好,虽然有消息称搜索引擎不会对JS有厌恶的情绪,但是多一事不如少一事,虽然JS可以制作出很多的效果,但是网页中大量的JS将影响蜘蛛对页面的抓取和增加网页体积,尤其是页面的关键位置如导航栏,尽量采用DIV+CSS的设计方法。

  5、table标签的缩减

  table标签是现在大多数上线网站中最为常见的代码形式,原因根本在于table在建立网站时比较快捷,但是这也就影响了网站的后期优化。

  相对于div+css布局的精简代码网站来说,它的占位比较大,所以,在建站时候,尽量是少用表格,即便是要使用表格时,嵌套式表格也要尽量少用,以免产生冗杂代码。

  那么,现在的网站用什么做呢?很多程序员第一想法就是采用CSS去做,采用CSS去排版,这种做法呢,就使页面中的表格大大的降低了,但在马海祥看来,网站也不能没有表格,有些事必须使用到得,使用表格本身没什么,但是有很多网站都采用嵌套表格,一般这样的表格形式会给网站产生大量的垃圾代码,并且这些垃圾代码都是没有任何用处的代码,这一类代码也是我们网站需要精简的代码之一。

  6、代码注释省略

  很多程序人员在编写代码是都习惯在别人看不懂的地方给出一段注释,这些代码往往是为了几个程序员之间的协同工作,对于外人以及搜索引擎来说没有任何用处,相反还会给搜索引擎蜘蛛带来一定的困扰。

  打开页面代码我们经常会看到一些注释代码,这是程序员为了表明代码意义而做的注释,其实这些打开不必,因为对于搜索引擎而言,它们是不存在任何意义的,只是会增加了页面代码的容量,这样对于网站不会有什么利处,不如直接省略。

  7、清除页面中多余的代码

  有的网站以为制作者的代码书写习惯问题,页面会有很多空格代码,比如:空格代码、style和font重复定义的代码,不要小看这些体积很小的代码,积攒多了,也会使我们的网站异常的臃肿。

  很多网站都是采用的DIV+CSS,在CSS中定义了文字的字体,颜色,以及页面的排版,但是在网站的其他地方还用了以style以及font来再次定义字体字体,这些代码完全没有必要重复定义,属于可以精简的代码。

  8、将html控制方式转换为CSS控制

  许多网页设计者习惯于控制标签中的内容。例如,img标签使用宽度和高度来控制图片的大小,并尝试将这些代码转换成外部调整的CSS,以使网页代码更小。

  9、缓存静态资源

  通过设置浏览器缓存,不经常更新的文件,如css、js等。,缓存在浏览器端,以便当同一访问者再次访问您的网站时,浏览器可以获得css、js等,而不是每次都从服务器中读取,从而在一定程度上加快了网站的打开速度,并节省了服务器流量。

  10、网页压缩技术

  就网页压缩而言,我相信所有的站长都很熟悉,其主要目的是让服务器Gzip压缩页面Gzip,减少元素的数量,从而减少数据传输,进一步提高网页的加载速度,此功能需要服务器的支持。GZIP压缩通常可以将网页压缩30%-80%,这是很重要的优化效果。

  以上就是今天懒猫为大家讲解的网站的html标签和代码该怎么优化。如果现在的你还只是会优化手段,而没有其他的技巧,那么在这个时代里,你就是很容易被别人取代,在面试的时候也没有什么可以打动面试官的。如果你想学相关的知识,可以联系懒猫。

  如果你也有网站排名上不去的话,可以联系懒猫,懒猫可以帮你上排名,当然是有偿的,但是懒猫保证,会让你的网站快速排名,如有需要可以加懒猫微信详谈。本文由懒猫seo博客原创,如需转载请注明出处:http://www.lanmaoseo.com/seowzyh/52.html