खोजें

शुक्रवार, 7 जून 2019



वेब पेज तैयार करना (Creating the Web Page)

  1. 1
    टेक्स्ट एडिटर (text editor) खोलें: विंडोज कंप्यूटर पर ज्यादातर नोटपैड (Notepad) या Notepad++ का इस्तेमाल होता है, वहीं मैक (Mac) यूजर्स ज्यादातर टेक्स्टएडिट (TextEdit) इस्तेमाल करते हैं:
    • विंडोज (Windows) - Start 
       खोलें, notepad या notepad++ लिखें और विंडो में सबसे ऊपर मौजूद Notepad या "Notepad++" क्लिक करें।
    • मैक (Mac) - Spotlight 
       क्लिक करें, textedit लिखें और रिजल्ट में सबसे ऊपर दिखने वाले TextEdit पर डबल-क्लिक करें।
  2. 2
    आपके डॉक्यूमेंट के टाइप को HTML सेट करें:<!DOCTYPE html> लिखें और ↵ Enterदबाएँ, फिर <html> लिखें और फिर से ↵ Enterदबाएँ। आखिर में, <head> लिखें और ↵ Enterदबाएँ। अब आपके डॉक्यूमेंट में सबसे ऊपर ऐसा नजर आएगा:[१]
    <!DOCTYPE html>
<html>
<head>
    3. 

    1. 
3  आपके वेब पेज के लिए टैब टाइटल (title) तैयार करें: ये वही टाइटल है, जो आपके पेज को खोलने पर, आपको ब्राउज़र टैब पर (जैसे कि, "Facebook") नजर आएगा। <title> लिखें, आपके वेब पेज का टैब टाइटल एंटर करें, और फिर </title> लिखें। फिर आप इसी लाइन में एक बंद होता (क्लोजिंग) "Head" टैग, जो कि </head> है, एड करेंगे। टाइटल भाग कुछ ऐसा नजर आएगा:
      

      

      

      <title>My Web Page</title>
</head>

      

      

      

      

      

      

      

      2. 

    2. 
4
      

      
पेज के शुरुआती बॉडी (body) टेक्स्ट को दर्शाएँ: क्लोजिंग "Head" टैग के नीचे <body>लिखें। इससे इस बात की पुष्टि होती है, कि अब आपके डॉक्यूमेंट पर लिखा हुआ सारा कुछ, तब तक वेबसाइट टेक्स्ट की तरह समझा जाएगा, जब तक कि आप "Body" टैग को बंद नहीं कर देते। अब आपके पास ये मौजूद होगा:
      

      

      

      <body>

      

      

      

      

      

      

      

      3. 

    3. 
5
      

      
पेज का शीर्षक (Heading) तैयार करें: आपका पेज शीर्षक, वही शीर्षक होगा, जो आपकी वेबसाइट में सबसे ऊपर नजर आएगा। इसे तैयार करने के लिए, <h1> लिखें, आपका शीर्षक लिखें और फिर इस टैग को </h1> से बंद कर दें। उदाहरण के लिए:
      

      

      

      <h1>Welcome to My Page!</h1>
      

      

      

      

      

      4. 

    

    

      

    1. 
कुछ अतिरिक्त शीर्षक एड करें: यहाँ पर ऐसे छह तरह के शीर्षक मौजूद हैं, जिन्हें आप <h1></h1> से लेकर <h6></h6> तक के टैग का इस्तेमाल करके तैयार कर सकते हैं। जैसे कि, बढ़ते हुए क्रम में, तीन अलग-अलग तरह के शीर्षक को तैयार करने के लिए, आपको ऐसा लिखना होगा:
      

      

      

      <h1>Welcome to My Page!</h1>
<h2>My name is Bob.</h2>
<h3>I hope you like it here.</h3>

      

      

      

      

      

      

      

      2. 

    2. 
