Course introduction
  • Let's start this amazing journey
  • READ BEFORE YOU START!
  • E-book Resources 2.0
  • First things first: download your free e-book here
Dive into HTML
  • Download the Code
  • Our main tool: Brackets text editor
  • What is HTML?
  • The structure of an HTML document
  • Starting to fill the structure
  • Images and attributes
  • One more thing: links
  • HTML Quiz
Formatting with CSS
  • Getting started with CSS
  • Starting to make our webpage pretty: text
  • Colors
  • Classes and ID's
  • The CSS box model
  • Building a simple layout
  • Polishing our blog post
  • Relative vs. Absolute
  • Getting started with the Chrome Developer Tools
  • CSS Quiz
Web design basics
  • Introduction to web design
  • Beautiful typography
  • Using colors like a pro
  • The meaning of colors in web design
  • Working with images
  • Working with icons
  • Spacing and layout
  • Introduction to user experience
  • Getting inspired: the secret ingredient for stunning web design
  • Wrapping up what we've learned in this section
  • The ultimate cheatsheet: all web design guidelines in one place
  • Web design quiz: test your knowledge!
The killer website project
  • Download the Code
  • The 7 real-world steps to a fully functional website
  • Download the 7 steps here
  • Omnifood Project FAQs — READ BEFORE YOU START!
  • Starting to put the 7 steps into action
  • First development steps
  • Setting up the fluid grid for responsive web design
  • Building the header - Part 1
  • Building the header - Part 2
  • Building the header - Part 3
  • Building the features section - Part 1
  • Building the features section - Part 2
  • Building the favorite meals section - Part 1
  • Building the favorite meals section - Part 2
  • Building the how-it-works section - Part 1
  • Building the how-it-works section - Part 2
  • Building the cities section - Part 1
  • Building the cities section - Part 2
  • Building the customer testimonials section - Part 1
  • Building the customer testimonials section - Part 2
  • Building the sign-up section - Part 1
  • Building the sign-up section - Part 2
  • Building the contact form form - Part 1
  • Building the contact form form - Part 2
  • Building the footer - Part 1
  • Building the footer - Part 2
Responsive web design with media queries
  • Making the webpage responsive - Part 1
  • Making the webpage responsive - Part 2
  • A note about web browsers
Let's add some cool effects
  • Download the Code
  • Introduction to jQuery
  • Building a “sticky” navigation - Part 1
  • Building a “sticky” navigation - Part 2
  • Scrolling to elements
  • Adding animations on scroll
  • Making the navigation responsive
Optimizing and launching our website
  • Final touch: creating a favicon
  • Performance optimization: site speed
  • Basic search engine optimization (SEO)
  • Let’s launch our webpage!
  • Google Analytics
Conclusion
  • You made it! Congratulations!
  • My Special Gift for You: Never Stop Learning!
BONUS lectures
  • What’s New in CSS: A Quick Intro to Flexbox, Part 1
  • What’s New in CSS: A Quick Intro to Flexbox, Part 2
  • Using PHP to make our form work
  • Super effective ways to improve your website’s conversion