挑战
今天,HTML超过20岁。在这20年中,HTML升级了4次,将我们带有当前的HTML版本5.升级路径不是一个简单的路径: W3C是HTML规范的官方维护者,对规范带来新功能缓慢,因此Web浏览器银河游戏官方首页人员将事物带到他们的手中。这只会导致更多的问题,特别是对于正在努力创建网页的银河游戏官方首页人员来说。它引起了许多跨浏览器兼容性问题并浪费了银河游戏官方首页时间。在今天的技术景观中,HTML5银河游戏官方首页已成为任何一个组成部分 前端 发展。虽然它不是编程语言,但它仍然是Web应用程序和Web设计的重要组成部分,甚至是现代桌面和移动应用程序。今天的技术,积极使用20年的是一个很长一段时间。因此,恢复参考至少某种程度的HTML5经验基本上在软件和Web银河游戏官方首页社区中成为普遍。这使得HTML5专家的定位相当容易,但是能够确定一个更加挑战的完美。

旧习难改。立即开始使用新的HTML5语义标记。
我们的招聘指南将帮助您找到努力遵循高质量方法来提高用户体验并强烈了解HTML5规范的HTML5程序员。没有魔法或万无一失的技术,但肯定有可能造成的,这将有助于确定候选人对语言知识的深度和复杂程度。以下提供了以下这些问题的简要采样。
问题与解答
问:HTML5旨在替换HTML 4和XHTML。讨论HTML5规范的新HTML5功能和关键目标。
新的新目标 HTML5规范 是为了提供丰富的内容(如图形和视频)到客户,无需其他插件(即闪存和Silverlight),通过引入新的结构元素标签来提供更好的网页结构的语义支持,以提供更严格的解析标准简化错误处理,并简化与写入旧标准的文档的向后兼容性。最终,现代世界中最重要的目标是提供更好的跨平台支持,并确保这一切都适用于桌面计算机,笔记本电脑,平板电脑甚至智能手机。
To achieve all that, many new features were introduced with HTML5. New HTML5 improved support for embedding graphics, audio, and video content via the new <canvas>
, <audio>
, and <video>
tags. Web workers were introduced, new extensions to the JavaScript API such as geolocation were added, new drag-and-drop features, as well as local storage and caching features. Many new semantic tags and new form controls were introduced to complement the structural logic of modern web applications.
问:解释语义html是什么,名称新的语义html5元素。
Semantic HTML is an HTML where the markup, or tags, show the meaning instead of pure presentation or look. For example, HTML5 recommends use of <strong>
tags instead of <b>
for bold text, and <em>
instead of <i>
for italic text. These semantic tags will generate the same bold and italic text, but instead of pure formatting information, they provide a meaning too.
HTML5规范定义了全新的语义元素,如:
<article>
<aside>
<details>
<figcaption>
<figure>
<footer>
<header>
<main>
<mark>
<nav>
<section>
<summary>
<time>
新的HTML5表单控件包括:
<calendar>
<date>
<time>
<email>
<url>
<search>
问:与HTML5讨论潜在的银河游戏官方首页人员的陷阱。
Old habits die hard. Many developers write modern web applications in HTML5 by using old specifications. The most prominent examples are when developers use <table>
tag to setup a layout, or <span>
or <div>
when new semantic tags like <header>
, <footer>
, <article>
or <aside>
tags would be more appropriate. Or as discussed before, they don’t use new semantic tags <strong>
or <em>
instead of <b>
and <i>
tags. The result of this old approach is over-complicated markup that is behaving inconsistently across different browsers. When writing new HTML5 documents, developers should adopt new semantic tags, enjoy all the benefits that come with HTML5 specification, and let the old habits live in the past.
Q: Discuss how new HTML5 elements could be used in different combinations, namely <header>
and <footer>
, and <section>
and <article>
.
新的HTML5元素开辟了一个全新的可能性组合和其使用方式的有趣方式。
For example, despite classic knowledge that there can only be one header and only one footer, new HTML5 document can contain multiple <header>
and <footer>
elements. Both the new semantic tags are designed to serve their respective purposes in relation to their parent element. This means that not only the page <body>
can contain a header and a footer, but so can every <article>
and <section>
element.
Another example is usage of new <section>
and <article>
elements, and their combination: <section>
can contain <article>
elements, and an <article>
can contain <section>
elements. To describe this with an example: in your web page you could have a dashboard page with a <section>
for social network interactions, and a <section>
for the latest news articles which would contain several <article>
elements. Conversely, an <article>
might contain a <section>
at the end for reader comments.
问:讨论HTML5简化的HTML结构。提供例子。
首先,HTML5规范简化了Doctype声明。 doctype或文档类型声明,告诉浏览器他们可以期望的文档类型。旧的XHTML Doctype声明如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
虽然HTML4过渡Doctype看起来像这样:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
HTML5的新DocType声明非常简单:
<!DOCTYPE html>
HTML5引入的另一种简化是我们如何声明文档的字符编码或字符集。 HTML5中的Charset声明如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
...
</head>
<body>
...
</body>
</html>
这比以前在HTML4中更简单,它没有Charset Meta属性:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
...
</head>
<body>
...
</body>
</html>
HTML5规范 went so far in the simplification, that the tags <html>
, <body>
and <head>
are not mandatory for an HTML5 document to be valid. Following simple example will pass W3C标记验证服务:
<!DOCTYPE html>
<title>My title</title>
<header>My header</header>
<p>Wall of text</p>
在此示例中唯一一个重要的标记是HTML5的新Doctype,如果没有它,浏览器将无法检测到它是HTML5文档。
问:解释为什么如果所有现代浏览器遵循相同的HTML5规范,跨浏览器支持仍然很重要。
HTML5规范是一组定义有效文档的规则,还提供有关浏览器如何解释和渲染此类文档的指令。不幸的是,现实是,没有浏览器仍然支持HTML5规范定义的所有规则。大多数主要浏览器都支持大多数规范,但HTML5规范的浏览器解释仍存在差异。因此,银河游戏官方首页人员必须确认他们希望显示其内容的所有浏览器的所有浏览器都支持它们是否使用的方面。这就是为什么跨浏览器支持仍然是银河游戏官方首页人员的头痛,尽管规格改进了。
问:讨论HTML5的可访问性方面,尤其是在现实世界中使用时的局限性和问题。
今天,网页和应用程序越来越多地使用,并使其能够对依赖辅助技术的人们来越来越重要。 HTML已经走了很长的路,HTML5推出了新的用户界面特征,使人们能够更轻松地使用辅助技术来使用Web。虽然有问题。其中一个问题是银河游戏官方首页人员和设计师以前没有过分关注其网页或应用程序的这个方面。如上所述,在他们的防守中,其主要原因是Web先前的HTML5没有任何辅助界面功能。现在,即使银河游戏官方首页人员想要在其应用程序中实现额外的辅助功能选项,也存在常量问题,任何新的Web技术都面临:浏览器支持。 HTML5可访问性 正在跟踪浏览器中最常见的可访问性功能。要实现可访问性功能并涵盖所有浏览器,银河游戏官方首页人员需要额外的时间投资。这可以是客户需要预测客户的关键因素,如果他们希望他们的Web应用程序和页面在今天的技术中可以在可能的情况下。
Q: Explain HTML5 Web Storage, discuss its security considerations, and the difference between localStorage
and sessionStorage
.
HTML5支持的网页以使用Web存储在用户浏览器中本地存储数据。在早期版本中,银河游戏官方首页人员只能使用cookie。新的Web存储更安全,更快。与cookie不同,每个服务器请求都不包含Web存储的数据,只有在要求时才使用它。数据存储为名称和值对。对cookie的其他优点是存储限制。 Web存储可以高达5MB,其内容永远不会传输到服务器。网页只能访问自己存储的数据,因为它是受限于每个原点。
It is important to note that while Web Storage is more secure than cookies, there are things to keep in mind. It is better than using cookies because the content is not transmitted over the wire, but local storage is not encrypted. For that reason, sensitive data like security tokens should never be stored there. Web application should never rely on data stored in Web Storage, as a malicious user can easily modify data in the localStorage
and sessionStorage
values at any time.
Speaking of sessionStorage
, the difference between localStorage
and sessionStorage
involves the lifetime and scope of the storage. Data stored through localStorage
is permanent: it does not expire and remains stored on the user’s computer until a web application deletes it, or the user asks the browser to delete it. On the other hand, sessionStorage
has the same lifetime as the browser tab in which the script that stored it is running. When the tab is closed, any data stored through sessionStorage
is deleted.
Unlike the origin limit of the localStorage
, sessionStorage
is window scoped. For example, if a user has two browser tabs displaying documents from the same origin, those two tabs have separate sessionStorage
data. The scripts running in one tab cannot read or overwrite the data written by scripts in the other tab, even if both tabs are visiting exactly the same page and are running exactly the same scripts.
问:解释Web工作者是什么。
javascript. 是一种单线程语言,所以多个脚本无法同时运行。 Web Worker是一个用于在其自己的线程中独立于其他脚本运行浏览器背景中的脚本的新API。结果是,网页不需要等待Web工作者完成,这提高了性能和响应性,因为用户可以在Web工作者仍在后台运行页面。例如,Web工人是完美的,适用于执行重大计算的长期脚本。
包起来
我们刚刚划伤了所需的知识表面,是全日制或兼职的专用HTML5银河游戏官方首页人员。找到HTML5的真正主人是一项挑战。我们希望您发现本帖子中提出的问题是您在HTML5银河游戏官方首页人员中少数人探索的有用基础。寻找这样的候选人非常值得努力,因为它们无疑将对您的团队的生产力和结果产生显着的积极影响。