0
Trainer Name

Jonas Schmedtmann

Skill Area

Digital Technologies and Digital Transformation

Reviews

4.8 (18 Rating)

Course Requirements

- No coding or design experience necessary
- Any computer works — Windows, macOS or Linux
- You don’t need to buy any software — we will use the best free code editor in the world

Course Description

What if you knew exactly how to design and build a website like that, completely from scratch? How amazing would that be?

Well, I'm here to teach you HTML, CSS, and web design, all by building the stunning website that you just saw, step-by-step.

So, after finishing this course, you will know exactly how to build a beautiful, professional, and ready-to-launch website just like Omnifood, by following a 7-step process. And it will even look great on any computer, tablet, and smartphone.

But what if you want to build a completely different website? Well, no problem! I designed the course curriculum with exactly this goal: to enable you to design and build any website that you can think of, not just copy the course project.

Course Outcomes

1. Become a modern and confident HTML and CSS developer, no prior knowledge needed!

2. Design and build a stunning real-world project for your portfolio from scratch

3. Modern, semantic and accessible HTML5

4. Modern CSS (previous CSS3), including flexbox and CSS Grid for layout

5. Important CSS concepts such as the box model, positioning schemes, inheritance, solving selector conflicts, etc.

6. A web design framework with easy-to-use rules and guidelines to design eye-catching websites

7. How to plan, sketch, design, build, test, and optimize a professional website

8. How to make websites work on every possible mobile device (responsive design)

9. How to use common components and layout patterns for professional website design and development

10. Developer skills such as reading documentation, debugging, and using professional tools

11. How to find and use free design assets such as images, fonts, and icons

12. Practice your skills with 10+ challenges (solutions included)

Course Curriculum

1 Lets Start This Amazing Journey!


2 Our main tool Brackets


3 What is HTML


4 Starting to fill the structure


5 The structure of an HTML document


6 Images and attributes


7 One more thing links


8 Introduction to web design


9 Beautiful typography


10 Using colors like a pro


11 Working with images


12 Getting started with CSS


13 Working with icons


14 Spacing and layout


15 Starting to make our webpage pretty text


16 Introduction to user experience


17 Colors


18 Classes and ID_s


19 Getting inspired the secret ingredient for stunning web design


20 The CSS box model


21 Polishing our blog post


22 Building the favorite meals section


23 Relative vs. Absolute


24 Building a simple layout


25 Getting started with the Chrome Developer Tools


26 Building the cities section


27 Building the sign-up section


28 Building the contact form


29 The 7 real-world steps to a fully functional website


30 Starting to put the 7 steps into action


31 First development steps


32 Setting up the fluid grid for responsive web design


33 Building the header - Part 1


34 Building the header - Part 3


35 Building the features section - Part 1


36 Building the features section - Part 2


37 Building the favorite meals section - Part 2


38 Building the how-it-works section - Part 1


39 Building the how-it-works section - Part 2


40 Building the customer testimonials section - Part 1


41 Building the customer testimonials section - Part 2


42 Building the sign-up section - Part 1


43 Building the contact form form - Part 2


44 Building the footer - Part 1


45 Building the footer - Part 2


46 Making the webpage responsive - Part 2


47 Making the webpage responsive - Part 1


48 A note about web browsers


49 Making the navigation responsive


50 Introduction to jQuery


51 Building a “sticky” navigation - Part 1


52 Building a “sticky” navigation - Part 2


53 Scrolling to elements


54 Adding animations on scroll


55 Final touch creating a favicon


56 Performance optimization site speed


57 Basic search engine optimization (SEO)


58 Let’s launch our webpage!


59 Google Analytics


60 You made it! Congratulations!


61 What’s New in CSS A Quick Intro to Flexbox, Part 1


62 What’s New in CSS A Quick Intro to Flexbox, Part 2


63 Using PHP to make our form work


64 Super effective ways to improve your website’s conversion


Learner Feedback

Build Responsive Real World Websites with HTML5 and CSS3

5

Course Rating
75.00%
25.00%
0.00%
0.00%
0.00%

Log In or Sign Up as learner to post a review

Shopping Cart

Loading...