7
      

      
एक पैराग्राफ तैयार करें: पैराग्राफ टैग का इस्तेमाल, लिखे हुए टेक्स्ट से अलग-अलग भाग तैयार करने में होता है। टेक्स्ट को पैराग्राफ में लिखने के लिए, <p> लिखें और फिर आपका टेक्स्ट लिखें, इसके बाद टैग को बंद करने के लिए </p> लिखें:
      

      

      

      <p>This is my paragraph.</p>

      

      

      

      

        

      • आप एक ही शीर्षक के अंतर्गत, पैराग्राफ की लाइन तैयार करने के लिए, एक ही सीध में बहुत सारी पैराग्राफ लाइन एड कर सकते हैं।
        • 

      

      

      

      

      3. 

    3. 
8
      

      
टेक्स्ट कलर बदलें: आप टेक्स्ट को <font color="color"></font> टैग के साथ लिखकर, किसी भी टेक्स्ट का कलर बदल सकते हैं, बस यहाँ पर "color" भाग (कोट्स/quotes को भी साथ में रखें) में आपके पसंदीदा कलर को लिख दें। उदाहरण के लिए, किसी पैराग्राफ को नीले रंग में बदलने के लिए, आपको ऐसा लिखना होगा:[२]
      

      

      

      <p><font color="blue">Whales are majestic creatures.</font></p>

      

      

      

      

        

      • आप टैग्स की इन जोड़ी के द्वारा किसी भी टेक्स्ट (जैसे कि, हैडर/headers) को किसी भी कलर में बदल सकते हैं।
        • 

      • HTML, रंगो के काफी सारे प्रकार को सपोर्ट करता है, तो फिर किसी भी तरह के रंगों को इस्तेमाल करने से घबराएँ नहीं।
        • 

      

      

      

      

      4. 

    4. 
9
      

      
टेक्स्ट को बोल्ड (bold), इटैलिक (italic) या अंडरलाइनिंग (underlining) फॉर्मेट दें: Boldटेक्स्ट, italic टेक्स्ट और अंडरलाइन्ड (underlined) टेक्स्ट को क्रमशः <b></b> टैग, <i></i> टैग्स, और <u></u> टैग्स के द्वारा तैयार किया जा सकता है। आप सबस्क्रिप्ट (subscript) टेक्स्ट (इनका इस्तेमाल स्क्वायर रूट के नंबर लिखे जाने में किया जाता है) और सुपरस्क्रिप्ट टेक्स्ट (superscript) टेक्स्ट (जिनका इस्तेमाल नंबर स्क्वायर के लिए होता है), को भी तैयार कर सकते हैं:[३]
      

      

      

      <b>Bold text</b>
<i>Italic text</i>
<u>Underlined text</u>
<sub>Subscript text</sub>
<sup>Superscript text</sup>

      

      

      

      

      

      

      

      5. 

    5. 
10
      

      
पेज पर एक पिक्चर एड करें: आप वेब पेज पर किसी इमेज को सेट करने के लिए <img src="URL"></img> टैग्स इस्तेमाल कर सकते हैं। उदाहरण के लिए, यदि इमेज का यूआरएल (URL) "www.mypicture.com/lake" है, तो आप ऐसा लिखेंगे:
      

      

      

      <img src="www.mypicture.com/lake"></img>

      

      

      

      

      

      

      

      6. 

    6. 
11
      

      
किसी अन्य पेज को लिंक करना: आप <a href="link">link text</a>टैग की जोड़ी का इस्तेमाल करके, आपके वेबपेज पर किसी और वेबसाइट की लिंक एड कर सकते हैं, जहाँ पर link उस वेबसाइट का यूआरएल है, जिसे आप लिंक करना चाह रहे हैं और link text वो टेक्स्ट है, जो उस लिंक की तरह नजर आएगा। जैसे कि, फेसबुक (Facebook) को लिंक करने के लिए, आप ऐसा लिखेंगे:[४]
      

      

      

      <a href="www.facebook.com">This is the link to Facebook's website</a>.

      

      

      

      

      

      

      

      7. 

    7. 
12
      

      
वेब पेज के टैग को बंद कर दें: HTML पर मौजूद, <body> और <html> जैसे टैग, जो कि आपके डॉक्यूमेंट में सबसे ऊपर मौजूद होते हैं, उन्हें बंद करना भी जरूरी है, इन्हें बंद करने के लिए, डॉक्यूमेंट में सबसे नीचे ऐसा लिखें:
      

      

      

      </body>
