Oreilly - Applying and Measuring Your CSS Against Your Style Guide
by Archana Sankaranarayanan | Publisher: O'Reilly Media, Inc. | Release Date: October 2017 | ISBN: 9781491994108
Maintaining the CSS for any web site or app can be extremely challenging as the product and the team supporting the product grows. This course examines a suite of tools and processes you can use in your development workflows to keep your CSS healthy and consistent. We'll run CSS analysis tools (e.g., Lighthouse, CSS Stats, CSS Dig, etc.) on a set of popular travel sites to highlight the CSS issues on those sites; we'll survey the suggestions for resolving those issues; and then we'll examine a group of highly effective processes and monitoring tools that help teams maintain their style guide CSS and product CSS. Learners should have a solid understanding of basic CSS and HTML.Explore the best techniques for measuring your CSS against style guide complianceGain experience using CSS analysis tools like WebPageTest, Lighthouse, CSS Stats, and moreMaster the best methods for integrating CSS analysis tools into your workflowLearn about specificity, redundancy, color collision detection, and accessibility compliance detectionDiscover successful processes for onboarding designers and engineers to a style guideLearn how to encourage designer-engineer collaboration around style guide maintenanceArchana 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.
- What to Optimize in Your CSS
- Analyzing CSS and Style Guides 00:02:08
- What Are We Going to Analyze Our CSS For? 00:03:57
- Analyzing CSS for Web Accessibility 00:03:33
- Analyzing CSS for Web Performance 00:06:09
- CSS Analysis Tools
- Using Chrome DevTools Audits 00:04:05
- Using CSS Stats 00:05:52
- Using CSS Dig 00:03:23
- Using Colorguard 00:02:29
- Using the Web Accessibility Evaluation Tool 00:04:46
- Progressive Web Apps and Lighthouse 00:05:31
- Style Guide Maintenance
- Introduction to Style Guide Maintenance 00:02:29
- Style Guide Maintenance with Product Growth 00:05:34
- CSS Style Guide Compliance 00:06:01
- Conclusion
- Applying and Measuring Your CSS Against Your Style Guide—Wrap Up 00:04:49