来自网络各处我们正在阅读并有一些想法的内容。有我们应该知道的链接吗?告诉我们!
Connect:前端体验背后的故事
阅读评论
Benjamin De Cock 分享了一些关于 Stripe 设计工作的精彩幕后故事。一切都非常巧妙,并且使用了非常现代的技术。
- 使用CSS 网格来创建他们标志性的背景条纹
- 使用3D 立方体来增加美学效果
- 使用减少运动媒体查询来适应用户的偏好
- 使用Web 动画 API在 JavaScript 中进行事件触发的类似关键帧的动画
另外一个我以前从未见过的
Connect 的登录页面使用了新的 Intersection Observer API,它提供了一种更强大、性能更高的方式来检测元素的可见性……
observeScroll
助手简化了我们的检测行为(即,当元素完全可见时,回调会触发一次),而无需在主线程上执行任何操作。
minmax() 函数的工作原理
阅读评论
Ire Aderinokun 撰写的另一篇精彩文章,这次讨论的是有趣的 minmax()
CSS 函数以及它如何与我们最近一直在尝试的 CSS Grid 功能一起工作。
这里特别棒的是 Ire 解释了我们如何完全避免使用媒体查询的示例。只需几行 CSS,我们现在就可以构建相当复杂的布局。
使用 cPanel 和 WordPress 的免费指南
阅读评论
如果您需要针对 WordPress 优化的托管解决方案,那么托管 WordPress 托管是一个不错的选择。但它仅适用于 WordPress。
如果您需要更多功能怎么办?
如果您需要电子邮件托管怎么办?如果您需要在 WordPress 旁边运行其他软件怎么办?如果您需要比托管 WordPress 托管允许的更多控制权,但又不想面对 VPS 的复杂性怎么办?
有一个简单的解决方案:在一个地方托管所有内容,并使用功能强大的 cPanel 仪表板管理所有内容。
您将在本 cPanel 和 WordPress 免费指南中了解如何操作。
使用水獭介绍 Web Components
阅读评论
Monica Dinculescu 谈论 Web Components 以及我们为什么可能关心它
…在 Web Components 出现之前,您必须等待所有浏览器都同意一个新元素(例如,日期选择器)。即使他们在新元素上达成一致,也需要花费数年时间来实现它……使用 Web Components,Web 开发人员可以编写此类元素,因此您不必等待 10 年才能让所有浏览器都同意他们应该实现日期选择器。
我一直在努力弄清楚 Web Components(使用 Polymer 或不使用 Polymer)是否真的是“未来”。人们肯定没有像对待新 JavaScript 一样,以同样的狂热食欲来采用它们,而新 JavaScript 也解决了组件化问题。但它们是 Web 标准,并且原生支持正在不断增长,所以……大概吧?
不过,我可能错误地将两者混淆了。即使 React 文档也说
React 和 Web Components 旨在解决不同的问题。Web Components 为可重用组件提供了强大的封装,而 React 提供了一个声明式库,用于使 DOM 与您的数据保持同步。这两个目标是互补的。
万维网,而不是富裕的西方网络
阅读评论
Bruce Lawson 探讨了 Web 设计师在构建网站时可能存在的许多误解。他的论点的核心是,我们应该专注于为刚刚开始使用互联网的用户以及互联网连接速度缓慢的用户设计网站。
他甚至做了一个大胆的预测
您的许多下一批客户将来自下方圈出的区域,仅仅是因为在这个圆圈内活着的人类比圆圈外世界的人类更多。

如何改进您网站的用户体验
哦,等等,我正在查看生产环境
阅读评论
太对了
为什么这个 CSS 更改不起作用?!
重启服务器
>不行
rm -rf 删除所有内容
>不行
重建开发环境
>不行
哦,等等,我正在查看生产环境
— Mike Coutermarsh (@mscccc) 2017 年 6 月 5 日
我不想破坏这个笑话,但我发现让您的开发域使用与生产环境不同的 Favicon非常有帮助。
阅读该文章的评论线程,那里有一些其他非常巧妙的想法。
使用 CSS 网格突破边界详解
阅读评论
Tyler Sticka 分享了一个在CSS 网格布局中突破内容的巧妙技巧,但 Rachel Andrew 进一步解释了该技巧为何有效
当您命名行时,您可以选择将其命名为 *-start 和 *-end,这会为您提供更多网格魔法。我们会获得一个名为主要名称的命名网格区域。听起来很奇怪?请查看下面的图表,它显示了 4 条命名网格线,main-start 和 main-end 既用于列也用于行。这些线的交点所标记的区域现在可以通过名称 main 来引用。如果我们将这些线命名为 foo-start 和 foo-end,那么我们将拥有一个名为 foo 的命名区域。