个性化阅读
专注于IT技术分析

HTML5开发人员最常犯的5个错误:新手指南

点击下载

本文概述

自从Tim Berners-Lee和Robert Cailliau指定HTML以来已有20多年了, HTML成为用于构建Internet的标准标记语言。从那时起, HTML开发社区就一直在寻求对此语言的改进, 但是这种哭声通常是由试图减轻同事的HTML问题的Web浏览器开发人员听到的。不幸的是, 这导致了更多的问题, 导致了许多跨浏览器的兼容性问题以及重复的开发工作。在过去的20年中, HTML进行了4次升级, 而大多数浏览器的主要更新和大量小补丁都获得了两位数的数字。

HTML5应该可以最终解决我们的问题, 并成为统治所有问题的标准(浏览器)。自万维网创建以来, 这可能是最令人期待的技术之一。发生了吗我们最终是否获得了一种完全跨浏览器兼容并且可以在所有台式机和移动平台上运行的标记语言, 从而为我们提供了我们所要求的所有功能?我不知道!就在几天前(2014年9月16日), 我们还收到了W3C的另一个审查电话, 因此HTML5规范仍然不完整。

希望在规范最终定稿后, 浏览器将不再具有明显的过时代码, 并且它们将轻松, 适当地实现出色的功能, 例如Web Workers, 多个同步的音频和视频元素以及我们所需的其他HTML5组件。很久。

给草草的开发人员一个不完整的规范, 你将有一个灾难的秘诀。

鸣叫

但是, 我们确实有成千上万家基于HTML5开展业务的公司, 并且做得很好。数以百万计的人还使用许多基于HTML5的出色应用程序和游戏, 因此成功的可能性很明显, 并且HTML5将会而且将继续使用, 无论其规范的状态如何。

但是, 我提到的食谱很容易在我们的脸上浮现, 因此, 我强调了一些可以避免的最基本的HTML5错误。下面列出的大多数错误是某些HTML5元素在不同浏览器中实现不完整或缺少实现的结果, 我们应该希望它们在不久的将来会过时。在发生这种情况之前, 无论你是HTML5初学者还是经验丰富的兽医, 我都建议阅读列表, 并在构建下一个HTML5应用程序时牢记这一点。

常见错误#1:信任本地存储

让他们吃蛋糕!这种方法多年来一直是开发人员的负担。由于对安全漏洞和计算机保护的合理合理的恐惧, 在许多人担心Internet的”黑暗时代”, Web应用程序被允许在计算机上不合理地保留少量数据。的确, 诸如”来自Microsoft(r)的优秀浏览器大师”提供给用户的数据之类的东西, 或诸如Flash中的”本地共享对象”之类的东西, 都远非完美。

因此, 合理的是, 开发人员采用的首批基本HTML5功能之一是Web Storage。但是, 请注意Web存储不安全。它比使用cookie更好, 因为它不会通过网络传输, 但未加密。你绝对不应在其中存储安全性令牌。你的安全策略永远不应依赖Web存储中存储的数据, 因为恶意用户可以随时轻松地修改其localStorage和sessionStorage值。

为了获得有关Web存储及其使用方法的更多信息, 建议阅读这篇文章。

常见错误2:期望浏览器之间具有兼容性

HTML5不仅仅是一种简单的标记语言。它已经足够成熟, 可以将行为与布局结合在一起, 并且你应该将HTML5视为扩展的HTML, 并在其顶部添加高级JavaScript。如果你看过我们以前遇到的所有麻烦, 只是使HTML + CSS的静态组合在所有浏览器上看起来都一样, 那么可以肯定的是, 更多的复杂性将意味着需要更多的精力来确保跨浏览器的兼容性。

就像JavaScript一样, 不同浏览器上的HTML5解释也不尽相同。浏览器大战中的所有主要参与者都在HTML5规范中发挥了作用, 因此可以公平地假设浏览器之间的差异会随着时间而减少。但是即使是现在, 某些浏览器仍决定完全忽略某些HTML5元素, 这使得遵循基线和常用功能非常困难。如果我们在公式中添加更多的互联网连接设备和平台, 情况将变得更加复杂, 从而导致HTML5问题。

