From the course: CSS: Design Systems and Architectures

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Templates

Templates - CSS Tutorial

From the course: CSS: Design Systems and Architectures

Start my 1-month free trial

Templates

- [Instructor] Modules are built to work independently, but they also need to be flexible and reusable so they can be mixed and matched to create different layouts. Putting together templates of commonly-used combinations and layouts can streamline development, but also test that the components works as intended. A project that I worked on, Women and Tech, had two page templates they needed to be flexible, the interview pages and the landing page. On the interview page, we needed to be able to add modules like Q&A blocks and images in various styles, landscape, portrait, or two pictures side-by-side, and pullout quotes. But we also needed to be able to display these modules in any order and in any quantity. I started by building out the modules and components as standalone pieces. After that was complete, I started assembling the components into a full page and was able to test that they fit as intended. I also found that I needed to create a few helper classes for the one-off…

Contents