Miriam Suzanne 是科羅拉多州丹佛市的作家、藝術家和網頁開發人員，目前正在研究令人期待的 CSS 規格，例如容器查詢和層疊層。
這篇文章是 Designcember 的一部分。由 web.dev 舉辦的網頁設計慶典。
Miriam Suzanne 是科羅拉多州丹佛市的作家、藝術家和網頁開發人員。她共同創立了 OddBird (網頁設計公司)，是 CSS Tricks 的特約作家、Sass 核心團隊成員，也是 W3C CSS 工作團隊的特邀專家。她最近專注於開發新的 CSS 功能，例如層疊層、容器查詢和範圍。在現實生活中，Miriam 是已出版的小說家、劇作家和音樂家。我們談論了她使用 Sass 和 CSS 的工作。
Rachel：我第一次認識你的作品，是因為你的格線架構 Susy，是什麼原因促使你建立這個架構？
Miriam：2008 年時，網頁的版面配置與現在大不相同。開發人員已從表格版面配置轉向更語意化的 (但仍是權宜之計) 浮動格線。當時出現了許多適用於所有情況的 12 欄「格線架構」，提供預先定義 (通常是靜態) 的格線，以及一組預先定義的 CSS 類別。如果需要更多自訂項目，就得自行處理。當時很明顯網站需要更具回應性，但媒體查詢尚未推出，且流動浮動元素有許多瀏覽器相容性問題。
我當時採用 Natalie Downe 的 CSS 系統方法，可靈活因應字型和可視區域大小，但重複的數學運算和瀏覽器駭客行為令人沮喪。當時 Sass 開始受到關注，而且完全符合我的需求。Susy 的第一個草稿非常簡單：只有幾個 mixin，用來進行數學運算並新增我需要的駭客。目標是盡量減少輸出內容，只輸出必要程式碼。完全可自訂的格線，不含任何預先定義的類別。
Rachel：你是如何從 CSS 前置處理器轉移到 CSS 規格？您認為從事前置處理器工作，對撰寫規格有幫助嗎？
Miriam：以我的經驗來說，這兩者之間有許多重疊之處，而且我仍然活躍於這兩大領域。但我認為這主要是因為 Sass 團隊 (特別是 Natalie Weizenbaum 領導的團隊) 採取非常長期的觀點，致力於開發能與網頁標準順暢整合的工具。思考核心網路標準的未來時，請務必超越「一體適用」的「主觀」解決方案，並建構長期彈性。
我們該如何建構工具，兼顧開發人員需求和方法的多元性，同時鼓勵並促進無障礙功能和其他重要考量？
Rachel：我們在 CSS 中加入許多內容，基本上取代了傳統上屬於 Sass 的功能。是否有充分的理由繼續使用 Sass 等工具？
Miriam：是的，對某些人來說是這樣，但沒有適用於所有人的答案。以變數為例，Sass 變數的範圍是詞彙，且會在伺服器上編譯，並使用清單和物件等有條理的資料結構、顏色操控等。這非常適合不需要在瀏覽器中執行的設計系統邏輯。
CSS 變數有部分重疊，也可以儲存值，但提供的是完全不同的連鎖式優缺點。Sass 無法處理自訂屬性，而 CSS 則無法處理結構化資料。兩者都非常實用且功能強大，但具體需求可能有所不同。
如果使用者不再需要某些工具，就能將其移除，這點我覺得很棒。此外，部分專案可能不需要伺服器端和用戶端變數。太好了，但如果就此認定兩者相同，且其中一個只是取代另一個，就太過簡單了。即使語言提供的功能大致相同，還是會有需要伺服器端和用戶端設計邏輯的使用案例。預先處理器將長期與我們合作。
Rachel：您在參與標準制定工作時，是否有任何出乎意料的發現？或者您認為一般人可能不瞭解這個過程的哪些部分？
Miriam：參與標準制定程序前，我感覺這就像一個神祕的魔法黑盒子，不確定會發生什麼事。我擔心自己對瀏覽器內部結構的瞭解不夠深入，無法做出貢獻，但事實是，他們不需要更多瀏覽器工程師。他們需要更多開發人員和設計師，在野外建構網站和應用程式。
令我驚訝的是，參與其中的人很少以標準為主要目標，但也很少人主要開發或設計網站。W3C 由成員機構的「志工」組成 (通常由這些機構支付薪資，但並非主要工作)，且會員資格並不便宜。這會導致參與者偏離日常設計師和開發人員，特別是我們這些在小型代理商或自由工作者中從事客戶工作的人。如果沒有外部資金贊助，我擔任受邀專家的工作完全是義務性質，而且是一項昂貴的嗜好。
事實上，這個過程相當公開，且需要開發人員參與，但由於同時進行的對話太多，您可能很難找到適合自己的位置。尤其是當你沒有全職工作時。
Rachel：多年來，容器查詢一直是許多網頁開發人員的夢想。我很高興我們能獲得這些獎項。我覺得很多人都在思考容器查詢的實用性，你認為容器查詢也有可能激發更多創意嗎？
Miriam：當然，不過我認為這兩者並非完全獨立。我們時間有限，因此要盡量編寫可維護且高效能的程式碼。如果某件事在實務上難以做到，我們就比較不會發揮創意，思考如何達成目標。
不過，網路產業現在由大型企業利益主導，因此這些商業考量總是比網路藝術家更受重視。如果我們忽略網路創意，將其視為功能的主要用途，我覺得會損失很多。很高興看到一些 CSS 藝術家使用容器查詢原型。Jhey Tompkins 製作了特別聰明的 CSS 百葉窗互動式範例，用來評論舊的 CSS 迷因。我覺得這個領域還有很多值得探索的地方，迫不及待想看看大家還會想出什麼點子。
對話也著重於以大小為依據的查詢，因為這是原始用途，但我很期待看到使用者如何運用樣式查詢，也就是根據 CSS 屬性或變數的值編寫條件式樣式。這項功能非常強大，但目前大多未經探索。我覺得這能帶來更多創意機會！
Rachel：您認為 CSS 還有哪些實用功能尚未推出 (或即將推出)？
Miriam：我正在開發其他規格，也很期待這些規格的推出。層疊層可讓作者更有效控制特異性問題，而範圍則有助於更精確地指定選取器。但這兩者都是高階架構考量。以藝術家身分來說，我更期待 CSS 切換、以宣告方式建立互動式樣式，或是容器「時間軸」，讓我們能在媒體或容器中斷點之間順暢轉換值。這對回應式排版有實際影響，但也會為回應式藝術和動畫帶來許多創意機會。
Rachel：目前還有誰在網路上製作有趣或有創意的作品？
Miriam：喔，我不太確定該怎麼回答，因為有太多人在不同領域從事創意工作。CSSWG 和 Open-UI 正在進行許多令人期待的標準作業，包括您在片段化方面的工作。不過，我最常從網路藝術家身上獲得靈感，以及他們如何將這些工具投入製作，以與商業無直接關聯的方式呈現。例如 Jhey、Lynn Fisher 或 Yuan Chuan 等人，他們不斷突破網頁技術的視覺和互動功能極限。即使是從事以業務為導向工作的人，也能從藝術技巧中學到許多東西。
我也很欣賞 Ben Grosser 等人的概念性網路藝術，他們不斷促使我們重新思考自己想從網路 (尤其是社群媒體) 獲得什麼。例如，他最近推出了 minus.social。
Rachel：如要掌握 Miriam 的 CSS 工作進度，請前往 css.oddbird.net，並透過 miriam.codes 和 Twitter 帳戶 @TerribleMia 瞭解她的其他動態。