Course Material and FAQ for "Build Responsive Real-World Websites with HTML and CSS"

• Course Structure and Projects
• Setting Up

• HTML Document Structure
• Text Elements: Paragraphs, Lists, etc.
• Images and Attributes
• Hyperlinks
• Structuring our Page
• Semantic HTML

✅ Section 2 - Challenge Code

• Inline, Internal and External CSS
• Combining Selectors
• Class and ID Selectors
• Working With Colors
• Pseudo-classes
• Styling Hyperlinks
• Using Chrome DevTools
• CSS Theory #1: Conflicts Between Selectors
• CSS Theory #2: Inheritance and the Universal Selector
• CSS Theory #3: The CSS Box Model
• Using Margins and Paddings
• Adding Dimensions
• Centering our Page
• CSS Theory #4: Types of Boxes
• CSS Theory #5: Absolute Positioning
• Pseudo-elements
• Developer Skill #1: Googling and Reading Documentation
• Developer Skill #2: Debugging and Asking Questions

✅ CSS Fundamentals Notes

✅ Section 3 - Challenge Code

• The 3 Ways of Building Layouts:
  • Floats
  • Flexbox
  • CSS Grid

✅ CSS Layouts Notes

✅ Section 4 - Challenge Code

• Web Design Rules #1: Typography
• Web Design Rules #2: Colors
• Web Design Rules #3: Images and Illustrations
• Web Design Rules #4: Icons
• Web Design Rules #5: Shadows
• Web Design Rules #6: Border-radius
• Web Design Rules #7: Whitespace
• Web Design Rules #8: Visual Hierarchy
• Web Design Rules #9: User Experience (UX)
• The Website-Personalities-Framework

✅ Web Design Rules and Framework Notes

• Accordion Component
• Carousel Component
• Table Component
• Pagination Component
• Hero Section
• Web Application Layout

✅ Projects

✅ Notes

✅ Omnifood Desktop

✅ Notes

✅ Omnifood Desktop

✅ Notes

✅ Omnifood Optimizations

✅ Deployment to Netlify: https://omnifood-jonas-practice.netlify.app/