HTML पृष्ठ कसे तयार करावे

लेखक: Florence Bailey
निर्मितीची तारीख: 20 मार्च 2021
अद्यतन तारीख: 1 जुलै 2024
Anonim
HTML ट्यूटोरियल - सुपर सिंपल वेबसाइट कैसे बनाएं
व्हिडिओ: HTML ट्यूटोरियल - सुपर सिंपल वेबसाइट कैसे बनाएं

सामग्री

HTML (हायपरटेक्स्ट मार्कअप लँग्वेज) ही वेबपृष्ठे विकसित करण्यासाठी प्राथमिक प्रोग्रामिंग भाषा आहे. एक सोपी आणि सोयीस्कर प्रोग्रामिंग भाषा म्हणून तयार केली. इंटरनेटवरील बहुतेक पृष्ठे या भाषेच्या (कोल्डफ्यूजन, एक्सएमएल, एक्सएसएलटी) रूपांपैकी एक वापरून विकसित केली गेली आहेत. हा लेख वाचल्यानंतर, तुम्ही इंटरनेटवरील इतर संसाधने वापरून तुमचे प्रशिक्षण सुरू ठेवू शकता. या विषयाशी संबंधित इतर लेखांसाठी इंटरनेटवर शोधण्याचा प्रयत्न करा.

पावले

