Step 01

Semantic HTML5 Structure

Sabse pehle hum website ka skeleton banate hain. Semantic tags (header, section, footer) SEO ke liye bohot zaroori hain.

<section class="hero">
  <h1>Welcome to SWITS</h1>
  <p>Start your IT journey today.</p>
  <button>Enroll Now</button>
</section>

Welcome to SWITS

Start your IT journey today.

Step 02

CSS ke zariye hum plain HTML ko ek professional look dete hain. Yahan hum Flexbox aur custom colors ka use karenge.

.hero {
  background: #13382C;
  color: #C48C1D;
  padding: 40px;
  text-align: center;
  border-radius: 20px;
}

Start your IT journey today.

Step 03

JavaScript se hum user ke clicks aur actions ko control karte hain. Isse site "zinda" ho jati hai.

const btn = document.querySelector('button');
btn.addEventListener('click', () => {
   alert('Admission Open!');
});

System Alert: Admission Open!