Congratulations!
These five challenges were designed to improve skills at planning website layouts, consider different approaches, and choose the "correct" approach with reasoning behind it. What should you do next?
Next steps
Most challenges came with some steps to take those layouts to the next level. Some other ideas might include:
- Assemble a full website with the layouts provided. You'll need to add a navbar and a footer. Jen's explained navbars and footers in her other courses. If you're new to coding or Frontend Masters, Getting Started with CSS is a good place to start with examples of navbars and footers.
- Apply the four-part HTML and CSS execution approach presented in this course to your next project. Layer on JavaScript sparingly, rather than starting with it and including it throughout your code. Your site will perform better when the web is coded the way it was designed.
- Explore Jen Kramer's other courses at Frontend Masters for more learning in CSS layouts and other topics.
References
- Complete Guide to Grid
- Complete Guide to Flexbox
- @layer is a cascade option, although we use it for simple grouping of styles in this course.Read more here
- A Complete Guide to CSS Cascade Layers
- Does the perfect viewport size exist?
- How to: Create a Low Highlight Text Effect Using CSS
- Custom Scrollbars
- How to Use CSS object-fit and object-position