Episode 44: CSS, Sass, and Playwriting with Miriam Suzanne

Enjoy the Vue

Key Points From This Episode:

• Miriam’s advice for getting started in CSS, especially those coming from other languages.
• How CSS provides the tools to deal with its inherent and absurd lack of control.
• The history of browsers with style capabilities and how CSS was a response to that idea.
• We learn why Miriam is ambivalent to tools like Tachyon or Tailwind.
• What developing Sass helped Miriam learn about CSS, and why Sass can’t contextualize the complexity of CSS for users.
• The design systems approach Miriam chooses, depending on the client, and she loves Sass.
• Addressing scoping – Miriam describes how her preferred tool, View Solution works.
• Some common scoping or CSS patterns that Miriam disagrees with, and the patterns or paradigms she thinks deserve more attention.
• Miriam talks about the CSS spec work she is doing and why she felt the need to do it.
• Problem-solving when debugging – Miriam suggests looking at browser dev tools and property when inspecting an element.
• Miriam explains the layout models in CSS, and how others can understand them better.
• CSS is communicating meaningfully to the browser, how to make smart decisions for us.
• Masonry layout – what it is, why it’s considered the holy grail layout, why it’s tough to build.
• CSS, specs, browser implementation, and rules – Miriam lays out what CSS actually is.
• Which of the things that are broken or unintuitive in CSS Miriam would like to change.
• The panel shares the worst thing they have done in CSS and the thing they are proudest of.
• Miriam shares her worst CSS experience, which was during the height of maintaining Susy.
• Tessa’s picks include Mozilla Developer videos and CSS The Card Game.
• Ben’s picks this week involve fixing back pain with a massage gun and a song called Funny.
• Miriam shares her picks, including A CSS showcase called Style Stage, the Layout Land videos, and an ASL dictionary.
• To close the show is Ari’s pick, which is simply Queen by Perfume Genius.

Tweetables:

• “[CSS is] a collaboration with browsers and with users, everything is contextual, it's meant to be that way. Browser differences are a feature, your code breaking is a feature… That’s just the way it is. It’s one weird big performance art.” — @mirisuzanne [0:02:36]
• “CSS is all about communicating meaningfully to the browser how to make smart decisions for us. Telling it this is a flex situation, or this is a grid situation, or this is a float situation is meaningful information that the browser can use to make decisions on our behalf in contexts we haven't thought about.” — @mirisuzanne [0:34:18]
• “My key to writing CSS is always try to convey as much information as we can to the browser in small ways.” — @mirisuzanne [0:34:28]
• “Responsive web design taught us to remove all intrinsic sizes and put a percentage on everything, everything is fluid. If you’ve ever heard Jen Simmons talk about intrinsic design, she's trying to push back on that one aspect of responsive.” — @mirisuzanne [0:47:44]

Links Mentioned in Today’s Episode:

• Miriam Suzanne on Twitter
• Miriam Suzanne on LinkedIn
• Miriam Suzanne on GitHub
• Miriam Suzanne
• OddBird
• Teacup Gorilla
• Grapefruit Lab
• Riding Sidesaddle*
• The Post-Obsolete Book
• Why is CSS So Weird?
• Storybook
• Mozilla Developer on YouTube
• CSS The Card Game
• Tierney's gist for playing Among Us "locally"
• Theragun
• Funny
• Style Stages by Stephanie Eckles
• Layout Land on YouTube
• ASLU Dictionary by Bill VicarsFreedom is a Constant Struggle
• Queen
• Incomplete List of Mistakes in the Design of CSS
• Enjoy the Vue on Twitter
• Enjoy the Vue

Special Guest: Miriam Suzanne.

Support Enjoy the Vue