招聘时测试 HTML/CSS/Javascript 技能[关闭]

Posted 2023-02-22

【中文标题】招聘时测试 HTML/CSS/Javascript 技能[关闭]

【英文标题】：Testing HTML/CSS/Javascript skills when hiring [closed]

【发布时间】：2010-09-16 22:25:27

【问题描述】：

在招聘前端开发人员时，您应该测试哪些特定技能和实践？评估他们在 html、CSS 和 javascript 方面的技能的好指标是什么？

显然，无表语义 HTML 和纯 CSS 布局可能是关键技能。但是具体的技术呢？他/她应该能够毫不费力地模拟多列布局吗？ CSS精灵？等高（或人造）列？ HTML 标签的选择是否重要（即过于依赖<div>）？他们应该能够（用文字）解释花车是如何工作的吗？

那么 JavaScript 技能呢？框架经验（jQuery、Prototype 等）有多重要。今天？

显然，职位的详细信息和他们将从事的工作的网站最能说明需要哪些技能。但我想知道在为候选人创建测试时，人们可能会认为哪些特定技能会破坏交易（或制造商）。

【参考方案1】：

我可以建议你在线测试，包括 HTML、CSS 和 JavaScript。

http://tests4geeks.com/test/html-css-javascript

它有 60 个问题（每个主题 20 个）。考生完成考试后，您将通过电子邮件收到报告。

【参考方案2】：

我没有任何招聘经验，但我参加了许多 Web 开发人员的面试，并且可以讲述我的经历。

在我所有的采访中，一种方法确实是发现真正人才的最佳方式。我承认我不是专家，这可能就是我没有得到这份工作的原因，但这是淘汰那些有能力和优秀的人的绝妙方法。

我们被问了几个关于 DOM、面向对象、闭包、XML 命名空间和一般 Web 设计的问题，然后我们被带到一个安静的办公室，可以看到附近河流的美景，并被要求写几个例子来展示我们的能力。我们被单独留下，但被告知如果我们需要使用浏览器，将在之后查看源代码和我们的浏览器历史记录。我们被要求使用以下内容制作公司内部网：

简单的三列布局 使用 CSS 的漂亮表格 一个实用但好看的导航栏。 使用 XML 和 JavaScript 进行动态加载

只要花一点时间来做这件事，你就会看到真正能做这件事的人。虽然他们的示例可能总是更好或更适合不同的应用程序，但这只是表明，展示开发人员技能的最佳方式是让他们做出一些事情！如果你知道你的东西他们知道他们的东西他们的代码会很好。

【参考方案3】：

在我的公司，我们不进行测试，而作品集更为重要，尤其是因为我们倾向于关注候选人的个人动机和对前端开发的热情。

但是，如果我应该在招聘之前给候选人一个测试，我会这样做：

交出一张经过 Photoshop 处理的网页的打印件，该网页代表了一个清晰的语义组件树。询问该人他或她将如何得出 html 的结果。只是请他或她大声思考。看到一个页面时会想到什么，知道它需要开发。

然后取决于候选人采取的方法。

为每个特定的 html 部分选择最佳可用标记是一个（重要的）方面，但可以由周围有经验的人掌握以指导新员工。能够正确地将设计分解为其语义组件，识别部分并将主要和次要内容与导航分开不是数学或科学，因此难以测试。但是关于分解页面方法的讨论可能会将有经验的人和初学者分开。

但正如我在第一行中所说，我们通常会询问一个人在空闲时间做了哪些与网络相关的工作，例如博客、游戏或演示。如果做了任何事情，这个人通常非常擅长前端开发或渴望学习和适应。

【讨论】：

您能详细说明什么是“语义组件树”吗？或者指向任何解释它的资源？谢谢:)

【参考方案4】：

过去，我们要么为他们设置一个小型简报，让他们在特定的时间范围内工作，要么在某些情况下与他们签订一份工作，看看他们的进展如何。

我从不担心让某人坐在面试室的笔记本电脑前想出一个解决方案，因为那种环境（你希望）与正常的工作条件不太一样。

简介的确切性质在很大程度上取决于您正在寻找的技能组合。在某些商店中，前端开发人员在实施设计“氛围”时将不得不承担一定程度的设计空白，和/或履行“品牌警察”职责。 在这些情况下，在简报中留下一些关于排版的一些细节和其他小细节的漏洞可以给你一些关于他们在这些方面的能力的提示。 让他们选择 javascript 框架，他们是选择最适合这项工作的框架，还是他们知道的框架。 （主观问题，是的。但是为了日期选择器和一些菜单动画而拉入道场可能是矫枉过正）

