🎧 New: AI-Generated Podcasts Turn your study notes into engaging audio conversations. Learn more

HTML टैग्स और सेमेंटिक एलिमेंट्स
8 Questions
0 Views

HTML टैग्स और सेमेंटिक एलिमेंट्स

Created by
@EnhancedStonehenge3538

Podcast Beta

Play an AI-generated podcast conversation about this lesson

Questions and Answers

वेब पेज की संरचना और सामग्री को परिभाषित करने के लिए इस्तेमाल किए जाने वाले कीवर्ड या वाक्यांश क्या हैं?

  • CSS स्टाइल
  • सेमेंटिक एलिमेंट
  • जावास्क्रिप्ट फंक्शन
  • HTML टैग (correct)
  • खुला टैग और बंद टैग क्या हैं?

  • HTML टैग के प्रकार (correct)
  • एक तरह का टैग जो खुला और बंद होता है
  • एक तरह का टैग जो सिर्फ खुला होता है
  • सेमेंटिक एलिमेंट के प्रकार
  • सेमेंटिक एलिमेंट क्या हैं?

  • वेब पेज की संरचना और सामग्री को परिभाषित करने वाले टैग
  • वेब पेज की सामग्री को और अधिक सुलभ बनाने वाले टैग (correct)
  • वेब पेज के संरचना और सामग्री को और अधिक परिभाषित करने वाले टैग
  • वेब पेज की दृश्य लेआउट को परिभाषित करने वाले टैग
  • रеспॉन्सिव डिजाइन क्या है?

    <p>वेब पेज को अलग-अलग स्क्रीन आकार और डिवाइस के लिए अनुकूलित करने के लिए इस्तेमाल की जाने वाली तकनीक</p> Signup and view all the answers

    मीडिया क्वेरीज़ क्या हैं?

    <p>रеспॉन्सिव डिजाइन में इस्तेमाल की जाने वाली तकनीक</p> Signup and view all the answers

    फ्लूイड ग्रिड क्या है?

    <p>रеспॉन्सिव डिजाइन में इस्तेमाल की जाने वाली तकनीक</p> Signup and view all the answers

    सेमेंटिक एलिमेंट के क्या फायदे हैं?

    <p>वेब पेज की सुलभता और एसईओ में सुधार</p> Signup and view all the answers

    रеспॉन्सिव डिजाइन के क्या फायदे हैं?

    <p>वेब पेज की सुलभता और उपयोगकर्ता अनुभव में सुधार</p> Signup and view all the answers

    Study Notes

    HTML Tags

    • Definition: HTML tags are keywords or phrases surrounded by angle brackets (<>) that define the structure and content of a web page.
    • Types:
      • Opening tags: `` (e.g., <p>)
      • Closing tags: </p> (e.g., ``)
      • Self-closing tags: `` (e.g., <br>)
    • Examples:
      • Headings: , , ``, etc.
      • Paragraphs: <p>
      • Links: <a>
      • Images: ``
      • Lists: </a></p><a>, </a><a>, ``

    Semantic Elements

    • Definition: HTML semantic elements provide meaning to the structure of a web page, making it easier for search engines and screen readers to understand the content.
    • Examples:
      • Headers: , , ``
      • Content sections: , , ``
      • Figures and captions: ,
      • Table elements: , , , , ``
    • Benefits:
      • Improved search engine optimization (SEO)
      • Enhanced accessibility for screen readers and other assistive technologies
      • Better code readability and maintainability

    Responsive Design

    • Definition: Responsive design is an approach to web development that focuses on creating websites that adapt to different screen sizes and devices.
    • Key concepts:
      • Media queries: Used to define different styles for different screen sizes and devices
      • Flexible grids and images: Use relative units (e.g., %, em, rem) to scale elements
      • Mobile-first design: Design for small screens first, then add complexity for larger screens
    • Techniques:
      • Fluid grids: Use relative units to create flexible grid systems
      • Responsive images: Use srcset and sizes attributes to load appropriate image sizes
      • Breakpoints: Define specific screen sizes to apply different styles
    • Benefits:
      • Improved user experience across different devices and screen sizes
      • Increased mobile traffic and engagement
      • Better search engine rankings due to improved user experience

    HTML टैग

    • HTML टैग वेबसाइट की संरचना और सामग्री को परिभाषित करने के लिए कीवर्ड या वाक्यांश हैं जो कोणीय ब्रैकेट्स में घिरे हुए हैं।
    • प्रकार:
      • ओपनिंग टैग: &lt; (उदाहरण: ``)
      • क्लोजिंग टैग: (उदाहरण:)
      • सेल्फ-क्लोजिंग टैग: (उदाहरण:)
    • उदाहरण:
      • हेडिंग: , , ``, इत्यादि
      • पैराग्राफ: ``
      • लिंक: ``
      • इमेज: ``
      • सूची: , , ``

    सेमान्टिक एलिमेंट्स

    • सेमान्टिक एलिमेंट्स वेबसाइट की संरचना को अर्थ प्रदान करते हैं, जिससे सर्च इंजन और स्क्रीन रीडर्स के लिए सामग्री को समझना आसान हो जाता है।
    • उदाहरण:
      • हेडर्स: , , ``
      • कंटेंट सेक्शन: , , ``
      • फिगर और कैप्शन: ,
      • टेबल एलिमेंट्स: , , , , ``
    • लाभ:
      • बेहतर सर्च इंजन ऑप्टिमाइज़ेशन (एसईओ)
      • स्क्रीन रीडर्स और अन्य सहायक तकनीकों के लिए बेहतर एक्सेसिबिलिटी
      • बेहतर कोड रीडेबिलिटी और मेंटेनेंस

    रेस्पॉन्सिव डिज़ाइन

    • रेस्पॉन्सिव डिज़ाइन एक वेबसाइट विकास दृष्टिकोण है जो विभिन्न स्क्रीन साइज़ और डिवाइसेस के लिए समायोजन करता है।
    • प्रमुख अवधारणाएं:
      • मीडिया क्वेरी: अलग-अलग स्क्रीन साइज़ और डिवाइसेस के लिए अलग-अलग स्टाइल्स परिभाषित करने के लिए प्रयोग किया जाता है
      • फ्लेक्सिबल ग्रिड्स और इमेज: स्केलिंग एलिमेंट्स के लिए रिलेटिव यूनिट्स (उदाहरण: %, em, rem) का उपयोग करें
      • मोबाइल-फ़र्स्ट डिज़ाइन: छोटे स्क्रीन साइज़ के लिए डिज़ाइन करें, फिर बड़े स्क्रीन साइज़ के लिए जटिलता जोड़ें
    • तकनीकें:
      • फ्लेक्सिबल ग्रिड्स: रिलेटिव यूनिट्स का उपयोग करके फ्लेक्सिबल ग्रिड सिस्टम बनाना
      • रेस्पॉन्सिव इमेज: srcset और sizes विशेषताओं का उपयोग करके उपयुक्त छवि साइज़ लोड करना
      • ब्रेकपॉइंट्स: विशिष्ट स्क्रीन साइज़ पर अलग-अलग स्टाइल्स áppl
    • लाभ:
      • अलग-अलग डिवाइसेस और स्क्रीन साइज़ पर बेहतर यूज़र एक्सपीरियंस
      • मोबाइल ट्रैफ़िक और इंगेजमेंट में वृद्धि
      • बेहतर सर्च इंजन रैंकिंग के कारण अच्छा यूज़र एक्सपीरियंस

    Studying That Suits You

    Use AI to generate personalized quizzes and flashcards to suit your learning preferences.

    Quiz Team

    Description

    इस क्विज में HTML टैग्स और सेमेंटिक एलिमेंट्स की मूल बातें समझाइ गई हैं. टैग्स के प्रकार और उदाहरण दिए गए हैं. साथ ही सेमेंटिक एलिमेंट्स की परिभाषा और उनके उपयोग के बारे में बताया गया है.

    Use Quizgecko on...
    Browser
    Browser