24个Web前端人员不能错过的在线检测网站汇总

标签： Html检测 / css错误检测 / 代码规范 / seo工具
在用IE浏览网站时，发现下面显示“网页上有错误”，虽然不影响浏览，但总归让人感觉不舒服，大概多数站长都遇到过。而如果你的代码基础不是很好的话也许根本找不到办法去解决这个问题，以致费了好多时间都无从下手，我是遭遇过多次这样的烦恼，因为本站加了一些代码，但是难免会冲突，有时候就在状态栏显示错误，代码很长挨个看实在头疼。

于是爱整理的我就利用有限的资源整理了网页错误在线检测工具，结果还真发现了不少，把用过的工具进行了整理，分网页代码测试、网页兼容性、网速测试、seo优化四大类收集了24个可以在线测试网页的工具，推荐也收藏一下，以后备用。

>>>网页代码测试工具

没有站长可以保证自己的网页代码完全正确没有任何错误，特别是是否符合W3C标准，你可以通过以下测试来检查网站代码是否正确，无论你是asp的还是php的都可以哟。

1 .WDGHTML验证器【 http://www.htmlhelp.com/tools/validator】一个很好的工具，能找出网站语法错误的地方，并标注出来，也可选择对网站上单独的每一页进行单页分析。( 强烈推荐 )

2 . w3c标记验证服务【http://validator.w3.org】 对 HTML 和 XHTML 都能进行代码测试，自称是互联网络上第一个(也是使用者最多的)的 HTML 验证工具。

3 .CSS验证服务【http://jigsaw.w3.org/css-validator】 用于验证 css 源代码，能够标注出不好的 css 代码设计。例如：“Same colors for color and background-color in two contexts”。

4 . feed验证服务【http://validator.w3.org/feed】 用于查找 Atom 和 RSS feed 中的错误语法。

5 . 链接检查器【http://validator.w3.org/checklink】 用于搜寻查明你网站内的所有链接里是否有断链。( 强烈推荐 )

>>>网页设计的兼容性测试

我们常常看到网站设计者把重点放在怎网站的吸引力上，而完全不考虑会不会影响来访者的使用，一个浏览难度很大的网页是注定要失败，要让你的来访者方便的得到他要的信息(从而成为重复访客)，你的网站应当遵循 WCAG section 508 易用性规则。

6 . 网站兼容性【http://www.wave.webaim.org/wave/index.jsp】 高度可定制的工具，它采用了图形化模型展示网站兼容性问题( WCAG 1.0 and section 508 )。( 强烈推荐 ) 美

7 . 网站修改建议【http://www.tawdis.net/taw3/cms/en】 测试网页是否存在冲突( WCAG 1.0 兼容性 )，通过图形模式生成一份依据 wcag 优先模式为基础的网站修改建议。【翻译插件翻译不了，有需要的用用其他的网页翻译工具吧】

8 . 网页可读性扫描【http://www.cynthiasays.com】 采用了非常严格的规则来测试网页( 根据 section 508 和 WCAG 1.0 规则 )，生成的报告也极为详细( 详细到很难看懂 )。

9 . 网站兼容性测试【http://www.sidar.org/hera/index.php.en】 使用一种极为复杂但容易理解方式指出网页的 wcag1.0 兼容性问题。

10 . 【http://juicystudio.com/services/csstest.php】 进行了色彩对比测试，以确保你的网站的色调会符合 WCAG 1.0 的要求。

11 . 可读性测试【http://juicystudio.com/services/readability.php】 分析你网站上的文字是否有语法错误或拼写错误等问题，容易让人理解不( 根据 the Flesch Reading Ease 和 Flesch-Kincaid grade level algorithms 规则 )。( 适合英文网站使用 )

>>>网站速度测试工具

对于站长来说，在选择服务器地点的时候，一般都是根据自己访问时的速度决定的，那么你知道全国乃至全世界其它地区访问你网站时的速度如何吗?如果你是电信的，你知道网通的速度或者铁通的速度吗?要知道对于网站访问者来说，如果你的网站打开速度慢，那就会立即失去了继续访问的兴趣。但是如何测试网站速度呢?下面提供了几个网络测速网站，可以检测全球其它地区连接你的网站时的时间哦。

12 . 网站优化网页分析器【http://www.websiteoptimization.com/services/analyze】 一个很好的工具，它在分析完一个网页后，会为减少加载时间提出优化建议，着重优化物体的数目，图片和网站的总体大小。(强烈推荐 )

13 . 测试工具【http://www.websitepulse.com/help/tools.php】 有一系列的工具来确定网站的加载速度和主机信息。【翻译插件翻译不了，有需要的用用其他的网页翻译工具吧，能翻译但是使用的时候报错，会返回到英文网页】

14 . 网站的加载时间测试【http://internetsupervision.com/scripts/urlcheck/check.aspx】 从世界各地不同的服务器来测试你的网站的加载时间，用于确定是不是各地的来访者都能顺利快速的打开你得网站。

>>>浏览器模拟工具

是一个普遍的问题，因为现在有着很多的操作系统和浏览器，你得网站必须得兼容它们，但这绝不是一件容易的事。通过下列工具，你可以了解你得网站在各种浏览器上的显示效果。

15 .浏览器兼容性测试【http://browsershots.org】 能给出你的网站在不同浏览器下显示效果的截图，包括：Firefox 和 Internet Explorer ( Windows )、Firefox 和 Safari ( Mac OS X )、Iceweasal 和 Konqueror ( Linux )，但是结果要在 1 - 3 小时后才能出来。