</html>

      

      

      

      

      

      

      

      8. 

    8. 
13
      

      
आपके वेबपेज का अवलोकन करें: यदि जरूरत पड़े तो आप <body></body>टैग्स के बीच में चाहे जितने भी पैराग्राफ, शीर्षक और टेक्स्ट लिख सकते हैं। नीचे एक पूरे वेबपेज का उदाहरण दिया गया है:
      

      

      

      <!DOCTYPE html>
<html>
 
<head>
<title>wikiHow Fan Page</title>
</head>
 
<body>
 
<h1>Welcome to My Page!</h1>
<p>This is a fan page for wikiHow. Make yourself at home!</p>
 
<h2>Important Dates</h2>
<p><i>January 15, 2019</i> - wikiHow's Birthday</p>
 
<h2>Links</h2>
<p>Here is a link to wikiHow: <a href="www.wikihow.com">www.wikihow.com</a></p>
 
</body>
</html>

      

      

      

      

      

      

      

      9. 

    9. 
14
      

      
आखिरी में कुछ बदलाव करना: यदि आपको आखिर में आपके कोड में कुछ गलती नजर आती है, तो आगे बढ़ने से पहले उसमें सुधार कर लें। अब जैसे ही आपका HTML, आपके द्वारा सोचे अनुसार नजर आने लगता है, फिर आप अगले भाग की ओर बढ़ सकते हैं।
      

      10. 

    10. 

      
आपके वेबपेज को सेव करना और खोलना (Saving and Opening Your Web Page)
      

      

        

      1. 

        

        
1
        

        
मैक पर आपके डॉक्यूमेंट को एक प्लेन टेक्स्ट में बदलना: यदि आप मैक इस्तेमाल कर रहे हैं, तो स्क्रीन में सबसे ऊपर नजर आने वाले Format मेन्यू आइटम पर क्लिक करें, फिर सामने आने वाले ड्रॉप-डाउन मेन्यू में Make Plain Text क्लिक करें।
          

        • विंडोज (Windows) पर ये स्टेप ना तो जरूरी है और इसे कर पाना मुमकिन भी नहीं है।.
          • 

        

        

        

        

        2. 

      2. 

        

        
2
        

        
"Save" मेन्यू खोलें: अब क्योंकि आपने अभी आपके वेबपेज को लिखने के लिए एक नया टेक्स्ट डॉक्यूमेंट तैयार किया है, तो फिर अब आप इसे सेव करने के लिए Ctrl+S (विंडोज) या ⌘Command+S (मैक) दबा सकते हैं।
          

        • आप इसके लिए File क्लिक करके और फिर सामने आने वाले ड्रॉप-डाउन मेन्यू से Save As भी क्लिक कर सकते हैं। ये विंडोज और मैक दोनों ही कंप्यूटर पर काम करेगा।
          • 

        

        

        

        

        3. 

      3. 

        

        
3
        

        
आपके HTML डॉक्यूमेंट के लिए एक नाम एंटर करें: आप आपके इस डॉक्यूमेंट को जो भी नाम देना चाहते हैं, उसे "File name" (विंडोज) या "Name" (मैक) टेक्स्ट बॉक्स में लिख दें।
        

        

        

        4. 

      4. 

        

        
4
        

        
डॉक्यूमेंट फाइल टाइप को बदलें: अब आपको डॉक्यूमेंट को एक टेक्स्ट फाइल से एक HTML फाइल में बदलना होगा:
          

        • विंडोज (Windows) - "Save as type" ड्रॉप-डाउन बॉक्स पर क्लिक करें, All Files क्लिक करें और फिर फाइल के अंत में .html लिख दें।
          • 

        • मैक (Mac) - फाइलनेम के अंत में लिखे हुए .txt की जगह पर .html लिख दें।
          • 

        

        

        

        

        5. 

      5. 

        

        
