HTML पेज कैसे बनाएं

अगर आप अपना खुद का वेब पेज बनाना चाहते हैं, आपको HTML की समझ होनी चाहिए. This article explains how to create an HTML page. भी, आप सीखेंगे कि एक एक्सएमएल साइटमैप कैसे बनाया जाता है और एक तस्वीर और लिंक कैसे जोड़ा जाता है. एक्सएमएल साइटमैप बनाना भी जरूरी है, जो आपकी साइट को व्यवस्थित करने और आपके ट्रैफ़िक को बढ़ाने में आपकी सहायता कर सकता है. अगला कदम टेम्पलेट चुनना है.

Creating a html page

HTML एक मार्कअप भाषा है. वेब पेज के प्रत्येक तत्व को एक टैग द्वारा दर्शाया जाता है. कोण कोष्ठक द्वारा एक टैग की पहचान की जाती है, और प्रत्येक तत्व में एक या अधिक टैग होते हैं. कुछ तत्वों को केवल एक टैग की आवश्यकता होती है; दूसरों को दो की आवश्यकता हो सकती है. ओपनिंग और क्लोजिंग टैग में फॉरवर्ड स्लैश होता है (/). उदाहरण के लिए, पैराग्राफ तत्व को p टैग द्वारा दर्शाया जाता है. उद्घाटन और समापन टैग के बीच का पाठ अनुच्छेद पाठ है.

HTML दस्तावेज़ बनाने के लिए, आपको एक टेक्स्ट एडिटर का उपयोग करने की आवश्यकता होगी. अधिकांश कंप्यूटरों में डिफ़ॉल्ट रूप से एक टेक्स्ट एडिटर होता है. Windows उपयोगकर्ता Internet Explorer का उपयोग करेंगे, जबकि मैक उपयोगकर्ता TextEdit का उपयोग कर सकते हैं. पेशेवर दिखने वाला वेबपेज बनाने के लिए आप एक फैंसी टेक्स्ट एडिटर स्थापित कर सकते हैं, लेकिन आपके पहले HTML पृष्ठ के लिए, यह आवश्यक नहीं है. आप एक साधारण टेक्स्ट एडिटर और किसी भी वेब ब्राउज़र का भी उपयोग कर सकते हैं. यदि आप सुनिश्चित नहीं हैं कि किस प्रोग्राम का उपयोग करना है, एक निःशुल्क HTML संपादक डाउनलोड करने का प्रयास करें.

html पेज के दो मुख्य भाग हैं: शरीर और सिर. मुख्य भाग में वेबसाइट की वास्तविक सामग्री होती है, जबकि शीर्षक और मेटा जानकारी के लिए हेड सेक्शन का उपयोग किया जाता है. शरीर में अन्य सभी तत्व होते हैं, छवियों और अन्य ग्राफिक्स सहित. शीर्ष लेख अनुभाग आपके नेविगेशन लिंक डालने का स्थान है. आपके द्वारा बॉडी लिखना समाप्त करने के बाद, आप दस्तावेज़ की सामग्री सम्मिलित करने के लिए तैयार हैं. यह सुनिश्चित करने के लिए कि आपकी वेबसाइट सभी के लिए सुलभ है, शरीर और सिर के तत्वों का उपयोग करना सुनिश्चित करें.

Creating a xml sitemap

If you have an HTML page, खोज इंजन को आपकी वेबसाइट क्रॉल करने में मदद करने के लिए आप एक XML साइटमैप बनाना चाह सकते हैं. हालांकि यह आपकी खोज रैंकिंग को प्रभावित नहीं करेगा, यह खोज इंजनों को आपकी सामग्री को समझने और उनकी क्रॉलिंग दर को समायोजित करने में मदद करेगा. इस तरफ, आपकी वेबसाइट खोज इंजन परिणामों में अधिक दिखाई देगी. आरंभ करने के लिए यहां कुछ आसान चरण दिए गए हैं:

HTML साइटमैप बनाना आसान है. आपको बस अपनी साइट के पृष्ठों की एक साधारण तालिका बनानी है, प्रत्येक पृष्ठ के लिंक के साथ. फिर शीर्ष लेख या पादलेख में उस साइटमैप पृष्ठ से लिंक करें. इस तरफ, कोई फर्क नहीं पड़ता कि आपकी साइट के कितने पृष्ठ हैं, लोग उनके माध्यम से आसानी से नेविगेट कर सकते हैं. इसके अतिरिक्त, साइटमैप बनाने के लिए आपको SEO सबमिट करने की आवश्यकता नहीं है.

एक बार आपका HTML पेज लाइव हो जाए, इसे Google Search Console में सबमिट करें. आप किसी भी फ़ाइल एक्सटेंशन का उपयोग कर सकते हैं और अपने XML साइटमैप को नाम दे सकते हैं. आप Google को XML साइटमैप सबमिट कर सकते हैं, लेकिन यह जरूरी नहीं है. Google के क्रॉलर आम तौर पर नई सामग्री खोजने में बहुत अच्छे होते हैं, और आपको उन्हें साइटमैप सबमिट करने की आवश्यकता नहीं है. आप इसे दूसरे सर्च इंजन में भी सबमिट कर सकते हैं, लेकिन यह गारंटी नहीं देता कि आपको Google द्वारा खोजा जाएगा.