我会寻找可以实现基于 css 的布局的人，但在处理遗留项目时，如果需要，实际上可以在基于表格的布局上工作。尽管受到了诽谤，但 hacky 表格布局的一些更精细的细节并不总是那么容易。

这类任务的主要内容是对细节的关注，他们是否为打印添加了一套样式规则、使用了适当的图像大小和格式、生成了干净有效的代码，他们是否因为他们真的想要而去追求黄金？这份工作，并准备稍微伸展一下自己来得到它。

因为你给了他们一些额外的时间，所以期望他们努力给人留下深刻印象是公平的，而不是把他们放在一张陌生的办公桌前并告诉他们去争取的那种充满压力的情景。因此，虽然要现实一点，不要期望每天在每项任务上都能完美地工作，但在这种情况下，我正在寻找黄金，或者至少是黄金是目标的证据。

扔一个他们以前没有做过的曲线球......看看他们能很快把它捡起来。经验固然好，但在瞬息万变的领域，快速学习的能力可能更为重要。

【参考方案5】：

我问人们他们使用什么工具，他们如何编码，即他们是否使用 DreamWeaver、BBEdit、emacs 或其他什么。假设他们不只是给出一个单词的答案，您通常会了解他们的优先事项是什么，他们如何编码等等。

然后我问他们如何验证他们的代码，这总是很有趣。

除了让他们坐下来敲定一个页面来实际测试它们之外，我还会询问他们所做工作的具体示例，以及他们如何解决问题。

例如，你说“告诉我们你在严格期限内的工作” 或者你说 “告诉我们一个非常令人沮丧的问题以及你是如何克服它的” 或 “在你最近所做的工作中，你最自豪的事情是什么？”

通过这种方式，您可以深入了解他们所做的事情、他们解决问题的能力和经验、他们处理压力和挫折的方式，当然还有他们的解决方法/走捷径的措施是否合适聪明或愚蠢。

【参考方案6】：

感谢您到目前为止的所有回答。他们绝对是很好的建议。不过，我还没有准备好将一个标记为已接受。我真正寻找的是前端开发人员需要能够在测试环境中生成的具体任务。换句话说，CSS 的 FizzBu​​zz 是什么？

我确实同意，扎实的作品集和聪明地谈论该主题的能力可能会最大限度地降低考试的重要性。另一方面，我认为我们都知道非常善于说大话的候选人，但是当谈到实际展示实际知识时，他们就达不到要求了。

@JonathanHolland - 我倾向于不同意。 HTML/CSS 确实很容易学习，但是从一些快速教程中获得的知识与花费数年时间做布局的人相比是微不足道的。优秀的 CSS 开发人员可以提供许多技术和实践。

@roenving - 也许我是多余的。通过“纯 CSS”，我的意思是无表。我还指不使用表格作为布局方法的意义上的无表格。但是，这不是 div-vs-table 布局讨论的问题。试试here。虽然我相信现在大多数雇主都会问开发人员是否可以在不使用表格的情况下进行布局（作为一种方法）。

【讨论】：

啊我也猜到了，但我的回答是，这些话被说和打印的太频繁了，以至于很多新开发人员认为表格和css是两个不能结合的东西...这是一个问题（想想看，有一些 css 属性只适用于表格！-）

【参考方案7】：

了解浏览器的不同之处也很关键。尤其是 IE。如果他们只为 IE 编码过，请当心！ Vica Versa 也是如此，如果他们从未在 IE6/7 中测试过他们的东西，他们根本不知道它的失败有多可怕。

如果他们能说出 3 个失败的东西，或者在 IE 中需要解决方法，那么他们很可能会成功。如果他们不能，他们还没有足够的跨浏览器体验。

【参考方案8】：

"

显然，无表语义 HTML 和纯 CSS 布局可能是关键技能。

"

这句话我没看懂……

你真的是说为了避免使用表格而以复杂的方式使用表格来完成一项简单的任务会更好吗？-)

Table-o-phobia 就像在没有服务器端帮助的情况下制作大型网站一样难受...

当然，过去十年的桌子地狱并不有趣，但是如果不使用桌子来完成很多任务真的很愚蠢......

使用easyist完成任务的html元素，不管它使用哪个标记名！-)

——我不明白什么是“纯 CSS 布局”；我从来没有想过如何创建一个没有 html 元素的 html 页面来托管样式表中的布局......

【讨论】：

使用表格进行布局在语义上是错误的，因为标签传达了表格数据的概念。正确的解决方案是使用不传达语义的 div，并将其显示属性设置为模仿表格。不幸的是 IE 不支持 display: table-cell.... 所以有时你会卡住。

