Web Wonders – A Web Designing Basics Course

This hands-on summer Course introduces kids and teens to the exciting world of web designing. Students will learn to build their own websites from scratch using HTML, CSS, and JavaScript. The course blends creativity and coding, helping young learners turn their ideas into real, interactive web pages.

Through guided lessons and fun mini-projects, participants will master web layout, styling, interactivity, and responsive design. They’ll create their own personal webpages, blogs, or image galleries—while learning how websites work, how to structure content, and how to make their creations mobile-friendly and visually appealing.

Course Information

This Web Designing course is a beginner-friendly, interactive learning experience designed for kids and teens. Participants will explore the core technologies behind websites—HTML, CSS, and JavaScript—while developing real, functional web projects.

What Will You Learn?


This beginner-friendly program covers everything from creating a basic webpage to adding interactivity and making sites responsive for mobile devices. By the end, students will walk away with their own personal projects and the skills to continue building online.

  1. Understanding how websites work and the roles of HTML, CSS, and JavaScript
  2. Creating web pages with text, images, links, and structure using HTML
  3. Styling websites with CSS: colors, fonts, layout, and box model
  4. Using classes and divs to organize content and layout
  5. Adding interactivity using JavaScript (buttons, dynamic content)
  6. Creating personal profiles, blogs, or galleries as final projects
  7. Introduction to responsive design for mobile and tablet screens
  8. Using media queries and flexible units for better design
  9. Presenting finished websites in a final showcase session

Requirements


No prior coding experience is required—just curiosity and creativity!

  1. Suitable for ages 10–17 (adaptable to age and skill level)
  2. Students must bring a laptop (basic Windows/macOS is fine)
  3. All software and resources will be provided or available online for free
  4. Optional: Notebook or sketchpad for layout and design ideas
  • Day 1: Introduction to Web Designing
    Students will explore what a website is and how it works, understand the difference between HTML, CSS, and JavaScript, and learn how to create a simple HTML page using basic tags like <!DOCTYPE html>, <html>, and <body>. Practice activity includes building a basic “About Me” webpage.
  • Day 2: HTML Tags & Structure
    Students will learn common HTML tags like headings, paragraphs, links, images, and lists. They’ll practice adding external links, images, and create internal navigation for a small website. Mini project: Build a simple webpage with text, image, and navigation sections.
  • Day 3: Intro to CSS – Styling Your Page
    Students will be introduced to CSS and how it connects to HTML. They'll learn to style text, background, fonts, and explore the box model (padding, borders, margins). Practice activity includes styling the “About Me” page created earlier with custom colors and fonts.
  • Day 4: CSS Layouts & Positioning
    This section focuses on layout techniques using display properties (block, inline, inline-block), <div> elements, and CSS classes. Students will create a basic page structure with header, footer, and sections. Mini project: Create a styled personal profile card.
  • Day 5: Personal Webpage Project – Part 1
    Students will begin building a personal webpage or mini portfolio. They’ll plan the structure, add sections like About, Hobbies, and Projects, and style the page using CSS. Homework includes adding images and finalizing the layout.
  • Day 6: Introduction to JavaScript
    An introduction to JavaScript where students learn how to embed scripts into HTML and use basic functions like alert() and console.log(). They'll also create simple variables. Practice includes adding a greeting popup or console message on page load.
  • Day 7: JavaScript Interactivity & Events
    Students dive deeper into JavaScript by working with variables (let, const), and data types. They'll learn how to add interactivity using button click events and basic DOM manipulation. Mini project: Add a “Like” button or change background color on click.
  • Day 8: Responsive Design Basics
    Students will learn the fundamentals of responsive design, including mobile-first layouts, media queries, and the use of flexible units like %, vh, and vw. Practice activity includes making their profile or personal webpage mobile-friendly.
  • Day 9: Final Project – Blog or Gallery
    Students will choose between building a blog layout (with post titles and content sections) or a photo gallery (with hover effects and captions). They will use HTML, CSS, and basic JavaScript to complete the structure and styling.
  • Day 10: Project Completion & Showcase
    Students will finalize their web projects (blog, gallery, or personal webpage), apply finishing touches like responsiveness and interactivity, and present them to the class. Digital certificates or badges will be awarded at the end of the showcase.
Batch Start Date Timing Days Mode

Custom Batch Time

Course price

₹1,500
₹3,000