网页html代码优化常见方法以及方式

自媒体 思享 303浏览
摘要:
可以减少网页体积,加快网页下载速度;那么我们如何优化web代码呢?Div+css排版。Div+css样式可以简化很多样式,将网页模板的设计分离出来放在一个独立的文件夹中,对于网站的维护和更改来说相当方便。还可以提高页面的浏览速度,增加客户访问的友好度。布局css的时候,要有好的命名习惯和合适的代码注释。并不是页面特效越多越好。

为什么要优化html代码

  1. 可以减少网页的体积,加快网页的下载速度;
  2. 提高蜘蛛对信息的抓取的速度和准确性
  3. 有利于减少错误的代码,提高页面的对蜘蛛的友好性
  4. 便于管理人员维护,提高工作效率
  5. 减少网页的噪音,突出页面的主题

html标签

那我们怎样对网页代码进行优化?

  1. 对网页中存在多余的代码,我们要学会清除垃圾代码.网页中一般存在的垃圾代码会有空格符、空标签块、多余的嵌套标签、不必要的注释等.如:在每行的开始或结尾都存在着大量的空格符,我们需要把这些冗余代码删除,还有空白行.清除空白行有一种简单快捷的方法:可以将代码转至html代码编辑的模式按ctrl+A全选代码使用组合键shift+Tab删除.
  2. 采用div+css排版.Div+css样式可以精简很多样式,将设计网页模版的部分脱离出来,放在一个独立的文件夹中,对于网站的维护和更改都相当的方便.且可以提高页面的浏览速度,增加客户访问的友好性.在css进行布局时,要有良好的命名习惯,适当的代码注释.
  3. 引用js文件,并不是页面的特效越多越好(先css后js).
  4. 对于图片的优化,网站的图片不是越多越好,但要有图片,要完善图片的ALT属性,最好使用带有目标关键词的描述.
  5. 对于错误的代码,我们可以利用3w工具进行检查.

对于页面标签的优化,H1定义为正文标题,即一级标题,它具有唯一性.H2为二级标题,主要出现在正文的文章标题上.H3为三级标题,一般出现在页面的侧边栏,H4-H6一般出现较少.值得注意的是在页面中和的区别,对关键字起到强调作用,而仅仅是加粗的作用.

推荐阅读

Canonical有没有必要写,作用大不大

刚刚仿站的时候见有人加了 不知道Canonical标签是干什么用的,这个对百度有用没有呢?看他们说对谷歌雅虎必应有用,对百度没用呢?...

页面如果有很多个H1标签有什么影响

网站建好了,但是查看源码发现一个页面有很多个H1标签,想问一下这样有没有什么不良影响,文章页中出现多个H1标签 该怎么处理比较好...

javascript实现部分内容的展开/收起

我们经常可以看到有的网站的文章有个导读,摘要板块,但其内容确是和正文重复的,如果出于SEO的考虑需要保留这个部分,我们可以收起/展开一部分内容,来提升用户体验 HTML代码示例 默认收起 <!DOCTYPE html> <html ......