HTML and CSS3 for Building Responsive Real World Websites

Get ready for your exam by enrolling in our comprehensive training course. This course includes a full set of instructional videos designed to equip you with in-depth knowledge essential for passing the certification exam with flying colors.

$14.99 / $24.99

Dive into HTML

1. Our main tool: Brackets text editor
2m 43s
2. Colors
5m 6s
3. Classes and ID's
7m 38s
4. The CSS box model
4m 20s
5. Building a simple layout
4m 31s

Formatting with CSS

1. Getting started with CSS
3m 15s
2. Colors
5m 20s
3. Classes and ID's
5m 23s
4. The CSS box model
7m 16s
5. Building a simple layout
18m 37s

Web design basics

1. Introduction to web design
2m 58s
2. Beautiful typography
8m 40s
3. Using colors like a pro
6m 19s
4. Working with images
3m 30s
5. Working with icons
2m 59s
6. Spacing and layout
3m 13s
7. Introduction to user experience
2m 33s
8. Getting inspired: the secret ingredient for stunning web design
1m 29s

The killer website project

1. The 7 real-world steps to a fully functional website
5m 2s
2. Starting to put the 7 steps into action
5m 47s
3. First development steps
14m 16s
4. Setting up the fluid grid for responsive web design
9m 37s
5. Building the header - Part 1
15m 48s
6. Building the header - Part 2
20m 57s
7. Building the header - Part 3
19m
8. Building the features section - Part 1
14m 47s
9. Building the features section - Part 2
17m 42s
10. Building the favorite meals section - Part 1
12m 7s
11. Building the favorite meals section - Part 2
11m 18s
12. Building the how-it-works section - Part 1
8m 27s
13. Building the how-it-works section - Part 2
17m 12s
14. Building the cities section - Part 1
12m 20s
15. Building the cities section - Part 2
15m 56s
16. Building the customer testimonials section - Part 1
5m 49s
17. Building the customer testimonials section - Part 2
15m 7s
18. Building the sign-up section - Part 1
9m 38s
19. Building the sign-up section - Part 2
18m 38s
20. Building the contact form form - Part 1
16m 16s
21. Building the contact form form - Part 2
9m 11s
22. Building the footer - Part 1
6m 19s
23. Building the footer - Part 2
17m 54s

Responsive web design with media queries

1. Making the webpage responsive - Part 1
19m 7s
2. Making the webpage responsive - Part 2
21m 30s
3. A note about web browsers
12m 27s

Let's add some cool effects

1. Introduction to jQuery
8m 47s
2. Building a “sticky” navigation - Part 1
12m 16s
3. Building a “sticky” navigation - Part 2
10m 25s
4. Scrolling to elements
9m 52s
5. Adding animations on scroll
14m 15s
6. Making the navigation responsive
19m 31s

Optimizing and launching our website

1. Final touch: creating a favicon
4m 43s
2. Performance optimization: site speed
11m 50s
3. Basic search engine optimization (SEO)
8m 2s
4. Let’s launch our webpage!
8m 59s
5. Google Analytics
4m 50s

BONUS lectures

1. Super effective ways to improve your website’s conversion
4m 4s
2. Adding a map to the Omnifood website
18m 32s
3. Using PHP to make our form work
22m 54s