5
        

        
Save क्लिक करें: ये विंडो में सबसे नीचे मौजूद होगा। ऐसा करते ही आपकी HTML फाइल तैयार हो जाएगी।
          

        • HTML फाइल्स आपकी डिफ़ॉल्ट ब्राउज़र पर खुलती हैं।
          • 

        

        

        

        

        6. 

      6. 

        

        
6
        

        
आपके टेक्स्ट एडिटर को बंद कर दें: अब इसके बाद से आप आपकी इस HTML फाइल को आपके वेब ब्राउज़र पर खोल सकते हैं और वहाँ से आपके वेबपेज को देख सकते हैं।
        

        

        

        7. 

      7. 

        

        
7
        

        
HTML डॉक्यूमेंट को ब्राउज़र पर खोलें:ज्यादातर आप ऐसा करने के लिए आपके HTML डॉक्यूमेंट पर डबल-क्लिक करें। यदि डॉक्यूमेंट पर डबल-क्लिक करने से वो नहीं खुल रहा है, तो ऐसा करें:
          

        • विंडोज (Windows) - डॉक्यूमेंट पर राईट-क्लिक करें, Open with चुनें और फिर आपकी पसंदीदा ब्राउज़र पर क्लिक करें।
          • 

        • मैक (Mac) - डॉक्यूमेंट पर एक बार क्लिक करें, File क्लिक करें और फिर Open With चुनें, इसके बाद आपकी पसंदीदा ब्राउज़र को चुनें।
          • 

        

        

        

        

        8. 

      8. 

        

        
8
        

        
यदि जरूरत हो, तो आपके HTML डॉक्यूमेंट को एडिट करें: आप आपके HTML पेज पर कुछ गलतियाँ देख सकते हैं। इसे बदलने के लिए, आप आपके HTML डॉक्यूमेंट के टेक्स्ट को बदल सकते हैं:
          

        • विंडोज पर, डॉक्यूमेंट पर राईट-क्लिक करके और फिर सामने आने वाले ड्रॉप-डाउन मेन्यू से Edit(यदि आपके पास Notepad++ इंस्टॉल हैं, तो यहाँ पर आपको Edit with Notepad++ नजर आएगा) क्लिक करें।
          • 

        • मैक पर, डॉक्यूमेंट को चुनने के लिए, उस पर क्लिक करें, File क्लिक करें, Open With चुनें और फिर TextEdit क्लिक करें। आप उस डॉक्यूमेंट को ड्रैग करके टेक्स्टएडिट (TextEdit) पर ला सकते हैं।
          • 

        

        

        

        

        9. 

      9. 

          

        • यदि आप आपके पेज में इमेज को सेंटर में रखना चाहते हैं, तो आप img टैग में आपकी इमेज के नाम के बाद <class="center"> (उदाहरण के लिए, <img src="URL" class="center">) लिख सकते हैं।
          • 

        • आप <marquee></marquee> टैग का इस्तेमाल करके, एक साइड स्क्रॉलिंग टैग तैयार कर सकते हैं, लेकिन एक बात का ध्यान रखें, कि ये टैग कुछ ब्राउज़र के द्वारा पहचाने नहीं जाते।
          • 

        • बहुत सारे लोग कोड लिखने और कम्पाइल करने के लिए, Notepad++ का इस्तेमाल करते हैं।
          • 

        • हर एक टैग के लिए हमेशा ही एक क्लोजिंग टैग होना चाहिए। उदाहरण के लिए, <tag1><tag2> को </tag2></tag1> के द्वारा क्लोज होना चाहिए।
          • 

        

        

        

        

        10. 

      10. 

          

        • यदि आप आपके वेबपेज पर किसी इमेज को अपलोड करना चाहते हैं, तो बेहतर होगा कि आप Imgur या ऐसे ही किसी क्लाउड सर्वर पर मौजूद आपके द्वारा तैयार किसी इमेज का इस्तेमाल करें। किसी और की इमेज पोस्ट करने पर आप कॉपीराइट संबंधी समस्या में पड़ सकते हैं।
          • 

        

        

        11. 

      

      

      

      11.

on

कोई टिप्पणी नहीं:

एक टिप्पणी भेजें

सदस्यता लें टिप्पणियाँ भेजें (Atom)