Miriam Suzanne 是一位作者、艺术家和 Web 开发者，住在科罗拉多州丹佛，目前正在研究激动人心的 CSS 规范，例如容器查询和级联层。
此帖子来自 Designcember。这是一场 Web 设计的盛典，由 web.dev 为你奉上。
Miriam Suzanne 是一位作家、艺术家和 Web 开发者，住在科罗拉多州丹佛。她是 OddBird（一家网络代理机构）的联合创始人、CSS Tricks 的撰稿人、Sass 核心团队成员以及 CSS 工作组的 W3C 邀请专家。最近，她专注于开发新的 CSS 功能，例如级联层、容器查询和作用域。Miriam 离线时是一位出版小说家、剧作家和音乐人。我们谈到了她与 Sass 和 CSS 的合作。
Rachel：我最初因为网格框架 Susy 而了解到你的工作，你创作这个框架的原因是什么？
Miriam：早在 2008 年，网络布局就是一种截然不同的体验。开发者已经从表格布局转向更语义（但仍然不够成熟）的浮动网格。通用的 12 列“网格框架”迅速发展 - 提供带有一组预定义 CSS 类的预定义（通常是静态）网格。如果您需要自定义程度更高的设置，则应自行选择。显然，网站需要提高响应能力，但媒体查询尚不可用，而且浮动浮动广告存在大量的浏览器兼容性问题。
我当时使用的是 Natalie Downe 的 CSS 系统方法，这种方法非常巧妙地响应字体和视口大小，但复杂的计算方法和浏览器技巧令我感到非常沮丧。与此同时，Sass 开始受到关注，它完全符合我的需求。Susy 的初稿非常简单：只需几个混音即可完成数学计算并添加所需的技巧。我们的目标是尽可能精简，并且仅输出基本代码。完全可自定义的网格，没有任何预定义的类。
Rachel：在从使用 CSS 预处理器转变为制定 CSS 规范的过程中，您是如何完成的？您认为预处理器工作是编写规范的一个好背景吗？
米丽亚姆：根据我的经验，很多情况都存在重叠，而且我仍然在这两方面都非常积极。但我认为，这在很大程度上要归功于由 Natalie Weizenbaum 领导的 Sass 团队，该团队有着非常长远的眼光，他们力求开发能够顺畅地与开发网络标准集成的工具。打破一切“固有主观”的统一标准在考虑核心 Web 标准的未来时，保持长期的灵活性非常重要。
我们该如何打造各种工具，在尊重开发者需求和方法的多样性的同时，继续鼓励和促进无障碍功能以及其他重要考虑因素？
Rachel：我们向 CSS 引入了大量功能，它们基本上取代了传统上属于 Sass 的功能。是否有充分的理由仍然使用 Sass 之类的产品？
米丽亚姆：对有些人来说可以，但并没有通用的答案。以变量为例。Sass 变量按词法设定作用域，并在服务器上编译，并采用列表和对象、颜色操作等组织数据结构。这非常适合不需要在浏览器中运行的设计系统逻辑。
CSS 变量存在一定程度的重叠，它们也可以存储值，但它们提供的是一组完全不同的基于级联的优缺点。Sass 无法处理自定义属性，CSS 无法处理结构化数据。两者都很有用，功能也很强大，但您的具体需求可能会有所不同。
我认为，如果人们可以淘汰他们不再需要的工具，而一些项目可能并不需要服务器端变量和客户端变量，那就太好了。非常好！但假设这两个元素完全相同，一个完全取代另一个，则太过简单。有些设计逻辑总是在服务器端执行，还有一些用例在客户端发生，即使语言提供的功能基本相同，也是如此。预处理器与我们长期合作。
Rachel：随着您越来越多地参与制定标准，有没有什么让您感到惊讶的地方，或者您认为人们通常可能不知道的流程？
米丽亚姆：在参与其中之前，标准流程就像一个神秘而神奇的黑盒子，我不知道会出现什么情况。我担心自己可能没有足够的浏览器内部知识来做贡献，但现实情况是，不需要更多的浏览器工程师。他们需要更多的开发者和设计人员来实际构建网站和应用。
我惊讶地发现，在与会者中，几乎没有人主要关注标准，但也很少有人主要从事网站的开发或设计工作。W3C 由“志愿者”组成（通常由这些组织支付费用，但不作为其主要工作付费），而且会员费不贵。这使得参与者无法参加日常设计师和开发者的工作，尤其是那些在小型代理机构或自由职业者处为客户工作的人。作为一名受邀专家，如果我没有为这项工作找到外部资金，我是一名完全自愿的专家，而且这项业余爱好非常宝贵。
事实上，该流程是公开和公开的，需要开发者参与，但同时进行太多对话，以至于很难找到适合自己的位置。尤其是在您不是日常工作时。
Rachel：多年来，容器查询一直是许多 Web 开发者的制胜法宝。我们很高兴能够获得这些信息。我感觉很多人都在考虑容器查询的实用性，你觉得它们是否有释放更多创造力的潜力？
米瑞姆：当然可以，但我并不认为这是完全独立的。我们每个人都有时间限制，因此，我们都在努力编写可维护、高性能的代码。当在实践中很难做到某件事时，我们不太可能发挥创造力来发挥无限可能。
尽管如此，网络行业现在仍由大型企业利益占据主导地位，因此这类商业问题所花的时间总是比网络艺术家更多。而且我认为，如果将网络创意作为各种功能的主要用例，我们将损失很多。我非常高兴看到一些 CSS 艺术人员在玩容器查询原型。Jhey Tompkins 以 CSS 威尼斯百叶窗为主题制作了一个极其巧妙的互动演示视频，用于对旧的反 CSS 表情包进行点评。我认为这个领域还有很多有待探索的领域，我迫不及待地想看看大家的创意。
这次对话也侧重于基于大小的查询（作为原始用例），但我很高兴看到大家使用样式查询执行了什么操作，即根据 CSS 属性或变量的值编写条件样式的功能。这是一项非常强大的功能，目前为止大部分人尚未被探索过。我觉得这带来了更多创作机会！
Rachel：在 CSS 中，有什么我们做不到（或即将推出的）您认为有用的做法吗？
Miriam：对于我一直在研究的一些其他规格，我感到非常兴奋。级联层可让作者更好地控制特异性问题，而作用域应有助于实现更精确的选择器定位。但这两个都是高度的架构问题。在我眼中，艺术家更喜欢 CSS 切换开关（一种创建互动样式的声明式方法）或容器“时间轴”，它使我们能够在媒体或容器断点之间顺畅地转换值。这对自适应排版产生了非常实用的影响，同时也为自适应美术和动画领域带来了很多创意机会。
Rachel：目前还有哪些人在网上做非常有趣、好玩或有创意的工作？
Miriam：哦，我甚至不确定怎么回答这个问题，因为有很多人在不同的领域做创意工作。CSSWG 和 Open-UI 中有很多令人兴奋的标准正在开发中，包括您在碎片化方面所做的一些工作。但我经常从网络美工那里找到最多的灵感，看看人们是如何以与商业没有直接关系的方式将这些工具投入生产的。比如 Jhey、Lynn Fisher 或 Yuan Chuan 等人士，还有很多人正在突破网络技术在视觉和互动方面的作用，不断突破新的界限。即便是从事更多商业性工作的人，也可以从他们的艺术技巧中学到很多东西。
此外，我也非常欣赏 Ben groer 这样具有概念性的网络艺术，他不断推动我们重新思考我们希望从网络（尤其是社交媒体）获得什么。比如他的新应用 minus.social。
Rachel：访问 css.oddbird.net 了解 Miriam 的最新 CSS 工作，并通过她的网站 miriam.codes 和 Twitter @TerribleMia 了解她的其他最新动态。