存在元素，并且采用像 “或者”这类不被当下 HTML 标准所支持的标签，甚至借助数量众多的方式把条目排列分布在页面里面。

影响，编写那种带有很强烈浓厚上世纪风格的 HTML 代码，有可能致使标记复杂程度变得极高，从而随之在不同的浏览器里呈现出相互不一样的运行效果。另外，我们根本没有任何缘由在微软 Edge 乃至是 IE 的新版本，包含 IE 9、10 跟 11 当中运用这样复杂的标记方式。

怎么去防止：别再运用元素去处理内容布局了，并且要严格限定它在展示表格数据时的使用频次。得充分知晓当下有哪些标记选项能够采用，具体能够点击这里查看.org里的汇总。运用HTML代码来叙述页面内容，而不是去定义内容的显示形式。要准确显示设计内容，需优先运用CSS。

2. “在我的浏览器中明明没有问题……”

错误：开发人员或许会特别青睐某一款特定的浏览器，或者是极端地轻视另一款浏览器，并且会把这种存有偏见的看法带到网页测试工作里面。在某些情形下，我们甚至有可能性把来自网络的示例代码直接放进项目当中，然而却没有测试它能够在其他浏览器里正确地被渲染。另外，某些浏览器在样式方面会有不一样的默认值设定。

影响，编写一个站点，这个站点只针对特定浏览器有效，这样极有可能致使使用别的浏览器的用户，遭遇到特别糟糕的访问感受。

如何去避免呢，这是个问题。那种在开发进程里，针对每一款浏览器以及它的各个版本，去开展网页测试的做法，明显是不切实际的。然而情况是这样的，我们能够每隔特定的一段时长，就借助多种浏览器，去查验自身的网站是不是能够正常地运作，这算得上是一种比较理想的折衷方式。当下不管大家运用哪一种首选开发平台，均存在大量的免费工具，可去协助各位达成测试工作，具体涵盖免费虚拟机或者站点扫描工具这两种。又或者等到网站还具备能够提供快照的能力时，能帮助我们弄明白特定页面处在不同浏览器、不同版本、不同平台上时，有着怎样的渲染效果。然而，等工具依然能够借助不同浏览器来呈现我们当下正在开展开发工作的单一页面。在采用CSS开展设计操作的时候，务必要记住针对所有默认值予以“重新设定”。

要是大家的站点运用了任何针对单一浏览器所打造的特殊CSS功能，那么就得留意处理各类提供程序前缀，包含--、moz-或者-ms-。作为行业趋势指南，我提议大家仔细查阅下面给出的各参考站点（皆为英文原文）：

微软Edge开发博客指出，有一段与过去的间断，第二部分是关于，去往，，，等等。

• .org: CSS

• Bruce : On --

虽说上述那些参考资料已然明晰了我们应当怎样去规避提供程序前缀以及与之相关的理由，不过大家同样能够点击此地经由具体的建议去知晓更多的解决办法（英文原文）。

3. 注意调整格式

出错: 借由给予提示的办法向用户索要数据, 尤其是采用输入文本框的形式, 并且只是简单假定该数据能够像预先期望的那样从用户那里获取到。

当处于默认信任用户输入信息的状况下，我们存在着面临大量意料之外麻烦的可能性。倘若所要求的数据未能被正确获取，或者所获取的数据与底层数据格式不相兼容，那么页面极有可能发生错误。更为严重的是，某些针对网站数据库的故意违反行为，甚至能够构成足以形成注入式攻击的情况。

怎样去防止呢，第一条提议便是要保证用户可以清楚地知晓网站要求其录入哪一种数据类型，就当前来讲，仅仅给出“请输入地址”的提示，有可能意味着用户需要输入公司地址、家庭住址甚至是电子邮箱地址，除了做出针对性阐释之外，我们还应当充分施展现代 HTML 当中所提供的数据有效性验证技术，不管数据在浏览器端是否被当作有效，我们一定要在服务器端同样对其加以验证。永远不要，在尚未确认字段内容，符合数据类型要求的情形下，允许用户所输入的，多行索引T-SQL语句，使用站点数据。

4. 反应速度太过缓慢

错误：在那些有着大量高品质图像，以及或者图片的页面当中，我们是应该利用。

