Sebastian Eberlein 的出色思考和探索。 我坚信，如果你 用 Markdown 写博客，你会对自己有所帮助，因为它会给你提供干净的 HTML 输出，不会充斥着很可能永远不会持续存在的类。

相反，为什么不使用一些巧妙的 CSS 选择器（使用类似相邻兄弟组合器的东西）来获得你想要的间距和样式，而无需更改标记。 CSS 比 HTML 更容易更改。 也就是说，HTML *在内容内*。 作为模板一部分的 HTML 更改起来同样容易。

我刚从西雅图的 An Event Apart 回来，这次活动非常棒。 向我在那里遇见的各位打招呼。 在 An Event Apart 会发生很多重大时刻。 微软借此机会宣布他们正在正式致力于将 CSS 网格引入 Edge，这意味着该功能即将实现全面的跨浏览器兼容性。

Ethan Marcotte 也在现场，在进行有关设计模式的精彩演讲之前，他告诉我们，正是这个舞台上他第一次说出“响应式网页设计”这几个字。 看看，An Event Apart 在行业变革想法的萌芽和发展方面有着非常稳固的历史。

幸运的是，今年还有五场演出

1. 波士顿，5 月 15 日至 17 日
2. 华盛顿特区，7 月 10 日至 12 日
3. 芝加哥，8 月 28 日至 30 日
4. 旧金山，10 月 30 日至 11 月 1 日
5. 丹佛，12 月 11 日至 13 日

我将在芝加哥进行我的全天演讲！

我上周才 抱怨笔划

这就是 CSS 中 text-stroke 的问题所在：你没有选择。 它只能是居中对齐的笔划。 其他两个选项（外边距对齐或内边距对齐）中，可以说，更实用的选项应该更多。

对于 text-stroke 仍然没有解决方案，但 SVG 也存在完全相同的问题。 它在 SVG 中并没有那么破坏设计，因为你可以（并且设计师一直在）在矢量艺术中考虑到居中对齐的笔划来进行设计。 不过，我想如果我们有 stroke-align: [center, outside, inside];，情况会更好。

Peter Nowell 记录了 Sketch 如何现在重新定位形状的点，以复制不同的笔划对齐方式，前提是你明确地在 Sketch 中选择了这些选项。 非常有用！ 由于原生 SVG 仍然只执行居中对齐，因此这意味着在导出后更改笔划宽度仍然很奇怪，但我认为这种情况相当罕见。

这篇文章指出 SVG 2 如何适应对齐的笔划，但这仍然让人觉得有点 悬而未决。

Dropbox Paper 团队的 Bobby Grace

在工程方面，我们使用内联 SVG。 这有很多优点。 一个优点是 SVG 是一种结构良好的格式，我们可以用代码对其进行操作。 Paper 也使用 React，并且有一个用于插入图标的组件。

他们

1. 使用单个 Sketch 文件（签入到仓库中）作为设计和存放所有图标的地方。
2. 使用 gulp-sketch 将它们全部单独提取出来。
3. 构建脚本将继续优化所有图标并构建一个包含所有图标及其属性的数据源。
4. 该数据为他们的 <SvgIcon /> React 组件提供支持。（另请参阅 我们的文章）。

他们称之为 Papercons。

现在，无论何时有人要求图标，我们都可以简单地分享一个指向所有最新生产图标的链接。 不再需要搜索、切换上下文和冗长的对话线程。

在 ShopTalk 的最新一期中，Robyn Kanner讲述了一个让她记忆深刻的关于 UX 职位面试的故事。

他们要求她为山地自行车手创建一个社交应用程序。 谈谈应用程序的运作方式，草拟一些流程，你知道，UX 工作。 正如他们所期望的，也是我当时会做的事情。 但随后 Robyn 反过来问他们打算如何处理 *安全*。 这个应用程序将允许陌生人在森林中相遇，你如何确保他们的安全？

天哪。 她一说出来就显得显而易见，但最初提出这个问题的时候，并没有那么显而易见。 至少对我这个男人来说是这样。 正如 Mike Monterio 所说，我们都是大块头，不会考虑和陌生人一起乘坐 Lyft，但这对许多人来说是首要考虑的问题。 我们工作中存在着这种巨大的盲点。

一系列具有有趣 UI 交互和动画的简单表单。

我不能保证每个表单的最终演示都是完全无障碍的，或者能够衡量 UX 的改善程度，但这并不意味着你不能从这些想法中获得灵感，并确保你对它们的实现能够做到这一点。

Das Surma

在这篇文章中，我们将利用一些非传统的 CSS 矩阵来构建一个自定义滚动器，该滚动器在滚动时不需要任何 JavaScript，只需要一些设置代码。

如果 将滚动条变成一只 Nyan 猫，并且功能几乎完美，那么这肯定算得上 CSS 技巧，否则我不知道什么才算。

Dave 和我上周做了一期 关于 VR 的 ShopTalk Show。 然后，正如 Dave 总是做的那样，他用 A-Frame 做了一个游戏：ShopTalk Show: 打地鼠！ 在这期节目和上周在 Sarah 的地方玩 Tilt Brush 之后，我已经快要入手一个头显了。

观点。

反驳。

现在已经成为一种常识，即在 CSS 中，只有两种东西可以廉价地进行动画：不透明度和变换。 其他任何东西，你都有很大的风险让动画/过渡变得卡顿。 幸运的是，这些属性提供了大量的动画可能性，尤其是考虑到变换可以以任何方式移动和调整元素的大小。

你甚至可以用变换来实现一些技巧，伪造其他属性的动画。 在 Google Chrome 开发者博客上的这篇教程中，Paul Lewis 和 Stephen McGruer 解释了如何使用垂直缩放变换来伪造高度动画，同时触发另一个方向上的垂直缩放变换，这样就不会看起来有任何东西被压缩。

它很巧妙、性能高、有用。 我在 CodePen 中移动了一份副本，方便大家玩玩。

不过，对于如此简单的结果，代码确实很多。 作为一名开发者，我更 *希望* 做的是让点击 切换一个类，然后菜单 动画到自动维度，并让这一切以高性能的方式完成。