例如, Web动画是仅Chrome和Opera支持的出色功能, 而Internet Explorer完全忽略了Web通知功能, 该功能可在网页上下文之外提醒用户发生事件(例如电子邮件的发送)。

要了解有关HTML5功能和不同浏览器支持的更多信息, 请访问www.caniuse.com上的HTML5指南。

因此, 事实仍然是, 即使HTML5是新的并且有明确的规定, 我们也应该期待很多跨浏览器的兼容性问题, 并提前进行计划。浏览器需要填补太多的空白, 可以公平地期望它们不能很好地克服平台之间的所有差异。

常见错误3:假设高性能

不管HTML5仍在不断发展, 它都是一项非常强大的技术, 它比存在之前使用的替代平台具有许多优势。但是, 强大的力量伴随着巨大的责任, 尤其是对于HTML5初学者而言。 HTML5已被台式机和移动平台上的所有主要浏览器所采用。考虑到这一点, 许多开发团队选择HTML5作为他们的首选平台, 希望他们的应用程序能够在所有浏览器上均能运行。但是, 仅仅因为HTML5规范这样说而在台式机和移动平台上都具有合理的性能是不明智的。许多公司(khm!Facebook khm!)将赌注押在移动平台的HTML5上, 但HTML5未能按计划工作。

但是, 还是有一些伟大的公司严重依赖HTML5。只要看看众多在将HTML5和浏览器推向极限的同时做得非常出色的在线游戏开发工作室即可。显然, 只要你知道性能问题并解决这些问题, 你就可以在制作出色应用程序的好地方。

常见错误4:可访问性有限

网络已经成为我们生活中非常重要的一部分。使依赖辅助技术的人员可以访问应用程序是软件开发中经常忽略的重要主题。 HTML5尝试通过实现一些高级辅助功能来克服这一问题。多家开发人员认为这已经足够, 并且并没有真正花费任何时间在其应用程序中实现其他可访问性选项。不幸的是, 在现阶段, HTML5遇到了一些问题, 使它无法向所有人提供你的应用程序, 如果你希望包括更多的用户, 则应该花费更多的时间。

你可以在此位置查看有关HTML5中可访问性的更多信息以及最常见的可访问性功能的当前状态。

常见错误#5:不使用HTML5增强功能

HTML5大大扩展了标准HTML / XHTML标签集。除了新标签, 我们还获得了许多新规则和行为。太多的开发人员仅选择了一些增强功能, 而跳过了HTML5的一些非常酷的新功能。

HTML5中最酷的功能之一就是客户端验证。此功能可能是Web浏览器采用的HTML5最早的元素之一。但是, 不幸的是, 你可以找到许多默认情况下向其表单添加novalidate属性的开发人员。这样做的原因是合理的, 我很确定我们将对此进行辩论。由于向后兼容, 许多应用程序都实现了自定义JavaScript验证器, 而且浏览器还提供了即开即用的验证功能。但是, 要确保两种验证方法不会发生冲突并不是很困难, 标准化用户验证将确保共同的经验, 同时有助于解决我之前提到的可访问性问题。

另一个重要功能与HTML5中处理用户输入的方式有关。在HTML5出现之前, 我们必须将所有表单字段保留在<form> </ form>标记内。新的表单属性使其完全可以执行以下操作:

<form action="demo_form.asp" id="form1">
  First name: <input type="text" name="fname"><br>
  <input type="submit" value="Submit">
</form>

Last name: <input type="text" name="lname" form="form1">

即使lname不在表单中, 它也会与fname一起发布。

有关新表单属性和增强功能的更多信息, 可以检查Mozilla开发人员网络。

本文总结

我知道, Web开发人员在浏览器大战中是附带损害, 因为上述许多错误是在不同浏览器中有问题的HTML5实现的直接结果。但是, 至关重要的是我们避免常见的HTML5问题, 并花一些时间来了解HTML5的新功能。一旦我们控制了一切, 我们的应用程序将利用强大的新增强功能并将网络提升到新的水平。

Web开发人员是浏览器大战中的附带损害。

鸣叫

赞(0)
未经允许不得转载:srcmini » HTML5开发人员最常犯的5个错误:新手指南

评论 抢沙发

评论前必须登录!