Take a tour of a workflow that optimizes CSS code for easier navigation, organization, and readability.
- [Voiceover] Hi, my name is Justin Seeley, and I'm a staff author here at Lynda.com. I want to welcome you to this course on CSS Visual Optimization. This is a course that focuses on helping you create clean, easy-to-read CSS code that can easily be interpreted by you, a fellow designer, or even a developer that you hand it off to. During the first part of this course, I'll discuss why clean markup is so important to the web design workflow, and I'll also show you some real-world examples of both good and bad CSS. From there, I'll take you through organizing your code, wherein you'll learn the importance of creating an outline document, developing a CSS table of contents, and how to properly use indents and line rules to keep your code nice and tidy.
After we've mastered the art of organization, it's time to talk about commenting. Commenting is an essential tool in any coder's tool belt. We'll wrap things up with stuff like creating a master color and typography guide, building a structure template, and also ways to speed up your code and make your website run that much faster. So if you're ready, let's begin our look at CSS Visual Optimization.
- Exploring good versus bad style sheets
- Creating section headings
- Indenting code for enhanced readability
- Creating single- and multi-line comments
- Avoiding unnecessary tags and classes
- Creating master color and typography guides
- Simplifying comments