1 पैकी 1 पद्धत: HTML पृष्ठ लिहिणे

  1. 1 आपण येथे सादर केलेल्या चरणांपैकी एकाशी परिचित होण्यापूर्वी, "आपल्याला काय आवश्यक आहे" विभाग पहा.
  2. 2 आपण हा मुद्दा समजून घेण्यापूर्वी आपल्याला काय माहित असले पाहिजे:
  3. 3 मूलभूत गोष्टी. तुम्ही कधी टॅग बद्दल ऐकले आहे का? टॅग आतल्या शब्दासह कोन कंसांनी वेढलेला आहे. शेवटचा टॅग त्याच स्वरूपात लिहिलेला आहे, परंतु पहिल्या कोन कंसानंतर स्लॅश जोडण्यासह. विशेषता हा टॅगमधील पर्यायी शब्द आहे जो टॅगमध्ये तपशील जोडण्यासाठी वापरला जातो.
  4. 4 दस्तऐवजाची सुरुवात. तुम्ही जे काही मजकूर संपादक वापरत आहात, त्यात खालील पेस्ट करा:
    html> head> title> wikiHow / title> / head> body> Hello World / body> / html> big> / big>
    टॅग समान टॅगसह बंद करणे आवश्यक आहे, परंतु पहिल्या कोन कंसानंतर स्लॅशसह. टॅगसारखे अपवाद आहेत मेटा किंवा डॉक्टाइप.
  5. 5 डॉक्टाइप
    • सहसा, बहुतेक वेब पृष्ठे सेट केली जातात डॉक्टाइप ”. हे एन्कोडिंग तसेच वेब ब्राउझरद्वारे कसे समजले जाईल हे निर्धारित करण्यात मदत करते. बहुतेक पृष्ठे त्याशिवाय कार्य करतील, “परंतु जर तुम्हाला जुळवायचे असेल तर हे आवश्यक आहे (ते इंटरनेटवरील एन्कोडिंगचे प्रकार आणि ते कसे वापरले जातात ते नियंत्रित करतात)... HTML 4.01 साठी DOCTYPE खाली सादर केले आहे:! DOCTYPE html PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd"> हे एक आहे सर्वात सामान्य DOCTYPE संपूर्ण इंटरनेटवरील पृष्ठांवर वापरला जातो.प्रथम, ते 'html' चे वर्णन करणाऱ्या पृष्ठाच्या प्रकाराकडे निर्देश करते, नंतर ते एन्कोडिंगच्या प्रकारावर प्रकाश टाकते आणि शेवटी, DOCTYPE चे स्थान, परिणामी, वेब ब्राउझरसाठी पृष्ठाचे वर्णन करते.
    • HTML चे विविध प्रकार आहेत (वर्षानुवर्षे विकसित केलेल्या भिन्न आवृत्त्या), उदाहरणार्थ नवीन टॅग किंवा विशिष्ट टॅग वापरणे. काही टॅग नापसंत केले जातात (त्याऐवजी इतर अधिक उपयुक्त टॅग्ज वापरले जातात).
    • b> आणि मी> - हे सध्या टॅगवर लादले गेले आहे, कारण ते मजकूर बदलण्यासाठी वापरले जातात, परंतु वैशिष्ट्य नाही, परिणामी, इतर टॅग त्यांच्या जागी येतात. टॅग करा मजबूत> साठी बदली आहे b>, आणि em>, साठी बदली मी>.
    • हे महत्वाचे आहे की पूर्वीचे टॅग स्वरूपनापेक्षा अधिक असलेले टॅग बदलले जातात. जर मजकुराचे भाषांतर केले गेले असेल तर केवळ स्वरूपनच नाही तर त्याचा अर्थ देखील समान राहील. हे शब्दार्थाने बरोबर आहे.
    • XHTML आवृत्ती 2.0 मध्ये, <b> आणि मी> HTML आवृत्ती 3+ प्रमाणे वापरलेले नाही.
  6. 6 HTML "Encapsulation Rule".
    • सध्या वापरात असलेल्या अधिक महत्त्वाच्या टॅग्जवर एक नजर टाकूया. पृष्ठाच्या निर्मिती दरम्यान, एक साधी रचना वापरली जाते. जर एखादा टॅग उघडला गेला, तर त्याचा परिणाम म्हणून, ते बंद केले पाहिजे... हे संपूर्ण संरचनेवर लागू होते. येथे XHTML लेआउट संरचनेचे वैध उदाहरण आहे:
    • ! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    • html xmlns = "http://www.w3.org/1999/xhtml">
    • डोके>
    • मेटा http-equiv = "Content-Type" content = "text / html; charset = utf-8" />
    • शीर्षक> हॅलो वर्ल्ड! / शीर्षक>
    • / डोके>
    • शरीर>
    • h1> हॅलो वर्ल्ड! < / h1>
    • / शरीर>
    • / html>
    • संदेश जारी करणारा नमुना कोड नमस्कार जग... याला चाचणी म्हणतात नमस्कार जग.
  7. 7 मथळा
    • वेब पृष्ठ शीर्षक हे टॅगमधील सामग्री आहे डोके>... ही सामग्री वापरकर्त्याद्वारे पाहिली जाऊ शकत नाही (केवळ पृष्ठाच्या शीर्षकामध्ये दर्शविलेले शीर्षक). टॅग दरम्यान माहिती डोके>, इतर टॅग संलग्न करू शकतात, जसे की:

      • मेटा टॅगचा वापर माहितीसाठी केला जातो जो शोध इंजिन आणि इतर उपयुक्ततांसाठी उपयुक्त आहे.
      • LINK टॅग जो दस्तऐवजांमधील दुवा तयार करतो, उदाहरणार्थ शैली (CSS) साठी.
      • स्क्रिप्ट टॅग, यात जवळजवळ कोणत्याही वेब कोडिंगचा समावेश आहे, दूरस्थपणे प्रवेश करण्याची क्षमता (दुसर्या दस्तऐवजावरून).
      • STYLE टॅग, जी मूलतः एक शैली आहे जी पृष्ठावर लागू केली जाऊ शकते.
      • TITLE टॅग हे शीर्षक आहे जे आपल्या वेब ब्राउझरमध्ये पृष्ठाचे शीर्षक म्हणून दिसते.
    • या वेबसाईटवरून घेतलेल्या उदाहरण हेडरमध्ये यापैकी काहींचा डेमो पाहू (हे लहान केले गेले आहे):
      • डोके>
      • शीर्षक> ... / शीर्षक>
      • मेटा नाव = "वर्णन" सामग्री = "..." />
      • लिंक rel = "stylesheet" type = "text / css" href = "..." />
      • मेटा http-equiv = "content-type" content = "text / html; charset = UTF-8" />
      • style type = "text / css" media = "all"> ... / style>
      • स्क्रिप्ट प्रकार = "मजकूर / जावास्क्रिप्ट" src = "..."> / स्क्रिप्ट>
      • / डोके>

        जर तुमच्या लक्षात आले नसेल, तर वैयक्तिक माहिती काढून टाकली गेली आहे, वास्तविक माहिती काढून टाकली आहे. उदाहरण खूपच लहान आहे, जे जवळजवळ प्रत्येक टॅगमध्ये आढळू शकते डोके>HTML टिप्पणी वगळता (आम्ही साध्या टॅगमध्ये याबद्दल बोलू).
  8. 8 सर्वत्र साधे टॅग
    • चला पुढे जाऊ आणि इतर टॅग पाहू. आपल्या टॅगिंगबाबत सावधगिरी बाळगा आणि "एन्केप्सुलेशन" चा नियम लक्षात ठेवा.

      • <strong> महत्त्वाच्या मजकुरावर भर देते.
      • लहान> मजकूर लहान बनवते. फॉन्ट आकार 1 ते 7 पर्यंत मानक युनिटमध्ये मोजला जातो, 3 हा डीफॉल्ट मजकूर आकार असतो. ...
      • pre> रिच टेक्स्टचा ब्लॉक परिभाषित करतो. हे बरोबर असल्याने, असा मजकूर समान आकाराच्या फॉन्टमध्ये आणि शब्दांमधील सर्व अंतरांसह टाइप केला जातो.
      • em> मजकूर वाक्यांश म्हणून दाखवते.
      • del> मजकूर बाहेर काढतो.
      • ins> दस्तऐवजात समाविष्ट केलेला मजकूर परिभाषित करतो.
      • h1> अनेक हेडिंग टॅगपैकी एक. या प्रकारचे टॅग 'h' ने सुरू होतात, संख्येच्या फरकाने. त्याच क्रमांकासह टॅग बंद करण्याचे सुनिश्चित करा.
      • p> परिच्छेद परिभाषित करते.
      • ! --- ... ---> इतर टॅगच्या विपरीत, टिप्पणी टॅगमध्येच असली पाहिजे. कोड पाहिल्यावरच ही माहिती दिसते.
      • blockquote> एक कोट दर्शविते, cite> tag सह वापरले जाऊ शकते.
      • वरील काही उदाहरणे विद्यमान टॅगची संपूर्ण यादी नाहीत. इतरांबद्दल जाणून घेण्यासाठी, भेट द्या.
  9. 9 स्पष्ट रचना तयार करणे
    • पृष्ठे टॅगच्या साध्या सेटमध्ये डेटा ठेवण्यासाठी डिझाइन केली आहेत जेणेकरून आम्ही परिच्छेदांमध्ये माहितीचे विश्लेषण करू शकू. संगणक डेटा ओळखतो; त्याला संदर्भ किंवा वैचारिक जोडणीबद्दल माहिती नसते. आम्हाला संगणक अनुकूल HTML पृष्ठे तयार करावी लागतील. हे div टॅग वापरून साध्य केले जाते. हे मोठ्या संख्येने पृष्ठे तयार करण्यास मदत करते. हे CSS सह शैलीबद्ध केले जाऊ शकते आणि लेआउटसाठी मोठ्या कोड सारण्या तयार करण्यापेक्षा सोपे आहे.
      • div> हा टॅग विशेष आहे कारण तो स्टाईल केला जाऊ शकतो आणि वापरकर्त्याला आणि संगणकाला समजेल अशा माहितीचे स्वतंत्र ब्लॉक वापरू शकतो.
    • चला एक साधा HTML लेआउट पाहू ज्यामध्ये div टॅग वापरला जातो.
      • ! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
      • html xmlns = "http://www.w3.org/1999/xhtml">
      • डोके>
      • मेटा http-equiv = "Content-Type" content = "text / html; charset = utf-8" />
      • शीर्षक> हॅलो वर्ल्ड! / शीर्षक>
      • / डोके>
      • शरीर>
      • h1> हॅलो वर्ल्ड! < / h1>
      • div id = "contentOne">
      • p> हा div # contentOne </p> मधील काही मजकूर आहे
      • div>
      • p> div # contentOne </p> च्या उपविभागातील परिच्छेद
      • / div>
      • / div>
      • / शरीर>
      • / html>
    • Div> टॅग वापरणे CSS आणि जावास्क्रिप्टसह कार्य करताना शैली शोधण्यात आणि सुधारण्यात मदत करते. एक चांगला आणि अधिक प्रतिसाद देणारा वापरकर्ता अनुभव तयार करण्यासाठी HTML CSS शैली आणि जावास्क्रिप्टसह कार्य करण्यासाठी वेगवेगळ्या एन्कोडिंगचा वापर करेल.