其高度以及宽度属性被元素进行调整，当中来自页面里的CSS以及等文件链接常常也体积是庞大的，另外，源HTML标记的存在经常带来不必要的复杂性以及加载负担。

影响：要是某个页面的全部渲染时间特别久，那么就会有一部分用户或许会选择放弃访问，甚至会不耐烦地去重新加载整个页面。在某些情形下，倘若页面的处理耗时过长，甚至有可能引发其他未知的错误。

怎么去避免，不能觉得互联网传输速度不断变快，就毫无顾忌地设计出那种臃肿的页面成果。相反，要把从浏览器到站点之间往返的每一点流量都看作运营成本。图片算得上是页面臃肿问题的主要起因，所以，为了最大程度降低图片给页面造成的加载成本，要从下面这三个角度来进行考量：

请问问自身，“页面里所涵盖的全部图片均为必要的么？”要是答案为否，那就去除那些非必要的图像。大伙也能够点击此地对自身的网站开展扫描，借此获取建议来知晓哪些图片能够予以压缩。

凭借O’Matic这类工具或者RIOT，把自身的图片尺寸调控抵达最低水准。

采用将图片预先加载的方案，这不会把初始下载的实际成本给降低，然而却能使得站点里使用相关图片的其他页面具备更为优异的载入速度。

另外一种能够降低成本的方式，是去压缩CSS与链接文件的体积，现在我们能够选择众多工具帮自己完成这项评估工作，这些工具当中包含CSS以及JS。

在结束第四点错误以前sublime text 3 乱码，我们还需要提一下，要在HTML当中，于使用或者标签之前，做出精准的判断（与第一点相同）。

5. 编写出“应该能够起效”的代码

差错在于，不管是运行在服务器端的代码，作为开发人员，我们都应该透过测试去验证其实际运行成效，进而确保其肯定能够在部署之后起到预期作用。大家的代码在执行之际不应引发任何差错，因为在这之前我们已经对其展开了充分测试。

影响，含有未经测试代码之站点，甚有可能，于供最终用户使用之时，以极为糟糕之方式，产生各类错误。此不仅会极其严重地影响到用户的实际感受，而且错误信息内容的具体类型，亦可能会向那些打算入侵站点的黑客，透露那些本该受到严格保护的细节线索。

如何避开：人难以避免会出现差错，所以我们要把这样的哲学思考引入编程工作。在这当中，我们要保证借助所有最佳技术方式来防止错误的产生，并且在其实际出现后马上察觉。另外一种有助于提升代码质量的法子便是针对未来有可能出现的变动对代码开展单元测试。

处在服务器端发生的代码错误，得在用户还没察觉到的情况下，就被发觉并且予以修复。仅仅向用户展示必要的错误提示，并且大家要更加用心，把自带的HTTP 404错误页面设计出美感来。

6. 编写fork代码

出问题了：秉持着支持全部的浏览器以及它们各自各个不同版本的那种崇高的理念，有一些开发人员会去创建不一样的代码，以此来对应每一种有可能出现的运行场景。这些代码是以if语句循环作为基础的，并且针对各类实际存在的方向提供与之相对应的fork版本。

造成的影响是，随着浏览器版本持续更新，对fork代码文件进行管理，就会变得极其复杂，甚至没办法达成。此外，如同第一点所说的那样，这么去做实际上根本毫无必要。

怎样去避免：于代码内部开展功能检测，并非朝着浏览器以及版本去着手。功能检测技术方案的现身明显削减了代码数量，并且还确保了代码更易于让人阅读且便于管理。大家能够思索借助等库进行辅助，在达成功能检测之际，以自动化形式为那些早已无法适配HTML 5或者CSS 3的老旧浏览器给予后备支持。

7. 采用非响应式设计

错误，在开展站点开发工作之际，假定用户具备和开发人员、设计师等同的显示器尺寸。

影响在于，当在移动设备之上查看站点时，用户体验会受到影响，当在某些超大型屏幕上查看站点时，用户体验同样会受到影响，比如无法查看到页面里的某些重要方面，甚至无法导航至其它页面。

