前端资讯周报 2.27 - 3.5: 如何设计一个优秀的HTML接口，深入理解line-height

从本周起，每周一我都会分享上一周我订阅的技术站点中，和解决问题的过程中阅读到的值得分享的文章，或者视频教程，又或者图书。

个人认为国外的技术文章质量较高，而且发布的技术资讯也走在行业前沿，所以比较关注他们的内容，所以分享的文章大多是英文书写，但别害怕，其实英文的技术文章难度不超过英语四级。注意不排除某些文章需要魔法上网才能阅读哦。

毕竟个人的阅读量有限，也欢迎大家留言或者私信给我你们阅读到的，对你们前端技术有帮助的任何内容，题材不限，语言不限。可以是技术博客，也可以是知乎或stackoverflow的问答。

如果你觉得这篇分享给你带来了帮助，请不要吝惜的关注我和点个赞吧，谢谢啦！

“知识的诅咒”是一种认知偏差，大意为专家们常以技术术语交谈，却逐渐丧失与非专业人士沟通的能力。

程序员常常把自己编写的功能所需要的接口和配置设计的极为复杂，却不曾想过并不是每一位开发人员都有与你相同的水平来懂得如何调用接口。这篇文章就是教你如何打破这个思维，设计出一个好的HTML接口。

2. Deep dive CSS:font metrics, line-height and vertical-align

从学习css的第一天起我们就认识了字体、行高等样式属性，但却没有多少人能具体解释它们的工作原理。这篇文章则是由浅入深的具体讲解了系统字体、页面中的字体、字体样式以及行高之间的关系，以及它们是如何运作的。如果你之前对这些知识很苦恼，相信你读完这篇文章之后会更苦恼。

3. JavaScriptStart-up Performance

性能永远是我最感兴趣的话题，这里分享了关于Javascript 在编译时的一些性能瓶颈，并给出了关于提高Javascript编译性能的一些建议，最后以及Chrome浏览器在这方面所做的优化

4. How to Build Your Own Progressive Image Loader

相信你已经看到了知乎上模糊懒加载图片的效果了吧，这里正好有一篇文章教你如何做这样的一个加载器。

Facebook和medium也有这样的文章教你如何实现这个：

How Medium does progressive image loading

The technology behind preview photos

唱唱反调

5. You might not need a CSS framework

标题即表达了本文的中心思想：你其实不应该使用CSS框架！这篇文章总结了使用CSS框架可能会带来的问题。在安利你不要使用CSS框架的同时，还给出了其他的一些解决方案。

6. The benefits of learning how to code layouts with CSS

这篇文章作者的观点和上一篇一致，他也认为我们不应该在使用CSS框架，而是重新学习CSS布局，目前现有的样式属性例如Flexbox、Grid，足够让我们编写出富有创意的前端布局。

如果你想从头开始学习如何编写CSS布局，也可以从这个作者的另一篇文章开始：

Learn CSS Grid | Jen Simmons

基础

7. HTML5 Form Attributes (Part 1) - SitePoint

8. Learning HTML5 Form Attributes (Part 2) - SitePoint

手把手教你认识HTML5表单的各个属性

9. An Animated Intro to RxJS | CSS-Tricks

对RxJS的入门介绍，初步介绍了RxJS涉及到的一些概念还有事件和动画方面的使用方法

其他

10. Touch Devices Should Not Be Judged By Their Size | CSS-Tricks

这是老生常谈了：我们不能仅仅通过设备的屏幕尺寸来判断设备类型，而是应该抛弃具体的设备类型，针对设备对某特性的支持情况进行编程。在这篇文章中作者就以hover属性进行举例。

11. When Your Code Has To Work: Complying With Legal Mandates

在欧洲建站的时候是需要遵守Cookie Law的，也就是你需要告诉用户你要是用他电脑上的数据，例如Cookie和LocalStorage，并且要征得用户的同意才能使用它们。作者在这篇文章里分享了他解决这个问题的技术方案。

12. JavaScript Debugging Improvements

介绍 webkit 在内核在Javascript调试方面做的一些改进

13. Base64 Encoding & Performance, Part 1: What’s Up with Base64?

使用Base64代替图片或许并不是一个好的选择，下载慢，难以优化。

14. Working with the JavaScript Battery API

你能够通过API来获取移动设备的电量啦，

目前兼容性情况：

Can I use... Support tables for HTML5, CSS3, etc

讲讲道理

15. Feel like a loser?

在设计产品时，要照顾用户的情绪。千万不要给他们带来负面的感受，要让他们感觉自己是赢家！

16. How to Become a Better Developer by Coding Less

如果通过写更少的代码来成为更优秀的程序员呢？这篇文章打动的我的是这句话：

Here’s the interesting thing about people performing at the highest levels. They don’t rely on what they think they can do, how they feel or what others say about them.They think about the outcome they want, then working backwards, they create a system that helps them get there.

冷知识

17. Mastering Google Search Operators in 67 Easy Steps

如何正确的使用 Google的67个步骤

本文也同时发布在我的知乎专栏上：前端技术漫游指南，欢迎大家关注。