टिपा

  • हा लेख वाचल्यानंतर, थांबू नका आणि विचार करा की आपल्याला माहित असलेल्या सर्व गोष्टी आपण शिकल्या आहेत. नेहमीच काहीतरी शिकण्यासारखे असते, विशेषत: या तंत्रज्ञानात.
  • कोड शिका, समजून घ्या आणि लिहा.
  • लक्षात घ्या की काही टॅग फक्त> वापरतात. पॅरा आणि बीआर काही उदाहरणे आहेत. > सह उघडलेले इतर टॅग पुढे बंद करणे आवश्यक आहे. उदाहरणार्थ, "div> </div>".
  • लोक नवीन शोधांची अपेक्षा करतात, म्हणून पुन्हा शोध, रचना किंवा कोड.
  • एकदा आपण बरेच काही शिकल्यानंतर, सर्व्हर प्रोग्रामिंग शिकण्याचा प्रयत्न करा.
  • सीएसएस तसेच जावास्क्रिप्टसह काम करायला शिका.

चेतावणी

  • लक्षात ठेवा, HTML हे सर्व सामग्री संपादित करण्याबद्दल आहे. याचा अर्थ HTML केवळ मान्यताप्राप्त स्वरूपात सामग्री साठवण्यासाठी वापरला जातो. इतर बदल सीएसएस सारख्या इतर तंत्रज्ञानाचा वापर करून करणे आवश्यक आहे. याचा अर्थ "शब्दार्थाने योग्य" करणे देखील आहेजरी इतरांनी ते मान्य केले नाही. इतर प्रोग्रामिंग भाषा वेब पृष्ठे (CSS, Javascript आणि XML) तयार करण्यात मदत करतात. एचटीएमएल एक कंटेंट कन्स्ट्रक्टर आहे.

आपल्याला काय आवश्यक आहे

  • ANSI एन्कोडिंगला समर्थन देणारा मजकूर संपादक
  • वेब ब्राउझर जसे की इंटरनेट एक्सप्लोरर किंवा मोझीला फायरफॉक्स
  • (पर्यायी) wysiwyg किंवा wykiwyg HTML संपादक जसे की Adobe Dreamweaver, Aptana Studio, किंवा Microsoft Expression Web