Bilkul, yahan HTML ke sare tag ke sath Semantic elements ka upyog kaise kiya jata hai, uske liye ek step-wise lekh diya gaya hai Hindi mein:
### कदम 1: `<html>` टैग का उपयोग
HTML डॉक्यूमेंट की शुरुआत `<html>` टैग से होती है। यह डॉक्यूमेंट को HTML में परिभाषित करता है।
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>सेमैंटिक HTML उदाहरण</title>
</head>
<body>
```
### कदम 2: `<header>` टैग का उपयोग
`<header>` टैग का उपयोग वेबपेज के हैडर सेक्शन को परिभाषित करने के लिए होता है। यह नेविगेशन लिंक्स, लोगो, या कोई भी हैडर सामग्री शामिल करने के लिए इस्तेमाल होता है।
```html
<header>
<h1>वेबसाइट का नाम</h1>
<nav>
<ul>
<li><a href="#">होम</a></li>
<li><a href="#">बारे में</a></li>
<li><a href="#">संपर्क</a></li>
</ul>
</nav>
</header>
```
### कदम 3: `<main>` टैग का उपयोग
`<main>` टैग वेबपेज का मुख्य सामग्री क्षेत्र परिभाषित करता है। यह आर्टिकल, सेक्शन, या कोई भी महत्वपूर्ण सामग्री को लपेटने के लिए इस्तेमाल होता है।
```html
<main>
<article>
<h2>आर्टिकल का शीर्षक</h2>
<p>आर्टिकल की सामग्री यहां लिखी जाएगी...</p>
</article>
<section>
<h2>सेक्शन 1</h2>
<p>सेक्शन 1 की सामग्री यहां लिखी जाएगी...</p>
</section>
<section>
<h2>सेक्शन 2</h2>
<p>सेक्शन 2 की सामग्री यहां लिखी जाएगी...</p>
</section>
</main>
```
### कदम 4: `<footer>` टैग का उपयोग
`<footer>` टैग वेबपेज के फुटर सेक्शन को परिभाषित करता है। यह कॉपीराइट जानकारी, संपर्क विवरण, या कोई भी फुटर सामग्री शामिल करने के लिए इस्तेमाल होता है।
```html
<footer>
<p>© 2024 वेबसाइट का नाम. सभी अधिकार सुरक्षित।</p>
<p>संपर्क: contact@example.com</p>
</footer>
</body>
</html>
```
इस तरह से, आप HTML टैग्स के साथ Semantic elements का उपयोग करके अपनी वेबपेज को संरचित तौर पर लिख सकते हैं, जिससे सर्च इंजन्स और डेवेलपर्स को सामग्री को समझने में आसानी हो।
` टैग का उपयोग
HTML डॉक्यूमेंट की शुरुआत `` टैग से होती है। यह डॉक्यूमेंट को HTML में परिभाषित करता है।
```html
वेबसाइट का नाम
आर्टिकल का शीर्षक
आर्टिकल की सामग्री यहां लिखी जाएगी...
सेक्शन 1
सेक्शन 1 की सामग्री यहां लिखी जाएगी...
सेक्शन 2
सेक्शन 2 की सामग्री यहां लिखी जाएगी...
