Tiffany Brown
SitePoint
Los Angeles, CA, United States
Contact Tiffany
Discover and connect with journalists and influencers around the world, save time on email research, monitor the news, and more.
| Recent: |
|
| Past: |
|
Past articles by Tiffany:
CSS Debugging and Optimization: Minification with CSSO —
In this series on troubleshooting and optimizing your CSS, Tiffany Brown looks at ensuring code efficiency with the CSS Optimizer (or CSSO), a minification tool that runs on Node.js and which makes sure our file sizes are as small as they can be. → Read More
CSS Debugging and Optimization: Browser-based Developer Tools —
In this series on troubleshooting and optimizing your CSS, Tiffany Brown delves into the browser-based developer tools for Chrome, Safari, Firefox, and Microsoft Edge, covering the styles panel, cascade and inheritance problems, spotting invalid properties and values, and debugging responsive layouts. → Read More
CSS Debugging and Optimization: Code-quality Tools —
In this series on troubleshooting and optimizing your CSS, Tiffany Brown introduces UnCSS and stylelint, two code-quality tools for analyzing the quality of your CSS. → Read More
Creating Flexible Layouts with Flexbox —
Tiffany Brown introduces Flexbox, explaining the basic principles behind flex layout, with examples of laying out a basic media object, flexible form components, vertical centering, and creating grid-like layouts, as well as explaining when to use Flexbox over CSS Grid. → Read More
Creating Layouts with CSS Grid —
Tiffany Brown introduces the basics of CSS Grid, covering the grid formatting context, defining a grid layout, explicit versus implicit grids, specifying track size for an implicit grid, creating flexible grids with flex units, using the grid-template shorthand property, and repeating rows and columns. → Read More
Using SVG with Media Queries —
With HTML documents, we might show, hide, or rearrange parts of the page based on the conditions of the viewport. If the browser window is 480 pixels wide, for example, we might shift our navigation from a horizontal one to a vertical, collapsible list. We can do something similar with media queries and SVG documents. → Read More
Scroll Snap in CSS: Controlling Scroll Action —
Scroll snap lets developers define the distance an interface should travel during a scroll action. You might use it to build slide shows or paged interfaces―features that currently require JavaScript and expensive DOM operations. → Read More
How to Use 2D Transformation Functions in CSS —
Transforms allow us to create effects and interactions that are otherwise impossible. When combined with transitions and animations, we can create elements and interfaces that rotate, dance, and zoom. In this piece, we'll look at 2D transform functions. → Read More
How to Get Started with CSS Animation —
Think of CSS animation as the more sophisticated sister to CSS transitions. Animations differ from transforms in a few key ways, which we'll explore in this article → Read More
CSS Architecture: Block-Element-Modifier (BEM) & Atomic CSS —
We’ll now look at two methodologies for naming things in CSS: Block-Element-Modifier (better known as BEM) and Atomic CSS. → Read More
Variables in CSS: Custom Properties —
Variables make it easier to manage colors, fonts, size, and animation values, and to ensure their consistency across a codebase. → Read More
Managing the CSS Box Model —
In this exclusive excerpt from our book, CSS Master by Tiffany Brown, we look at the best ways of managing the CSS Box Model → Read More
Minifying CSS With CSS Optimizer —
In this exclusive excerpt from our book, CSS Master, we teach you how to minify CSS with a CSS Optimizer. → Read More
Debugging CSS for UI Responsiveness —
In this exclusive book excerpt, we examine CSS properties and values that trigger reflows. → Read More
CSS Architecture: CSS File Organization
In this exclusive excerpt from our book, CSS Master, we look at the importance of file organization and how it benefits CSS architecture overall. → Read More
Golden Guidelines for Writing Clean CSS
In this exclusive excerpt from our book, CSS Master, we give you the ultimate guidelines for writing clean CSS. → Read More
Learn about CSS Architecture: Atomic CSS
What exactly is Atomic CSS, and how do you use it? We give the lowdown through this exclusive excerpt from our book, CSS Master. → Read More
CSS Architecture Block-Element-Modifier (BEM)
Learn how to use the Block-Element Modifier (BEM) in CSS. This an exclusive excerpt from our SitePoint book, titled CSS Master, written by Tiffany Brown. → Read More
CSS Master on
Organized, fast, efficient - CSS done right! → Read More
Animation Advice from a CSS Master
Last week Tiffany Brown, author of CSS Master, joined us on the forums for a Q&A session discussing CSS Animations. Read the highlights of her conversation. → Read More