Cssviewer Chrome是一款应用于谷歌浏览器的网页css样式查看插件,这款插件的设计初衷是为了简化网页制作人员的工作,不过在王小优看来,这款插件对于SEOer尤其是个人SEOer来说,也是一款不错的代码优化辅助插件。
一、安装Cssviewer Chrome的意义
大家都知道,现在的网页制作越来越依赖于div+css来实现展现效果。SEO需要兼顾代码及前端展现,以最精简的代码组织来实现用户体验最佳的页面效果。当然,SEO并不是专业的网页制作者,所以不是很精通代码知识也是情有可原,但是SEOer如果连代码的查看识别都做不到的话,就很难做好优化,毕竟发现不了问题就很难跟其他部门进行有效沟通,势必影响优化工作的顺利开展。
SEOer应当对代码有所了解,之后再借助Cssviewer Chrome插件,就可以很好地查看网页的css样式了,对于发现问题并提出解决方法是很大的帮助。
二、Cssviewer Chrome插件下载
百度云盘下载: https://pan.baidu.com/s/1dnNR-AbA9h0ZYjykES6cCw
另外大家也可以在谷歌商城进行下载,但是需要访问权限,如果大家可以翻墙当然是这种方式更好,如果不能翻墙无法访问谷歌,就退而求其次点击百度云盘下载吧。
三、Cssviewer Chrome插件安装
谷歌浏览器的插件安装方法株洲SEO在前面的文章里有过图文的演示,大家可以点击——>>>谷歌SEO插件UserAgentSwitcher使用说明(附下载地址)查看,这里王小优就不重复演示了。
四、Cssviewer Chrome插件使用方法
1、找到Cssviewer Chrome插件
如下图,打开谷歌浏览器,在右上角红方框内的图标就是Cssviewer Chrome插件,大家只要点击一下,Cssviewer Chrome插件就可以生效进行使用,如果想停止再点击一次即可;
2、Cssviewer Chrome插件使用演示
(1)单击Cssviewer Chrome插件的小图标后,大家再移动鼠标指针,电脑桌面上就会出现一个幕布紧跟着鼠标指针,在幕布上会详细罗列鼠标所指位置的css样式,如下图:
(2)css样式详细信息,大家可以再看看下面的放大图,王小优SEO博客栏目页文章标题的样式一目了然,包括字体大小、背景颜色、Box高宽等,对于SEOer来说,可以清晰的了解网站各模块的css样式,再也用不用通过查看网页属性的方式辛辛苦苦的查找了。
Cssviewer Chrome插件的使用方法演示就是这些了,如果还有不清楚的地方王小优乐意为你效劳。最后,希望大家还是要学习一点代码的知识哦!