Design A Complete Responsive Website From Scratch Using HTML5 CSS & JS | Beginners Guide | Godson Thomas | Skillshare

Design A Complete Responsive Website From Scratch Using HTML5 CSS & JS | Beginners Guide

Godson Thomas, Full Stack Web Developer

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
54 Lessons (3h 32m)
    • 1. Course Introduction

      3:40
    • 2. How The Course Is Structured

      1:36
    • 3. Code Editor & Useful Extensions

      3:22
    • 4. Planning The Website: Wireframe, Colors & Fonts

      3:14
    • 5. Designing A Logo

      0:53
    • 6. Get Free Images & Videos For Websites

      0:45
    • 7. What Is HTML?

      1:12
    • 8. Creating An HTML File

      1:37
    • 9. Headings & Paragraphs

      3:09
    • 10. HTML5 Boilerplate

      3:48
    • 11. Nest Tags

      2:05
    • 12. Line Breaks & Horizontal Rules

      1:34
    • 13. Images

      2:11
    • 14. Anchor Tags

      2:47
    • 15. Divs & Spans

      4:22
    • 16. Lists

      3:01
    • 17. Tables

      2:23
    • 18. Forms

      3:19
    • 19. Radio Buttons & Dropdowns

      3:12
    • 20. HTML5 Semantic Tags

      2:01
    • 21. Audio & Video

      4:34
    • 22. CSS Introduction

      1:21
    • 23. Ways To Add CSS

      3:06
    • 24. CSS Selectors

      8:36
    • 25. CSS Properties

      5:56
    • 26. Pseudo Selectors

      6:07
    • 27. Display Properties

      5:56
    • 28. Box Model

      5:39
    • 29. CSS Specificity

      7:32
    • 30. Brief Introduction To JavaScript

      5:12
    • 31. Creating The Files For Our Website

      2:58
    • 32. Markup For Header

      3:16
    • 33. Styling The Header

      7:17
    • 34. Markup For Navbar

      1:38
    • 35. Styling The Navbar

      7:09
    • 36. Markup For The About Section

      2:27
    • 37. Styling The About Section

      1:56
    • 38. Markup For The Work Section

      3:40
    • 39. Styling The Work Section

      5:53
    • 40. Adding JavaScript To Work Section

      5:20
    • 41. Markup For The Testimonials Section

      2:41
    • 42. Styling The Testimonials Section

      1:54
    • 43. Coding The Functionality of The Slider

      4:17
    • 44. Designing Contact Section

      2:51
    • 45. Designing The Footer

      3:22
    • 46. Updating Navbar Links & Smooth Scrolling

      7:23
    • 47. Adding Responsiveness

      10:59
    • 48. Mobile Navigation

      6:52
    • 49. Testing & Bug Fixing

      3:43
    • 50. Hosting Our Website

      3:36
    • 51. Making The Contact Form Work

      3:46
    • 52. Web Design Exercise

      0:45
    • 53. Web Design Exercise Solution (Time-lapse)

      12:06
    • 54. What Next?

      2:09
14 students are watching this class

About This Class

Welcome to this class.

In this class, I will show you how I design a complete website from scratch by using HTML5, CSS, and JavaScript. You will learn everything right from planning your website by drawing the wireframe, selecting the color scheme, fonts, etc. to actually hosting your website online so that everyone on the internet can visit your website.

We will design this website.

e47e47b8

Let me first tell what are the benefits of taking this class:

  • Learn HTML5 and CSS which are the building blocks of web designing.
  • Learn about the web design process.
  • Learn to create a responsive website.
  • Learn how to use 3rd party libraries.
  • Learn how to deploy your website for free.
  • Improve your knowledge by complete a web design exercise.

Who is this class for?

  • Absolute beginners in web designing
  • Anyone wanting to design their own responsive website from scratch.

I have divided this class into several sections.

First Section: consists of an introduction to the class. It also consists of how to plan your website before getting started with actually designing the website.

Second Section: is a crash course on HTML5

Third Section: is a crash course on CSS

Fourth Section: is where we will start designing the website.

I hope that this course will help you learn HTML5 and CSS so that you can design any type of static website.

Happy coding!