Enduring CSS

Key Features

• The problems of CSS at scale – specificity, the cascade and styles intrinsically tied to element structure.
• The shortfalls of conventional approaches to scaling CSS.
• The ECSS methodology and the problems it solves.
• How to develop consistent and enforceable selector naming conventions with ECSS.
• How to organise project structure to more easily isolate and decouple visual components.
• Considerations of CSS tooling and processing: Sass/PostCSS and linting.
• Addressing the notion of CSS selector speed with hard data and browser representative insight.

Book Description

Learn with me, Ben Frain, about how to really THINK about CSS and how to use CSS for any size project! I’ll show you how to write CSS that endures continual iteration, multiple authors, and yet always produces predictable results. Enduring CSS, often referred to as ECSS, offers you a robust and proven approach to authoring and maintaining style sheets at scale.

Enduring CSS is not a book about writing CSS, as in the stuff inside the curly braces. This is a book showing you how to think about CSS, and be a smarter developer with that thinking! It’s about the organisation and architecture of CSS: the parts outside the braces. I will help you think about the aspects of CSS development that become the most difficult part of writing CSS in larger projects.

You ll learn about the problems of authoring CSS at scale – including specificity, the cascade and styles intrinsically tied to document structure. I’ll introduce you to the ECSS methodology, and show you how to develop consistent and enforceable selector naming conventions. We’ll cover how to apply ECSS to your web applications and visual models. And how you can organise your project structure wisely, and handle visual state changes with ARIA, providing greater accessibility considerations. In addition, we’ll take a deep look into CSS tooling and process considerations. Finally we will address performance considerations by examining topics such as CSS selector speed with hard data and browser-representative insight.

Enduring CSS is a book for considering how to write CSS in the most effective manner, and how you too can create an enduring CSS code base, regardless of project size. Take a journey with me if you want to explore these topics and deepen your thinking as a CSS author.

What you will learn

• The problems of CSS at scale: specificity, the cascade and styles intrinsically tied to element structure.
• The shortfalls of conventional approaches to scaling CSS.
• The ECSS methodology and the problems it solves.
• How to develop consistent and enforceable selector naming conventions with ECSS.
• How to organise project structure to more easily isolate and decouple visual components.
• How to handle state changes in the DOM with ARIA or override selectors.
• How to apply ECSS to web applications and visual modules.
• Considerations of CSS tooling and processing: Sass/PostCSS and linting.
• Addressing the notion of CSS selector speed with hard data and browser representative insight

Table of Contents

Chapter 1. Writing Styles for Rapidly Changing, Long-lived Projects
Chapter 2. The Problems of CSS at Scale
Chapter 3. Implementing Received Wisdom
Chapter 4. Introducing the ECSS Methodology
Chapter 5. File Organisation and Naming Conventions
Chapter 6. Dealing with State Changes in ECSS
Chapter 7. Applying ECSS to Your Website or Application
Chapter 8. The Ten Commandments of Sane Style Sheets
Chapter 9. Thou shalt not place inline images in the authoring style sheets
Chapter 10. Thou shalt not write complicated CSS when simple CSS will work just as well