该怎样去避免呢，把响应式设计纳入到开发应考虑的范畴里。在站点中运用响应式设计，甚至用相同的方式来调节图片尺寸。在这一方面，这款有着高人气的库绝对能够给各位帮上很大的忙。

8. 构建毫无意义的页面

过错在于，面向公众的页面里存在实用性内容以及信息，然而却不给出任何跟搜索引擎相关的关键字，也不给出标签，还不给出提示，并且不具备无障碍访问功能。

状况如下，受其影响，用户借助搜索引擎寻觅咱们页面时变得困难重重，这般一来，致使其获取理想访问量难上加难甚至根本无法达成。此外，页面内容须精心设计，目的在于确保用户查看期间不会对其视力造成影响。

怎么避开：运用SEO（也就是搜索引擎优化）机制，还要支持HTML可访问状况。在SEO这一块，务必要保证添加标签，以此去提供涵盖关键字以及相关描述的具意义页面内容。想要达成更棒的可访问感受，大伙能够查验每一条。

或是标签之下的，alt等于“your image ”的属性。当然了，仅仅做到这些，那是远远不足够的，大家能够点击此处，去访问了解页面，是否与508相兼容。

9. 开发出的页面中包含太多刷新操作

错误: 创建的站点在每项操作当中包含太多页面刷新步骤。

影响，与那种显得臃肿的页面相类似（可查看第四点），页面加载时间这个极为重要的性能指标也会由于此而受到影响，要是刷新次数过多，用户体验就会欠缺流畅性，并且每次内容更新都有可能致使页面出现短时间（或者长时间）的重置情况。

怎么去避免呢，解决这个问题的一种便利方式在于查看各项操作是不是真的有必要跟服务器端取得联系，以作示例，如果不需要依靠服务器端资源来开展处理，那么我们能够借助客户端自身的脚本给出即时性结果，当然啦，大家也能够运用AJAX技术或者更进一步，挑选单页面应用SPA方案，当下各类高人气库或者框架都给出诸多能简化这方面难题的办法，比如、以及。

10. 工作强度太大

毛病在于，搞开发的人员，有可能耗费过多时间去打造网络方面的内容，这般的时间，兴许被用在做重复性的劳作上，又或者仅仅是去录入数量庞大的文字内容。

存在这样的影响，在网站初始上线之际，或者是开展后续更新期间，开发人员所投入进去的时间常常是极其夸张的。并且当有别的开发者能够以更短的时间以及更少的精力达成同样的效果之时，我们所投入的时间成本是无法获得理想回报的。这种呈现为简单重复的体力劳动会致使错误产生，而对错误进行诊断所要耗费的时间往往比对开发项目耗费的还要更多处。

用啥法子避开自行寻觅解决之道，我们能够想一想去采用新型工具或者新的工作流程技术去完成开发里的每一个阶段，比如说，大伙当下正在用的代码编辑器跟Text相较，哪一个更具优势，不管大伙用的是哪一款代码编辑器，您有无深入探究过当中的功能设定sublime text 3 乱码，或许仅仅花些零碎时间仔细研读说明文档，我们便能找到能够在未来给自己节省下数小时乃至更长时间的新用法。

此外，千万别错过互联网上任何有可能帮得上忙的现成工具！比如说，在dev..ie网站上，搜索那些工具，那些能够简化测试工作的工具，测试涵盖多种平台及设备，还有那些能够简化故障排查工作的工具。

众人同样能够借助自动化流程削减时间要求以及出错概率，比如说，我们能够运用像Grunt这类工具去自动达成文件体积压缩等任务，此外，Bower能够助力众人更加高效地管理库和框架。

对于Web服务器自身是否存在着能够进行优化的空间，我们可不可以去选择微软Azure Web Apps，通过它能够迅速地创建出一个站点，这个站点几乎是对着任何开发场景都适用的，这样的情况对于扩展业务而言绝对算得上是理想的方案！

总结陈词

依靠列出上述常见错误所在，Web开发人员得以去除好多往昔曾坑害过众多前辈们的陷阱，除了察觉到这些陷阱的存有，我们还知晓了这类错误的影响以及解决方式，并且据此规划出一套开发流程，进而在契合自身习惯之际培育工作信心，同志们，加油！

如有侵权请联系删除！