我们将在本文中介绍一些关于页面构建常用的一些小工具,大部分是基于firefox的插件,通过这些小工具可以让我们在页面构建中事半功倍.
一个页面相关信息的集大成者，任何关于网页前端的信息你都能从里面找到，我们可以很方便的查看网页的大纲、无CSS，查看DOM节点等。只要你想，基本都有了。
通过检查class名称使用情况，来查看页面中的CSS信息，从而方便开发者优化CSS样式表。
可显示4类信息
Seen css中当页所使用的class
Seen before 此class曾经出现在此网站的其他网页，当然是在已经浏览过其他网页的情况下
Unseen css中的class，此页面并未使用过
:hover 伪类信息
我们以前曾稍微深入的探讨,请移步至CSS减肥工具 — CSS Usage
Yslow是基于firebug的一个网页评级工具,它根据Yahoo用户体验部门订制的34条可能对网页前段表现产生影响的规则,这些规则中有23条可以通过这个工具来测试.即使我们不使用这个工具,了解这些规则也是很不错的.
Page Saver可以将网页转化为图片，包括网页上的Flash也能同时被转化。网页可以按照你的要求保存为PNG或者JPEG格式。可以将整个网页或者在屏幕上看到的部分转化为图片。为了方便截取网页，插件提供了大量的设置选项，包括默认的文件名、文件后缀名、图片的质量。可以通过工具栏按钮截取图片，也可以通过浏览器的菜单选项截取图片，还可以通过命令行截取图片。
当前可见区域保存为图片：
将整个页面保存为图片
页面构建的工作不仅是要让页面尽可能的达到设计稿的艺术要求，网络传输的速度要求，还要为搜索引擎更容易找到你做出相应的努力。以前我们相对少得谈及此，SenSEO是一款SEO诊断的火狐插件，你打开面板在里面输入你的关键字，之后点击后面的几个按钮。可以给你一个综合打分，分析你的Title、Description、 Keywords、robots、Number of Words、Number of matching Keywords、Keyword-Density、Number of HTML等等。这个插件提出的有一些分析建议还是很有借鉴意义的。
此处有分数评级，绿色代表符合标准，黄色代表警告、小问题，红色代表问题严重、需要重新优化
Title 标签使用正确情况
Meta标签
例：<meta name=”description” content=”新浪网为全球用户24小时提供全面及时的中文资讯，内容覆盖国内外突发新闻事件、体坛赛事、娱乐时尚、产业资讯、实用信息等，设有新闻、体育、娱乐、财经、科技、房产、汽车等30多个内容频道，同时开设博客、视频、论坛等自由互动交流空间。” >
meta name=”description”标签使用正确情况
先介绍一下robots.txt是什么：搜索引擎通过一种程序robot（又称spider），自动访问互联网上的网页并获取网页信息。可以在网站中创建一个纯文本文件robots.txt，在这个文件中声明该网站中不想被robot 访问的部分，这样，该网站的部分或全部内容就可以不被搜索引擎收录了。
(1) 使用机器人的声明，即创建robot.txt文件，以控制搜索引擎访问
(2) 提供一个网站地图，使用谷歌网站管理员工具提交
H标签使用优化(下面的这几条建议,如果我们使用html5构建页面的话,可能要重新审视了.)
页面内容优化
DOMAIN域名
路径地址优化
此内容将inspect SEO Criteria 和 components信息 集合起来，可以进行打印