Video description
Responsive web design is about creating web pages that look good on all devices. A responsive web design helps automatically adjust for different screens to make it user friendly.
This course touches on each important topic through concept explanation, documentation, and implementation. The entire course is designed for beginners with one goal in mind—to build responsive websites using HTML5, CSS3, Bootstrap, and SASS.
Throughout the course, we will explore 6 projects namely Profile Card, Login Page, Spotify Clone using Flexbox, Testimonial Page using CSS Grid, Portfolio Website using Bootstrap, and EdTech Startup Landing Page. With the help of these projects, we will understand the following topics:
-How does the web work
-HTML fundamentals
-HTML semantics
-CSS fundamentals
-Responsive design
-Layouts
-SVG
-CSS libraries
-Bootstrap (CSS framework)
-SASS (CSS preprocessor)
-Website deployment
The complete course is focused on the concept learning approach; you learn every concept through a logical and visual learning approach. Learn all the important concepts in the simplest viable way with examples and real-life projects.
By the end of the course, you will be ready to work as an intern, fresher, or freelancer, and you will also be able to implement everything yourself. Most importantly, you will be ready to dive deep with future practice and hard-level questions about website building.
What You Will Learn
- Learn website structuring with semantic and accessible HTML5
- Use common components, utilities, and layout patterns for professional website development
- Learn how to use each skill in the real world with project implementations
- Learn to find free design assets such as images, fonts, and icons
- Learn to support any device size with responsive design (mobile, tablets, and desktop)
- Website deployment on the web using Netlify
Audience
This course is helpful for absolute beginners who want to learn how to build a beautiful and responsive website; designers who want to expand their skill set into HTML5, CSS3, Bootstrap, and SASS.
No previous programming or coding experience is required; we will cover everything step-by-step from the basics.
About The Author
Shubham Sarda: Shubham is a software developer and digital marketer with a passion for teaching. He has worked with many funded start-ups, self-projects, and as a top-rated freelancer on multiple marketplaces. Currently, he stands among the top 700 freelancers with over 2,500+ projects on Fiverr, PeoplePerHour, Freelancer, and more.
As an instructor, he has taught programming and digital marketing to over 20,000 students, both with online courses and offline bootcamps. He has mastered explaining complex topics in the simplest form that is easy to understand and follow. His video courses are also used by companies to train their employees and by colleges to prepare and upgrade their students according to the latest industry requirements.
Table of contents
- Chapter 1 : Introduction
- Chapter 2 : Resources and Setup
- Chapter 3 : HTML Fundamentals
- Chapter 4 : HTML Semantics
- Chapter 5 : CSS Fundamentals 1.0
- Chapter 6 : CSS Fundamentals 2.0
- Chapter 7 : CSS Fundamentals 3.0 (Display and Positions)
- Chapter 8 : CSS Fundamentals 4.0 (Responsive Web Design)
- Chapter 9 : Project 1 – Profile Card
- Chapter 10 : Project 2 – Login Page
- Chapter 11 : Layout 1 – Flexbox
- Chapter 12 : Project 3 – Spotify Clone Using Flexbox
- Chapter 13 : CSS Advanced 1.0
- Chapter 14 : CSS Advanced 2.0 (SVG – Scalable Vector Graphics)
- Chapter 15 : CSS Advanced 3.0 (Transition and Animation)
- Chapter 16 : Layout 2 – CSS Grid
- Chapter 17 : Browser Compatibility
- Chapter 18 : Project 4 – Testimonial Page Using CSS Grid
- Chapter 19 : SASS – CSS Preprocessor
-
Chapter 20 : Project Setup
- Bootstrap Introduction - Project Demo
- Utilities
- Layouts - Container, Grid
- Layouts - Container, Grid part 2
- Components
- Portfolio Project: Main Section
- Portfolio Project: About/Blog Section
- Portfolio Project: Contact Section
- Portfolio Project: Footer
- Portfolio Project: Project Section
- Project Completion
-
Chapter 21 : Project 6 – EdTech Startup Landing Page
- EdTech Landing Page
- Initial Project Setup
- Navigation
- Banner Section I
- Banner Section II
- Transition, Transform, Animation
- Building Theme
- Stats Section I
- Stats Section II (Flexbox)
- Information Section
- Working Section (CSS Grid)
- Footer (SVG)
- Animate CSS (CSS Library)
- Scroll Bars
- Responsiveness I - Media Queries
- Responsiveness II - Media Queries
- Hamburger Menu I
- Hamburger Menu II
- Chapter 22 : Deployment – Your Website on the Web
- Chapter 23 : Course Conclusion
Product information
- Title: Build Responsive Websites with HTML5, CSS3, Bootstrap, and SASS
- Author(s):
- Release date: January 2022
- Publisher(s): Packt Publishing
- ISBN: 9781803239477
You might also like
video
Modern Web Design with HTML5, CSS3, and JavaScript
Responsive websites are the future. They allow your site to adapt to different screen sizes, which …
video
10 Mega Responsive Websites with HTML, CSS, and JavaScript
In this course, we will build together 10 mega and complete responsive websites with three core …
book
Practical Bootstrap: Learn to Develop Responsively with One of the Most Popular CSS Frameworks
Learn to use one of the most popular CSS frameworks and build mobile-friendly web pages. Used …
video
HTML & CSS JumpStart
8+ Hours of Video Instruction More than 8 hours of video instruction for people interested in …