前端聚焦周刊:第 418 期

原文转载自 「前端聚焦周刊」 (https://github.com/richshaw2015/frontendfocus-cn/blob/master/docs/issue-418.md)

预计阅读时间 0 分钟(共 0 个字, 0 张图片, 0 个链接)

这里是 Frontend Focus 的中文翻译项目,每周在 Oh My RSS 平台首发。

如有翻译错误或国外优质文章推荐,欢迎提交 issue。

原文:Frontend Focus issue 418

翻译及校对:richshaw2015Yully Che

🚀 刊首

传统报纸教给我们的网页设计法则

报纸教给我们很多网页设计的基本法则,例如阅读比重分布控制、相似内容的网格划分、突出核心内容等。

Frederick O’Brien 深入研究了从印刷媒体上学到的东西。

Smashing Magazine

解密 Blink 开发流程

新特性是如何一步步被添加到 Chrome(Chromium, Blink)中的?这篇是整个流程的概述,也有对话/视频版本。

Google

GSAP 'GreenSock' 3.0版本发布

号称瑞士军刀的流行 JavaScript 动画库刚刚发布了3.0版本。这是一个大版本升级,有超过50个新特性和变更,包括简化的 API、新的运动路径插件、ES6模块支持等。

您可以在这里查看完整的发行说明,或者观看推介视频

GreenSock

▶  基于 SVG 的 Web 交互动画

一次愉快的 SVG 动画探索之旅,本篇讲述了这个格式是如何打通设计和开发之路的。

Cassie Evans

Firefox 的未来复兴之路

“Ultimately, Firefox’s future is as much down to the decisions of a few regulators as it is about anything Mozilla can do”.

Alex Hern (The Guardian)

Chrome、Edge、Safari 在中国黑客大赛上被攻破

中国的顶级白帽黑客在成都对当下主流浏览器进行了0 day 测试。

Catalin Cimpanu

📙 文章、教程、观点

用 JavaScript 将图像裁剪成特定比例

本篇用三分钟的教程讲述了用 HTML canvas API 和一些基本的数学知识开发一个简单的裁剪函数,以裁剪出不同比例的图像。

Rik Schennink

▶  看完 Rémi Parmentier 的这些视频,你就能成为 HTML 邮件极客

对于开发兼容各种奇怪邮件客户端(和浏览器的差异巨大)的 HTML 邮件十分有用。

Rachel Andrew

▶  开发者应该了解的 HTTP 头部

探讨 HTTP 头部是如何直接影响到用户体验的,点此查看相关演示

Stefan Judis

你是如何删除冗余 CSS 的?

Chris Coyier 提出了对现有识别冗余 CSS 工具(宣称可以完美处理)的质疑,列举它们的问题并给出了替代的实践方案。

CSS Tricks

▶  :focus 我们都用错了

本篇讲述了 focus 的各种状态,以及其如何提升键盘用户浏览体验的。

提醒:请不要关闭:focus

Kevin Powell

开发 Steam 平台热门 HTML5 游戏所需的工具大全

他们的游戏卖了20多万份,所以很有参考价值。

Maschinen-Mensch

iPad 上的 Web 开发

概述了如何在 iPad 上进行全栈开发,包括 iOS 的自动化辅助手段。

Lachlan Campbell

CSS 中的吃豆人...

使用 clip path 属性开发的“快乐的吃豆人”游戏小教程。哇哇哇!

Maks Akymenko

JS 本地弹窗的几种不同类型比较

Elliot Goldman

🔧 代码、工具、资源

siriwave:一个模仿 Apple Siri 波形的 JS 库

这不是一个新项目,但是最近更新了所以被我们收录了。一个 JS 版的 Siri 波形外观库,这里有篇详细的博客讲述了其效果的实现细节,点此查看演示

Flavio Maria De Stefano

ScrollTrigger:页面的滚动触发器

一个基于当前滚动位置触发行为的库。例如当元素进入视口时实现淡入效果。

Erik Terwan

bootlint:Bootstrap 项目的 HTML 校验工具

尽管刚刚发布1.0版本,但是其相当流行和成熟,它用很普通的方式检查使用 Bootstrap 网页中的常见 HTML 错误。

Bootstrap

Flynt:面向开发者的基于组件的 WordPress 主题

它是开源的,有一个商业变种。

Bleech

💻 招聘

译者注:如需了解,请查看原文。

🗓 未来大事记

译者注:如需了解,请查看原文。

more_vert