अपने वेब पेज पर XML साइटमैप जोड़ना आवश्यक नहीं है, लेकिन इससे आपकी वेबसाइट का SEO बढ़ जाएगा. साइटमैप का उपयोग खोज इंजन द्वारा उन पृष्ठों को अनुक्रमित करने में मदद करने के लिए किया जाता है जो किसी वेब पेज से सीधे लिंक नहीं होते हैं. साइटमैप समृद्ध मीडिया सामग्री की पहुंच को बेहतर बनाने में भी मदद करते हैं. अपनी वेबसाइट में साइटमैप जोड़ने से आपकी साइट को सर्च इंजन बॉट्स के लिए अधिक सुलभ बनाने में मदद मिल सकती है.

Adding a picture

In HTML, आप img टैग का उपयोग करके किसी पृष्ठ पर एक छवि जोड़ सकते हैं. इस टैग में केवल छवि और उसके गुण हैं; इसे क्लोजिंग टैग की आवश्यकता नहीं है. यह छवि टैग HTML दस्तावेज़ के मुख्य भाग में डाला जाना चाहिए. तस्वीर की चौड़ाई और ऊंचाई के अलावा, आपको चित्र का वर्णन करने वाली एक वैकल्पिक विशेषता शामिल करनी चाहिए. ऑल्ट टैग को ऐसे लिखा जाना चाहिए जैसे कि आप किसी ऐसे व्यक्ति के लिए विवरण लिख रहे हैं जो इसे नहीं देख सका.

HTML दस्तावेज़ में चित्र जोड़ने के लिए थोड़े CSS और HTML ज्ञान की आवश्यकता होती है. छवि का आकार और रिज़ॉल्यूशन दो सबसे महत्वपूर्ण कारक हैं जिन पर विचार किया जाना चाहिए. छवि का आकार यह निर्धारित करेगा कि यह दस्तावेज़ की सामग्री में कैसे फिट होगा. यदि आप किसी भिन्न रिज़ॉल्यूशन या पक्षानुपात का उपयोग करना पसंद करते हैं, आप छवि का आकार बदलने का भी प्रयास कर सकते हैं. हालांकि, याद रखें कि स्केलिंग हमेशा आपकी अपेक्षा के अनुरूप काम नहीं करती है.

छवि के आकार को समायोजित करने के लिए अंगूठे का एक अच्छा नियम इसकी चौड़ाई बढ़ाना है. चौड़ाई ऊंचाई से कम से कम एक पिक्सेल छोटी होनी चाहिए. यदि छवि प्रदर्शित करने के लिए बहुत छोटी है, आप एक सीमा जोड़ सकते हैं, और फिर इसे छवि आकार में फिट करने के लिए समायोजित करें. आप किसी छवि की सीमा को सीमा विशेषता में जोड़कर भी समायोजित कर सकते हैं. सीमा मोटाई डिफ़ॉल्ट मान है, लेकिन आप इसे किसी भी मूल्य पर सेट कर सकते हैं. सुनिश्चित करें कि छवि में एक src विशेषता है.

Adding a link

You can add a link in HTML to your document using an a> href विशेषता के साथ टैग. यह दस्तावेज़ के लिए एक बुकमार्क बनाएगा और इसे एक नए टैब में खोलेगा. आप दस्तावेज़ में एक छवि सम्मिलित करने के लिए एक href विशेषता का भी उपयोग कर सकते हैं. HTML बटन को लिंक में बदलने के लिए आप जावास्क्रिप्ट कोड वाले लिंक का भी उपयोग कर सकते हैं. एक बार आपने यह कर लिया, आप सीएसएस या जावास्क्रिप्ट कोड के साथ अपने लिंक को स्टाइल कर सकते हैं.

एक लिंक एक वेब संसाधन से दूसरे में एक कनेक्शन है. इसमें दो सिरे होते हैं, एक स्रोत एंकर और एक गंतव्य एंकर. एक लिंक किसी छवि से टेक्स्ट फ़ाइल में कुछ भी हो सकता है. अधिकांश सोशल नेटवर्किंग साइट्स और वेबसाइटें उपयोगकर्ताओं को किसी विशेष URL पर निर्देशित करने के लिए लिंक का उपयोग करती हैं. HTML का उपयोग किसी लिंक का स्थान निर्दिष्ट करने के लिए भी किया जा सकता है. यह है एक’ विशेषता आपको कोड तत्वों को URL से जोड़ने की अनुमति देती है.

