Building a CSS Style Guide from Scratch

A well-designed CSS style guide offers more than just consistent patterns; it ensures web accessibility, better site performance, improved engineering and design efficiency, and provides your users with a uniform experience across your entire application or suite of applications. In this course, you’ll learn how to build a CSS style guide from scratch. You'll explore each of the user interface (UI) components that go into the most effective style guides; you'll examine the benefits of maintaining a “living” style guide (i.e., provides flexibility, responds to an application's changing needs, etc.); and you'll learn about the analysis and linting tools that measure your CSS and assist with style guide maintenance. Participants should understand the fundamentals of HTML and CSS.

• Learn how to build a style guide from scratch using the PostCSS style guide builder
• Explore the different UI components that make up a style guide
• Discover how to incorporate a style guide in your product or website
• Understand why you need a “living” style guide and how to maintain one
• Learn how to measure your CSS for redundancy, accessibility, and complexity
• Explore the process and linting required to analyze and maintain a style guide

Archana Sankaranarayanan has a passion for building simple and intuitive user experiences. She works as a senior UI engineer at Netflix and her background includes stints at Coursera, Quantifind, and Adobe Systems. Archana holds a Masters in Information Systems Management from Carnegie Mellon University.