避免表格然后强制其他元素像表格单元格一样工作的想法是什么？-) 这在语义上确实是错误的......如上所述：使用完成任务的html元素，并且说表格只能用于表格数据是不知道网络历史的！-)

我不确定你是否真的会以这种观点找到一份工作。只是说。

【参考方案9】：

我知道这不是一个很好的答案，但我要做的第一件事就是公开他们的 Word 简历的格式。如果他们利用了 Word 提供的缩进和样式，而不是制表符、制表符、制表符、空格、空格、空格、空格，那么他们就会排在首位。

【讨论】：

我喜欢使用 css 来格式化东西，但是真的吗？这与前端技能完全无关。

我其实很喜欢这个答案。这与态度有关。这就像使用!important 而不是弄清楚为什么某事没有做它应该做的事情。它可以工作，并且在开发过程中没问题。但是你应该清理一下，并展示一些按照某些标准构建的东西，以便于更新/更改。

【参考方案10】：

当我面试客户端开发人员职位的人时，我试图弄清楚：

1) 了解 DOM（那是什么，它与 HTML 有什么关系等） 2) 理解 XML/命名空间 3) 理解 JavaScript（面向对象？否则如何） 4) 了解组件化方法（XBL、HTC） - 加 5）理解OO原理 6) JavaScript 闭包 7) 浏览器内存泄漏

我马上给出的唯一一个简单的测试用例：

【讨论】：

错字，第 3 行：“Undesrtanding”（希望我有编辑代表...）

您希望从这个简单的测试中得到什么答案？ a 是在全局范围内声明的变量，其值设置为数值 1？

【参考方案11】：

Sergey 和 swilliams 都给出了很好的答案，特别是 swilliams 提到要求投资组合是关键。借助投资组合，您还可以测试以下项目：

html 和 css 是否有效？ 演示文稿在不同浏览器中的呈现是否一致？ 候选人是否有 JavaScript 错误？如果他们这样做了，这个人是让他们冒泡到表示层还是他们至少用一个 try/catch 块来捕获它们？ 在JS方面，人有多高级？他们可以进行表单验证吗？他们可以做正则表达式吗？他们是否依赖 MM_Preloader？ （糟糕！）

作品集还可以让人了解某人对 Web 开发的热情程度。此外，如果他们为其他人创建了网站，仅此一项就提供了与候选人讨论许多事情的机会，

他们是如何开发 UI 的？ 网站做了什么样的规划？ 如何发现/满足用户期望？ 在施工过程中遇到了哪些挑战？

除了这些项目之外，您可能需要考虑的另一种方法是开发人员测试，您可以将其发送给潜在雇员。没有什么比一天更难的了，但足够的脑筋急转弯来看看他们是否可以解决 CSS 或 JS 问题。

【参考方案12】：

索要作品集，然后与您的团队一起审核。这可以照顾到装腔作势的人和“不能很好地处理采访”的人。

除此之外，我会向他们展示一些相对简单的模型和一台笔记本电脑，然后说“试试看”。

也许可以问问他们现在最喜欢网页设计的什么，最讨厌什么。询问他们对即将发生的事情（HTML 5、IE 8、Chrome 等）的看法，看看他们是否跟上即将发生的事情。

询问他们是否有最喜欢的 JavaScript 框架以及为什么。也许让他们在 JS 中编写一些代码，比如 [in] 著名的嘶嘶声问题。

【讨论】：

要求一个简单的模型并不能真正掌握最重要的 CSS 技能，即处理复杂案例和多种环境。另外，有些人确实面试不好（我是其中之一，但我的工作弥补了这一点）。

这就是投资组合的用途......

【参考方案13】：

我不会太重视它，因为正确的 HTML/CSS 非常简单，任何人都可以在一周内学会它。

也就是说，您可能需要查看他们的作品集，以帮助您对他们当前的技能水平做出决定。

【讨论】：

如果您不关心标记的质量或使复杂设计在广泛的平台上工作的能力，那么 HTML/CSS 很简单。我不想雇用这样的人。

这很简单，但是有很多开发者仍然不擅长。

如果你不能在一周内学会“好”的 HTML/CSS 设计实践，我也不会雇用你。

标准可以在大约一周内学会，但要了解供应商如何误解这些标准需要一生的时间。

这很简单，但也很容易被误用——如果你希望它在语义上有效，那么一周后第一次使用 CSS 和 HTML 的人将不会产生胜任的工作正确、可维护、跨浏览器工作等。