लिंक डिजाइन करते समय, इस बात पर विचार करना सुनिश्चित करें कि आपके आगंतुक सामग्री का उपयोग कैसे करेंगे. लिंक टेक्स्ट वर्णनात्मक होना चाहिए, ताकि वे जान सकें कि उन्हें वास्तव में क्या उम्मीद करनी चाहिए. स्क्रीन रीडर्स के लिए एक ही URL की पुनरावृत्ति बदसूरत है, और यह उन्हें कोई उपयोगी जानकारी नहीं देता है. स्क्रीन रीडर उपयोगकर्ताओं को अलग-अलग स्टाइल या रेखांकित करके यह भी बताते हैं कि लिंक कब मौजूद हैं. इस तरह, वे आसानी से अपनी जरूरत की जानकारी पा सकते हैं.

Adding a table

Adding a table to an HTML page is simple, लेकिन कुछ चीजें हैं जिन्हें करने से पहले आपको विचार करना चाहिए. आपकी तालिका का पृष्ठभूमि रंग आपके आगंतुक का ध्यान आकर्षित करने और महत्वपूर्ण जानकारी पर ध्यान आकर्षित करने के लिए महत्वपूर्ण है. आप हेक्स रंग कोड या रंग नामों का उपयोग करके तालिका के शीर्षलेख तत्व और डेटा तत्व के लिए एक अलग रंग सेट कर सकते हैं. किसी भी तरह से, आपकी तालिका आसानी से दिखाई देगी.

आप td तत्व के साथ तालिका शीर्षलेख और तालिका डेटा जोड़ सकते हैं, जो व्यक्ति को परिभाषित करता है “बक्से” सामग्री के लिए. तालिका शीर्षलेख जोड़ना वेबपृष्ठ पर डेटा प्रदर्शित करने का पहला चरण है, और यदि आप चाहते हैं तो आपको पहला जोड़ना चाहिए. एक तालिका में तीन पंक्ति शीर्षक भी होने चाहिए. एक हेडर खाली होना चाहिए. यदि आपकी तालिका में कॉलम हैं, आपको प्रत्येक कॉलम के लिए पंक्ति शीर्षलेख भी बनाने चाहिए.

आप अपनी तालिका में कैप्शन भी जोड़ सकते हैं. कैप्शन एक वैकल्पिक तत्व है जो तालिका के उद्देश्य का वर्णन करता है. अभिगम्यता के लिए कैप्शन भी सहायक होते हैं. तालिका में डेटा के समूहों का वर्णन करने वाले सेल भी हो सकते हैं. आखिरकार, आप पंक्तियों और स्तंभों के सेट को परिभाषित करने के लिए थैड तत्व जोड़ सकते हैं. आप दोनों तत्वों का एक साथ या अलग-अलग उपयोग कर सकते हैं. आप उन्हें संयोजन में भी उपयोग कर सकते हैं, लेकिन कैप्शन सबसे महत्वपूर्ण है.

Adding a div

Adding a div to an HTML file allows you to add a section of your webpage without re-writing the whole page. पाठ के लिए div तत्व एक विशेष कंटेनर है, इमेजिस, और अन्य तत्व. आप इसे अपनी पसंद का कुछ भी नाम दे सकते हैं और अपनी आवश्यकताओं के अनुरूप इसकी विशेषताओं को बदल सकते हैं. आप अपने पृष्ठ पर div और अन्य तत्वों के बीच एक स्थान बनाने के लिए एक वर्ग या मार्जिन भी जोड़ सकते हैं.

आप div के अंदर कोड डालने के लिए आंतरिक HTML विशेषता का भी उपयोग कर सकते हैं. यह विधि एक स्ट्रिंग में संलग्न कोड को स्वीकार करती है, और अगर यह div . के भीतर नहीं है, सामग्री हटा दी जाएगी. आपको इस तरह एक div में कोड डालने से बचना चाहिए, क्योंकि यह आपकी वेबसाइट को क्रॉस-साइट स्क्रिप्टिंग कमजोरियों के लिए उजागर कर सकता है. यदि आप जावास्क्रिप्ट जैसी स्क्रिप्टिंग भाषा का उपयोग कर रहे हैं, आप आंतरिक HTML विशेषता का उपयोग कर सकते हैं.

एक डिव एक मूल HTML टैग है जिसका उपयोग किसी दस्तावेज़ के भीतर कोड को समूहीकृत करने के लिए किया जाता है. इसमें एक पैराग्राफ हो सकता है, ब्लॉक बोली, छवि, ऑडियो, या यहां तक ​​कि एक हेडर. इसकी स्थिति आपको पृष्ठ के विभिन्न अनुभागों में एक समान शैली और भाषा लागू करने की अनुमति देती है. लगातार तत्वों के समूहों के लिए सामान्य शब्दार्थ को चिह्नित करने के लिए डिव का सबसे अच्छा उपयोग किया जाता है. जब आप पूरे पृष्ठ को फिर से लिखे बिना किसी अनुभाग में शैली जोड़ना चाहते हैं तो एक div का उपयोग किया जाना चाहिए.