Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Subscribe
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Responsive Website from Scratch using Html CSS & Javascript
Rating: 4.5 out of 5(15 ratings)
52 students

Responsive Website from Scratch using Html CSS & Javascript

How to Make an attractive and responsive website from scratch for all devices by using HTML5 CSS3 and Javascript
Created byMd Irshad Ansari
Last updated 12/2020
English

What you'll learn

  • Responsive Web Design Tutorial
  • Web Design Responsive Website Template from Scratch HTML CSS
  • Build Responsive Real World Websites with Html CSS & Javascript
  • How to build a responsive HTML5 website Step by Step
  • Learn Responsive Web Development from Scratch
  • Create a Responsive Website Using HTML, CSS & JavaScript ...
  • Mastering Responsive Website Design with HTML, CSS, and JavaScript

Course content

1 section • 13 lectures • 1h 52m total length

  • Introduction4:52

    Build a fully responsive website from scratch using html, css, and javascript, with a hero, sections, a top logo, a right-side menu, and a contact form.

  • Project Setup3:44

    Set up a responsive website project by organizing a folder with images and resources, connecting styles and assets, and opening the folder in an editor to preview the live site.

  • Include Custom Font From Google2:42

    Learn how to include a custom font from Google fonts, using the Poppins family, by selecting a style, copying the font family name, and applying it to your site.

  • CSS Flex7:35

    Explore how CSS flexbox centers content and aligns items, arranges boxes in rows or columns, and adjusts gaps to build layouts.

  • Website Banner Section7:55

    Create a responsive website banner section using HTML and CSS, center content, apply a background image with cover, and style text and a button.

  • Header Section11:26

    Explore building a responsive header section from scratch using html, css, and javascript, including a sticky top navigation with a logo, menu alignment, and scroll-driven style changes.

  • About Us Section6:46

    Build an about us section with a responsive side-by-side layout using display flex and space-between. Align images, set width percentages, style the title color, and trim the paragraph.

  • Our Menu Section9:24

    Build the main menu section of a responsive website using html, css, and javascript, adding menu items, text, images, and a bottom button with a centered flex layout.

  • Expert Section5:45

    Add an expert section to the webpage by duplicating content boxes, applying class content, and adjusting image and text properties for proper alignment and margins.

  • Testimonial Section11:16

    Create a testimonial section for the website using a flex layout, background image, and styled title and paragraph blocks, adjusting colors and margins for clear content presentation.

  • Contact Us Section11:22

    Create a contact section with a contact class, including a form with name and email inputs, a textarea, and a submit button, styled against a background image.

  • Add Smooth Scrolling2:33

    Add a smooth scrolling effect for menu links so the page scrolls to the corresponding sections, including banner, testimonials, and contact, enhancing user navigation.

  • Make It Responsive26:53

    Learn to make this website responsive by adjusting padding, margins, and navigation with a toggle, plus click events and layout tweaks.

Requirements

  • Basic knowledge of html css and javascript
  • Any Code Editor Of Your Choice
  • An Internet Connection

Description

In this comprehensive online course, immerse yourself in the art of building dynamic and visually stunning websites that seamlessly adapt to any screen size. Through a hands-on approach, this course equips you with the essential skills needed to create responsive web designs using the power of HTML, CSS, and JavaScript.

Discover the fundamentals of creating flexible and fluid layouts, and dive into the intricacies of media queries and responsive design patterns. Learn how to craft compelling user experiences by implementing interactive elements and animations with JavaScript. Gain a deep understanding of the principles of mobile-first design and the latest techniques for ensuring optimal performance across all devices.

Throughout the course, you'll work on real-world projects, honing your ability to create captivating, user-friendly websites that function flawlessly on desktops, tablets, and mobile devices. With expert guidance from seasoned professionals, you'll grasp the nuances of cross-browser compatibility, accessibility, and best practices for search engine optimization (SEO) to ensure your websites are both aesthetically pleasing and highly functional.

Whether you're a seasoned developer looking to expand your skill set or a newcomer to the world of web development, this course provides a solid foundation in responsive website design, empowering you to create cutting-edge, responsive websites that leave a lasting impression on users across all platforms.

Enroll now and unlock the potential to craft engaging and adaptable web experiences that captivate audiences worldwide.

Who this course is for:

  • Responsive Web Design
  • Create Responsive Website Using HTML5 CSS3
  • Learn Web Development Courses and Tutorials
  • Responsive website design from scratch 2021
  • Web Design For Beginners
  • Web Design HTML CSS Create Single Page Website from Scratch
  • Front End Web Development
  • Build a real world responsive website

Report abuse