16 . 浏览器在IE中的兼容性【http://ipinfo.info/netrenderer】 实时生成你的网站在 Internet Explorer 5.5 、6.0 和 7.0 下的截图。（网站有点慢，耐心等等）

17 . 手机访问网页的兼容性【https://ready.mobi/】 分析使用手机访问网页的兼容性问题，会生成一份详细的报告，并提供了在两种不同类型的手机浏览器上你得网站可能显示的样子。【翻译插件翻译不了，有需要的用用其他的网页翻译工具吧】

>>>搜索引擎优化 (SEO) 方面

一个网站，如果对搜索引擎有着比较好的友好度，一定会比较有竞争力。

18 . 网站访客数据【http://www.urltrends.com】 会显示网站的访客是如何通过搜索引擎来到你的网站，还有各个流量是多少。这些数据是包括 Google, Yahoo, MSN, Alexa, AlltheWeb, AltaVista 和其他一些网站。( 强烈推荐 )

20 . Whois查询【http://whois.domaintools.com】 一个 WHOIS 网络工具。

21 . 搜索引擎模拟【http://www.seo-browser.com】 可以让你看到在搜索引擎眼里一样的网站( 去掉所有的”美丽”配件 )。（打开速度超级慢）【翻译插件翻译不了，有需要的用用其他的网页翻译工具吧】

22 . 网站分析【http://www.seoworkers.com/】 非常有用的工具，分析了网站上的各种分类特征，包括 meta 标签、关键字密度及加载时间。( 强烈推荐 )

23 .web页面检查【http://www.seekport.co.uk/seekbot】 可以分析网站的数据和内容，以得出搜索引擎会如何有效的解释分析的网站。

24 . 搜索引擎优化工具【http://www.seochat.com/seo-tools】 用以分析网站 Google adsense 盈利潜力，关键字密度，Meta tag 等等…… ( 强烈推荐，这个网站有很多实用的工具 )

当然国产的统计工具也有很多咯。以上的大多都是英文的网站，有人就要说了，我去，我英语12级啊，你给我看这个？对于不懂英语的同学，在下推荐一款插件（这个插件仅仅是用来翻译的，由翻译插件造成的不能使用等情况请自动忽略），我用的是360安全浏览器9.1版本的一个自带的插件，没有的话可以在扩展中找找，实在不行了百度一下（非常方便）

欢迎大家以各种姿势关注，在下不定期更新——本内容来源于我的今日头条【爱整理】，原内容来源于网络，由本人整理呈现!

24个Web前端人员不能错过的在线检测网站汇总相关推荐

Web前端人员如何面试？常见vue面试题有哪些？
Web前端人员如何面试?常见vue面试题有哪些?vue是一套用于构建用户界面的渐进式JavaScript框架,也是初创项目的首选前端框架.很多企业在招聘前端工程师时都会考察其对vue的了解,接下来小编 ...
推荐Web前端初学者应该知道的书籍和网站
互联网的快速发展和激烈竞争,使得用户体验成为一个重要的关注点,导致专业Web前端工程师成为热门职业.各大公司对Web前端工程师的需求量都很大,要求也越来越高,优秀的Web前端工程师更是稀缺.因此想要学 ...
web前端实训大作业：餐饮网站设计——美食城(7个页面) HTML+CSS+JavaScript
web前端实训大作业:餐饮网站设计--美食城(5个页面) HTML+CSS+JavaScript 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要 ...
Web前端开发常用的十款开发工具汇总
今天小编要跟大家分享关于Web前端开发常用的十款开发工具汇总 1.Glitch https://glitch.com 好的,这不仅仅是一个工具,还是一个非常棒的编码平台以及一个很棒的技术社区.我可以在 ...
web前端人员自行切图教程
Web前端切图总结: 前期资料准备阶段: 获取最终版 PSD格式文件. 安装PS软件,并打开该PSD文件. 获取页面设计需求文档或工单文件,了解需求后,开始准备进行切图. 用到的快捷键总结及常识知识: ...
Web前端技术知识：为什么要进行网站重构呢？
很多网站因为在建站初没有做好策划工作,后期又在开发的时候外包给了技术欠缺的团队,因为疏忽管理,然后在在后期优化时很难达到效果.于是大部分人准备进行网站重构.Web前端工程师为何要进行网站重构呢?这个问 ...
web前端技巧-ES6新特性与重点知识汇总（三）
ES6的新特性到这里就是第三期了也是最后一期,今天我们将把剩余的几个ES6特性介绍完毕,希望能够给同学带来帮助,还是带好小本本我们开始了. 十三.Promise Promise 是异步编程的一种解决方 ...
web前端技巧-ES6新特性与重点知识汇总（二）
ES6框架的新特性我们今天再来介绍其他的一些,还是带好写本本做好笔记,我们马上开始. 七.扩展运算符扩展运算符(spread)是三个点(-).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔 ...
web前端技巧-ES6新特性与重点知识汇总（一）
前端开发使用ES6框架已经不是什么新鲜的事情了,现如今也有越来越多的同学选择使用它,但随着ES6的更新迭代,一些新的特性很多同学并不了解,今天小千就来给大家介绍一下,记得收藏一下啦. 一.ES6变量声 ...

24个Web前端人员不能错过的在线检测网站汇总

24个Web前端人员不能错过的在线检测网站汇总相关推荐

最新文章

热门文章