योग्य वाक्यरचनासाठी Html 5 तपासलेले नाही. HTML मूलभूत - भाषा वाक्यरचना, टॅग

HTML5 आम्हाला एका दशकापूर्वीच्या शैलीत परत आणते, जेव्हा काही टॅग बंद न करता सोडणे, कोट्सशिवाय मूल्ये लिहिणे आणि पर्यायाने वरच्या किंवा खालच्या केसमध्ये टॅग टाइप करणे ही सामान्य प्रथा होती. या स्वातंत्र्याचा अर्थ असा नाही की कोणत्याही नियमांकडे दुर्लक्ष केले पाहिजे आणि टॅग्जचे योग्य नेस्टिंग आणि आवश्यक घटकांचा समावेश केला पाहिजे. XHTML च्या कठोर वाक्यरचनापासून दूर जाणे तुम्हाला साइटच्या सामग्रीवर लक्ष केंद्रित करण्यास अनुमती देते, आणि रिक्त औपचारिकतेचे पालन करण्यावर नाही, ज्यापैकी बहुतेक त्यांच्या क्षुल्लक अर्थामुळे आणि अनावश्यकतेमुळे चिडचिड करतात.

HTML घटक

वेब पृष्ठाचा मूलभूत बिल्डिंग ब्लॉक एक घटक आहे. ते वेगवेगळ्या निकषांनुसार विभागले जाऊ शकतात, उदाहरणार्थ, प्रकार किंवा उद्देशानुसार.

प्रकारानुसार आयटम

रिक्त घटक

यामध्ये क्लोजिंग टॅग नसलेले घटक समाविष्ट आहेत: , ,
, , , , , , , , , , , , , .

प्रक्रिया न केलेले मजकूर घटक

HTML व्यतिरिक्त सिंटॅक्स असलेल्या स्क्रिप्ट किंवा शैली आउटपुट करण्यासाठी डिझाइन केलेले: , .

RCDATA

या घटकांमध्ये कोणताही मजकूर किंवा विशेष वर्ण असू शकतात, एंपरसँड नावाच्या मानक नसलेल्या विशेष वर्णांचा अपवाद वगळता, उदाहरणार्थ: किंवा &T. घटकांच्या या गटामध्ये आणि.

परदेशी घटक

MathML किंवा SVG शी संबंधित घटक.

नियमित घटक

इतर सर्व घटक जे मागील गटांमध्ये समाविष्ट नाहीत.

हेतूनुसार घटक

मूळ घटक

घटक.

दस्तऐवज मेटाडेटा

, तसेच त्याच्या आत असलेले घटक.

स्क्रिप्ट

स्क्रिप्ट्स तुम्हाला वेब पृष्ठावर परस्पर क्रिया जोडण्याची परवानगी देतात;

स्ट्रक्चरल घटक

घटक जे वेब पृष्ठाचे मुख्य विभाग नियंत्रित करतात, जसे की , , , , इ.

सामग्री गट

मजकूर, सूची, प्रतिमा तयार करणारे घटक.

मजकूर

घटक जे मजकूराचे स्वरूप बदलतात, उदाहरणार्थ, ते ठळक किंवा तिर्यक बनवणे, तसेच मजकूराला अर्थानुसार हायलाइट करणे - संक्षेप, कोट, व्हेरिएबल, कोड इ.

पुनरावलोकन करा

घटक आणि दस्तऐवजातील संपादने दाखवणे.

एम्बेडेड सामग्री

पृष्ठावर भिन्न वस्तूंच्या स्वरूपात घातलेले घटक - प्रतिमा, व्हिडिओ, ऑडिओ इ.

टॅब्युलर डेटा

सारण्यांचे स्वरूप तयार करण्यासाठी आणि व्यवस्थापित करण्यासाठी घटक.

फॉर्म

फॉर्म हे कोणत्याही वेबसाइटच्या महत्त्वाच्या घटकांपैकी एक आहेत आणि ते वापरकर्ता आणि सर्व्हरमधील डेटाच्या देवाणघेवाणीसाठी डिझाइन केलेले आहेत. या गटामध्ये फॉर्म आणि त्याची फील्ड तयार करण्यासाठी घटक समाविष्ट आहेत.

परस्परसंवादी घटक

विशेष विजेट्स ज्याद्वारे वापरकर्ता अतिरिक्त माहिती किंवा नियंत्रण मिळवू शकतो.

दुवे

घटक आणि .

असे गटीकरण सशर्त असते आणि ते भिन्न स्वरूप धारण करू शकते, कारण समान घटक भिन्न गटांचे असू शकतात.

टॅग्ज

टॅग्जचा वापर घटकाची सुरुवात आणि शेवट दर्शविण्यासाठी केला जातो. टॅगच्या आत त्यांच्या स्वतःच्या मूल्यांसह विशेषता असू शकतात जी टॅगच्या क्षमता तसेच सामग्री (चित्र 1) विस्तृत करतात.

तांदूळ. 1. टॅग href विशेषता सह

क्लोजिंग टॅग ओपनिंग टॅग सारखाच असतो, परंतु कोन कंसात स्लॅश (/) असतो.

रिकाम्या घटकांना क्लोजिंग टॅग आणि सामग्री नाही (आकृती 2).

तांदूळ. 2. रिक्त टॅग

टॅग विशेषता टॅगची क्षमता स्वतःच विस्तृत करतात आणि वेब पृष्ठ घटक प्रदर्शित करण्यासाठी आपल्याला लवचिकपणे विविध सेटिंग्ज व्यवस्थापित करण्याची परवानगी देतात. गुणधर्मांची एकूण संख्या बरीच मोठी आहे, परंतु त्यांची मूल्ये, नियमानुसार, वेगवेगळ्या प्रकारांमध्ये गटबद्ध केली जाऊ शकतात, उदाहरणार्थ, रंग, आकार, पत्ता इ. निर्दिष्ट करणे. उदाहरणार्थ, एक घटक. वेब पृष्ठावर प्रतिमा जोडते आणि आम्ही ग्राफिक फाइलचा पत्ता src विशेषताद्वारे सूचित करतो.

डॉक्टाइप

वर्तमान दस्तऐवजाचा प्रकार - DTD (दस्तऐवज प्रकार व्याख्या, दस्तऐवज प्रकाराचे वर्णन) दर्शविण्याचा हेतू आहे जेणेकरून ब्राउझरला समजेल की ते HTML ची कोणती आवृत्ती हाताळत आहे. doctype निर्दिष्ट न केल्यास, ब्राउझर सुसंगतता मोडमध्ये जातात, ज्यामध्ये अनेक HTML5 वैशिष्ट्ये कार्य करत नाहीत आणि दस्तऐवज प्रदर्शनासह त्रुटी उद्भवतात.
डॉक्टाइप केस संवेदनशील नाही आणि त्यात फक्त दोन शब्द आहेत:

हा मुख्य घटक आहे आणि सहसा कोडच्या पहिल्या ओळीत असतो.

टिप्पण्या

काही मजकूर टिप्पणी करून ब्राउझरमध्ये दर्शविण्यापासून लपविला जाऊ शकतो. जरी हा मजकूर वापरकर्त्याद्वारे दिसणार नाही, तरीही तो दस्तऐवजात प्रसारित केला जाईल, म्हणून आपण स्त्रोत कोड पाहिल्यास, आपण लपविलेल्या नोट्स शोधू शकता.

कोडमध्ये तुमच्या स्वतःच्या नोंदी करण्यासाठी टिप्पण्या आवश्यक आहेत ज्या पृष्ठाच्या स्वरूपावर परिणाम करत नाहीत. ते टॅगसह प्रारंभ करतात. या टॅगमधील काहीही वेब पृष्ठावर प्रदर्शित केले जाणार नाही.

पर्यायी टॅग

टॅग सूचीबद्ध नसल्यास, याचा अर्थ असा नाही की तो अजिबात दर्शविला जात नाही. असे काही नियम आहेत जे तुम्हाला काही टॅग न लिहू देतात. टेबलमध्ये 1 वगळले जाऊ शकणारे टॅग आणि ज्या स्थितीत हे घडते ते दाखवते.

टेबल 1. पर्यायी टॅग टॅग स्थिती
आत इतर घटक असल्यास.
रिक्त असल्यास आणि त्यात जागा किंवा टिप्पणी व्यतिरिक्त काहीतरी समाविष्ट असल्यास.
जर एखादा घटक त्यानंतर असेल
  • जर एखादा घटक किंवा .
    जर घटकाचे अनुसरण केले असेल, किंवा तो पालकांपैकी शेवटचा असेल.

    जर घटक , , , , , , , , , , , ... , , , , , , , , ,

    , , ,

    ,
      .
    आणि आधी येत नाही, किंवा ज्यात वगळलेला क्लोजिंग टॅग आहे.किंवा तो पालकांसोबत शेवटचा आहे.
    जर एखादा घटक किंवा .
    जर एखादा घटक किंवा .
    जर घटकाचे पालन केले असेल किंवा पालकांचा शेवटचा घटक असेल.
    जर घटकाचे अनुसरण केले असेल, किंवा तो पालकांपैकी शेवटचा असेल.
    जर .
    जर एखादा घटक किंवा .
    जर पहिला आत असेल तर
    जर घटकाचे अनुसरण केले असेल किंवा किंवा ते पालकांचे शेवटचे घटक असेल.
    जर घटकाचे पालन केले असेल किंवा पालकांचा शेवटचा घटक असेल.
    जर एखादा घटक त्यानंतर असेल
    जर एखादा घटक त्यानंतर असेल किंवा किंवा तो पालकांसोबत शेवटचा आहे.
    जर एखादा घटक त्यानंतर असेल किंवा किंवा तो पालकांसोबत शेवटचा आहे.

    ओपनिंग टॅगमध्ये एक किंवा अधिक विशेषता असल्यास, टॅग निर्दिष्ट करणे आवश्यक आहे.

    बरेच टॅग निर्दिष्ट केले जाऊ शकत नाहीत या वस्तुस्थितीमुळे, कारण... ते डीफॉल्टनुसार निहित आहेत, कोणताही दस्तऐवज खालील भागांमध्ये कमी केला जातो.

  • पर्यायी बाइट ऑर्डर मार्क (BOM).
  • .
  • .
  • तुम्ही doctype च्या आधी आणि नंतर कितीही स्पेस किंवा टिप्पण्या टाकू शकता. अशा प्रकारे, doctype कोडच्या पहिल्या ओळीवर असणे आवश्यक नाही.

    उदाहरण 1 पारंपारिक अभिवादन प्रदर्शित करण्यासाठी किमान HTML कोड दाखवते.

    उदाहरण 1: किमान HTML

    HTML5 IE Cr Op Sa Fx

    हॅलो वर्ल्ड!

    बाइट ऑर्डर मार्कमध्ये दस्तऐवजाच्या सुरुवातीला U+FEFF वर्ण कोड असतो, जिथे तो एन्कोडिंग निर्धारित करण्यासाठी वापरला जातो. हे चिन्ह काढून टाकण्याची शिफारस केली जाते, कारण त्याच्या उपस्थितीमुळे काही ब्राउझरमध्ये दस्तऐवज प्रदर्शित करण्यात त्रुटी येतात. हे करण्यासाठी, तुम्ही Notepad++ संपादक वापरू शकता, "एनकोडिंग" मेनूमध्ये, "यूटीएफ-8 (BOM शिवाय)" (चित्र 3) मध्ये एन्कोड निवडा.

    तांदूळ. 3. एन्कोडिंग निवडा

    उपयुक्त दुवे
    • बाइट ऑर्डर मार्क बद्दल अधिक
      http://unicode.org/faq/utf_bom.html#bom1
    • नोटपॅड ++ संपादक

    HTML वाक्यरचना 5

    तुम्ही आधीच शिकल्याप्रमाणे, HTML5 ने काही नियम शिथिल केले आहेत. हे केले गेले कारण HTML5 च्या निर्मात्यांना भाषेने वेब ब्राउझर प्रत्यक्षात कसे कार्य करतात हे अधिक बारकाईने प्रतिबिंबित करायचे होते. दुसऱ्या शब्दांत, त्यांना "कार्यरत वेब पृष्ठे" आणि "मानक-योग्य वेब पृष्ठे" मधील अंतर कमी करायचे होते. नियमातील बदल आम्ही पुढील भागात अधिक तपशीलवार पाहू.

    अर्थात, अजूनही HTML5 मानकांद्वारे पूर्णपणे परावृत्त केलेल्या ब्राउझरद्वारे समर्थित परंपरागत पद्धती आहेत. HTML5 व्हॅलिडेटर वापरून या पद्धती शोधल्या जाऊ शकतात.

    शिथिल नियम

    HTML5 मार्कअपच्या आमच्या पहिल्या परिचयात, आम्ही शिकलो की या मार्कअपसाठी , आणि घटकांचा वापर पर्यायी आहे. पण HTML5 मधील नियम सैल करणे तिथेच संपत नाही.

    हे खालील उदाहरणाप्रमाणे टॅगमध्ये अप्परकेस आणि लोअरकेस अशा दोन्ही अक्षरांना अनुमती देते:

    टॅगमध्ये वापरले जाऊ शकतेअप्परकेस आणि लोअरकेस दोन्ही अक्षरे.

    रिकाम्या घटकांमध्ये अनुगामी बॅकस्लॅश वगळणे देखील शक्य आहे, उदा. सामग्री नसलेले घटक, जसे की (प्रतिमा),
    (लाइन ब्रेक) किंवा ( क्षैतिज रेखा). लाइन ब्रेक घालण्यासाठी येथे तीन समतुल्य मार्ग आहेत:

    उदाहरण
    अंतर
    ओळी

    HTML5 मध्ये विशेषतांचे नियम देखील बदलले आहेत. विशेषता मूल्ये यापुढे उद्धृत करणे आवश्यक नाही, जोपर्यंत त्यात बेकायदेशीर वर्ण (सामान्यतः >, =, किंवा जागा) नसतात. येथे घटक वापरण्याचे उदाहरण आहे अशा प्रकारे:

    मूल्यांशिवाय गुणधर्मांना देखील अनुमती आहे. अशा प्रकारे, XHTML मध्ये चेकबॉक्स सेट करण्यासाठी काही प्रमाणात पुनरावृत्ती वाक्यरचना आवश्यक असल्यास:

    नंतर HTML5 मध्ये हे HTML 4.01 च्या परंपरांमध्ये केले जाऊ शकते, फक्त एक विशेषता नाव निर्दिष्ट करून:

    परंतु काहींसाठी विशेषतः त्रासदायक गोष्ट अशी आहे की हे सर्व HTML5 मध्ये अनुमत आहे, परंतु कमी-सुसंगत विकासक निष्काळजीपणे कठोर आणि शिथिल दोन्ही नियमांचा वापर करू शकतात, काहीवेळा समान दस्तऐवजात देखील. परंतु प्रत्यक्षात, एक्सएचटीएमएलमध्ये अशा प्रकारचे स्लोपी मार्कअप शक्य आहे. दोन्ही मानकांमध्ये, चांगल्या मार्कअप शैलीची जबाबदारी वेब डेव्हलपरची आहे, कारण ब्राउझर त्याला दिलेली प्रत्येक गोष्ट खातो.

      घटक वापरणे, आणि . घटकामध्ये पृष्ठाच्या नैसर्गिक भाषेची व्याख्या ठेवणे सोयीचे आहे आणि घटक आपल्याला पृष्ठावरील वास्तविक सामग्रीपासून पृष्ठाबद्दलची माहिती विभक्त करण्याची परवानगी देतात.

      टॅगमधील लोअरकेस अक्षरे. टॅगमध्ये लोअरकेस अक्षरे वापरणे ऐच्छिक आहे, परंतु लोअरकेस टॅग अधिक सामान्य आहेत, टाइप करणे सोपे आहे (कारण तुम्हाला ) की वापरण्याची आवश्यकता नाही आणि ते अपरकेस टॅगसारखे त्रासदायक नाहीत.

      विशेषता मूल्ये उद्धृत करणे. विशेषता मूल्ये एका कारणासाठी कोट्समध्ये ठेवली जातात - अन्यथा करणे खूप सोपे आहे अशा चुका टाळण्यात मदत करण्यासाठी. अवतरणांशिवाय, एक चुकीचे गुणधर्म मूल्य वर्ण संपूर्ण पृष्ठाचा नाश करू शकतो.

    HTML5 कोड प्रमाणीकरण

    HTML5 चा नियमांबद्दलचा नवीन दृष्टीकोन काही वेब डेव्हलपरसाठी फक्त एक गोष्ट असू शकतो. इतरांसाठी, कोणत्याही अडथळ्याशिवाय कार्य करणाऱ्या ब्राउझरच्या दर्शनी भागाच्या मागे एक विसंगत लपलेली असू शकते ही कल्पना, चुकांनी भरलेलाखुणा तुमची झोप हिरावून घेऊ शकतात.

    तुम्ही नंतरचा प्रकार असल्यास, म्हणून ठेवा की व्यालीडेटर नावाचे मार्कअप-चेकिंग टूल शिफारस केलेले HTML5 मानके पूर्ण न करणारा कोड शोधू शकते, जरी ब्राउझरने त्या कोडवर प्रक्रिया करताना पापणी न लावली तरीही.

    काही संभाव्य समस्या, जे व्हॅलिडेटर पकडण्यास सक्षम आहे त्यात खालील गोष्टींचा समावेश आहे:

      आवश्यक घटकांची अनुपस्थिती (उदाहरणार्थ, घटक);

      क्लोजिंग टॅगचा अभाव;

      चुकीचे एम्बेड केलेले टॅग;

      टॅगसाठी विशेषतांची अनुपस्थिती ज्यासाठी ते आवश्यक आहेत (उदाहरणार्थ, टॅगचे src विशेषता );

      घटक किंवा सामग्रीचे चुकीचे प्लेसमेंट (उदाहरणार्थ, ब्लॉकमधील मजकूर).

    वेब पेज डेव्हलपमेंट टूल्स जसे की Dreamweaver आणि Expression Web त्यांच्या स्वतःच्या प्रमाणिकांसह येतात, परंतु फक्त सर्वात नवीनतम आवृत्त्या HTML5 चे समर्थन करा. या प्रकरणात, आपण ऑनलाइन सत्यापनकर्त्यांपैकी एक वापरू शकता. W3C संस्थेकडून लोकप्रिय व्हॅलिडेटर वापरण्यासाठी खालील सूचना आहेत:

    तुमचा कोड पुनरावलोकनासाठी पाठवला जाईल आणि थोड्या प्रतीक्षा केल्यानंतर, ब्राउझरमध्ये प्रमाणीकरण परिणामांसह एक अहवाल प्रदर्शित केला जाईल. जर कोड पडताळणी पास करत नसेल, तर अहवाल सत्यापनकर्त्याद्वारे ओळखलेल्या त्रुटी दर्शवेल:

    अगदी पूर्णपणे वैध HTML दस्तऐवजासाठी, अहवाल अनेक चेतावणी दर्शवू शकतो (संपूर्णपणे निरुपद्रवी असूनही), ज्यात एन्कोडिंग आपोआप आढळून आले आणि HTML5 कोड प्रमाणीकरण सेवा प्रायोगिक आहे आणि पूर्णपणे विकसित केलेली नाही.

    जसे तुम्ही आकृतीमध्ये पाहू शकता, वैधताकर्त्याने दस्तऐवजातील HTML5 नियमांचे चार उल्लंघन ओळखले, जे कोडमधील दोन त्रुटींचे परिणाम होते. पहिली त्रुटी म्हणजे आवश्यक घटक गहाळ आहे. दुसरा - त्यातील नेस्टेड घटक बंद होण्यापूर्वी घटक बंद केला जातो . तथापि, या त्रुटी असूनही, हा मार्कअप योग्य आहे आणि सर्व ब्राउझर हे पृष्ठ अपेक्षेप्रमाणे प्रदर्शित करतील.

    XHTML परत करा

    जसे आपण आधीच शिकलो आहोत, एचटीएमएल 5 स्पेसिफिकेशन चिन्हांचा उदय, सिद्धांततः, पूर्वीच्या राजाचा ऱ्हास विश्व व्यापी जाळे- XHTML मानक. परंतु वास्तविकता इतकी साधी नाही आणि XHTML चाहत्यांना मागील पिढीतील मार्कअप भाषांबद्दल त्यांना आवडत असलेली कोणतीही गोष्ट सोडण्याची गरज नाही.

    सर्व प्रथम, लक्षात ठेवा की XHTML वाक्यरचना अस्तित्वात आहे. XHTML द्वारे लागू केलेले नियम एकतर मार्गदर्शक तत्त्वे म्हणून वापरले जातात (उदाहरणार्थ, घटकांच्या योग्य नेस्टिंगचे नियम) किंवा पर्यायी नियम म्हणून राखले जातात (उदाहरणार्थ, रिकाम्या घटकांसह ट्रेलिंग स्लॅश वापरण्याचे नियम).

    परंतु तुम्हाला XHTML वाक्यरचना नियम अनिवार्य करायचे असल्यास काय? तुम्ही (किंवा तुमचे कामाचे सहकारी) नकळत साध्या एचटीएमएलच्या सैल झालेल्या नियमांचा वापर करू शकता अशी तुम्हाला काळजी वाटू शकते. हे टाळण्यासाठी, तुम्हाला XHTML5 वापरण्याची आवश्यकता आहे, जे कमी सामान्य मानक आहे जे मूलत: XML-आधारित निर्बंधांमध्ये गुंडाळलेले HTML5 आहे.

    HTML5 दस्तऐवज एक XHTML दस्तऐवज बनवण्यासाठी, तुम्ही घटकामध्ये एक्सएचटीएमएल नेमस्पेस स्पष्टपणे नमूद करणे आवश्यक आहे, प्रत्येक घटक बंद करा, टॅग लोअरकेस आहेत याची खात्री करा, इ. खालील सूची या सर्व आवश्यकता पूर्ण करणाऱ्या कोडचे उदाहरण आहे:

    लहान HTML5 दस्तऐवज

    चला HTML5 शैलीत ब्राउझर हलवूया!

    XHTML टॅगमध्ये कॅपिटल अक्षरे वापरली जाऊ शकत नाहीत.

    या कोडच्या प्रमाणीकरणासाठी XHTML प्रमाणीकरणाची आवश्यकता आहे, जे हे सुनिश्चित करते की XHTML नियमांचे काटेकोर पालन केले जाते. W3C व्हॅलिडेटर यासाठी योग्य नाही, परंतु http://validator.nu वेबसाइटवरील व्हॅलिडेटर योग्य आहे, जिथे तुम्हाला प्रीसेट ड्रॉप-डाउन सूचीमध्ये आवश्यक मानक (म्हणजे XHTML) निर्दिष्ट करणे आवश्यक आहे. जोपर्यंत तुम्ही चाचणी करत असलेला कोड तुम्ही थेट मजकूर फील्डमध्ये पेस्ट करत नाही तोपर्यंत तुम्ही HTTP सामग्री-प्रकाराबद्दल ढिलाई करा चेकबॉक्स देखील तपासला पाहिजे.

    या चरणांचे अनुसरण करून, तुम्ही एक XHTML दस्तऐवज तयार करण्यात आणि ते सत्यापित करण्यात सक्षम व्हाल. तथापि, ब्राउझर अजूनही या दस्तऐवजाला नियमित HTML5 पृष्ठाप्रमाणे हाताळतील जे फक्त XML दस्तऐवज सारखे दिसण्याचा प्रयत्न करत आहेत. काहीही नाही अतिरिक्त नियमअशा पृष्ठावर प्रक्रिया करताना त्यांचा वापर केला जाणार नाही.

    जर तुम्हाला ब्राउझरने XHTML नियमांनुसार पृष्ठावर प्रक्रिया करण्याचीही इच्छा असेल, तर तुम्हाला तुमच्या वेब सर्व्हरला मानक मजकूर/html प्रकाराऐवजी ॲप्लिकेशन/xhtml+xml किंवा ॲप्लिकेशन/xml MIME प्रकारासह पेज सर्व्ह करण्यासाठी कॉन्फिगर करावे लागेल. तसे, XHTML5 ला समर्थन देणारे ब्राउझर या मार्कअपला नियमित HTML5 कोडपेक्षा वेगळ्या पद्धतीने हाताळतात. ते पृष्ठावर XML दस्तऐवज म्हणून प्रक्रिया करण्याचा प्रयत्न करतात आणि ते अयशस्वी झाल्यास (कोडमधील बगमुळे), ब्राउझर उर्वरित दस्तऐवजावर प्रक्रिया करणे थांबवते.

    यावरून कोणता निष्कर्ष निघतो? वेब डेव्हलपर्सच्या बहुसंख्यांसाठी, हौशीपासून गंभीर व्यावसायिकांपर्यंत, XHTML च्या कठोर नियमांनुसार खेळणे हे प्रयत्न करण्यासारखे नाही. अपवाद फक्त विकासाचा विशेष उपाय, जसे की XQuery आणि XPath सारखी XML साधने वापरून हाताळण्याची आवश्यकता असलेली सामग्री असलेली पृष्ठे.

    जर तुम्ही विचार करत असाल तर, XHTML मोडवर स्विच करण्यासाठी ब्राउझरला फसवणे शक्य आहे. हे करण्यासाठी, तुम्हाला फक्त एक्सएचटीएमएल किंवा एक्सएचटी विस्तारासह फाइलचे नाव बदलण्याची आवश्यकता आहे आणि नंतर ती उघडा. हार्ड ड्राइव्हतुझा संगणक. बहुतेक ब्राउझर (फायरफॉक्स, क्रोम आणि IE 9 सह) अशा पृष्ठास MIME XML सेटिंग्जसह वेब सर्व्हरवरून लोड केल्यासारखे मानतील. पृष्ठामध्ये काही किरकोळ त्रुटी असल्यास, ब्राउझर अंशतः प्रस्तुत केलेले पृष्ठ (IE 9), XML त्रुटी संदेश (Firefox) किंवा दोन्ही (Chrome) प्रदर्शित करेल.

    चला भाषा शिकण्यास सुरुवात करूया. HTML मजकूर "साधा मजकूर" आहे. दस्तऐवजाची सर्व हायपरटेक्स्ट वैशिष्ट्ये टॅग वापरून निर्दिष्ट केली आहेत - या मजकूरात समाविष्ट असलेल्या विशेष नोट्स.

    मजकूर असू द्या:

    चला हा मजकूर वेगळ्या प्रकारे लिहू, मजकूर कसा प्रदर्शित केला जावा यावरील सूचना समाविष्ट करू. आम्ही कोन ब्रॅकेटसह सूचना हायलाइट करतो.

    IN HTML भाषासंकेतांना टॅग म्हणतात. ब्राउझर टॅग सूचना पार पाडतो, म्हणजेच त्या न दाखवता, तो मजकूर बदल करतो. म्हणून, आम्ही स्क्रीनवर खालील पाहू:

    “आई फ्रेम धुत होती आणि मांजर बॉलशी खेळत होती. मुलाने मांजरीकडून चेंडू घेतला.

    टॅग - कोन कंसात कमांड. टॅगचे नाव हे ओपनिंग अँगल ब्रॅकेट नंतर लिहिलेली पहिली गोष्ट आहे, त्याच्या आधी मोकळी जागा न ठेवता! सिंगल टॅग आणि कंटेनर टॅग आहेत. सिंगल टॅग ही ब्राउझरची काही आज्ञा आहे जिथे ती निर्दिष्ट केली आहे त्या ठिकाणी अंमलात आणली जाते, उदाहरणार्थ, "रेषा काढा" ही आज्ञा:

    कंटेनर टॅगमध्ये ओपनिंग टॅग आणि क्लोजिंग टॅग असतात आणि त्यांचे संकेत त्यांच्या दरम्यान असलेल्या सर्व मजकूराचा संदर्भ देतात, ते म्हणतात: "कंटेनरमध्ये नेस्टेड." क्लोजिंग टॅगचे नाव ओपनिंग टॅगसारखेच आहे, परंतु नावाच्या आधी स्लॅश वर्ण आहे: “/”:

    आईने फ्रेम धुतली.

    .

    टॅगमध्ये विशेषता असू शकतात. विशेषता टॅगला पूरक आणि स्पष्ट करते. गुणांचा क्रम महत्त्वाचा नाही. उदाहरणार्थ, एचआर टॅगमध्ये रेषेची रुंदी, रेषेची जाडी SIZE, स्थान संरेखित (संरेखन) आणि रंग रंग दर्शवणारी WIDTH विशेषता असते. विशेषता मूल्ये दिलेले वैशिष्ट्य निर्दिष्ट करतात. वाक्यरचना नियम खालीलप्रमाणे आहे: टॅगच्या नावाच्या मागे किमान एक जागा असू शकते, त्यानंतर, स्पेसद्वारे विभक्त केल्यावर, तिप्पट फॉलो करू शकतात: विशेषता, “=” चिन्ह, मूल्य. हे मूल्य अवतरणांमध्ये संलग्न करण्याची शिफारस केली जाते, जरी एचटीएमएल मानक केवळ अशा मूल्यांना अनुमती देते लॅटिन अक्षरेआणि संख्या, अवतरण चिन्ह टाकू नका.

    स्क्रीनवरील प्रतिमा असे काहीतरी दिसेल.

    _____________________________________

    मानक तुम्हाला क्लोजिंग टॅग निहित असल्यास वगळण्याची परवानगी देतो. उदाहरणार्थ, टॅग

    त्यात एक बंद परिच्छेद आहे, परंतु पुढील परिच्छेद उघडण्यापूर्वी तो वगळला जाऊ शकतो. टॅग करा

    परिच्छेद सूचित करतो.

    आईने फ्रेम धुतली.

    मुलगी बॉलशी खेळत होती.

    काही विशेषतांना कोणतीही मूल्ये नसतात किंवा त्याऐवजी त्यांचा एकच अर्थ असतो आणि म्हणूनच टॅगमध्ये ही विशेषता फक्त सूचित करणे किंवा न दर्शवणे पुरेसे आहे. उदाहरणार्थ, FRAME टॅगमध्ये NORESIZE विशेषता आहे, जे सूचित करते की वापरकर्त्याला फ्रेमचा आकार बदलण्याची परवानगी नाही.

    HTML मधील टॅग (घटक) एकमेकांमध्ये नेस्टेड केले जाऊ शकतात, प्रोग्रामिंग भाषांमधील लूप किंवा कंडिशनल स्टेटमेंट्स प्रमाणे. घरट्याशिवाय टॅगचे छेदन प्रतिबंधित आहे.

    चुकीच्या नोंदीचे उदाहरण:

    ब्लॉक उदाहरण

    नेस्टेड परिच्छेदासह

    योग्य एंट्रीचे उदाहरण:

    ब्लॉक उदाहरण

    नेस्टेड परिच्छेदासह

    टॅग्ज व्यतिरिक्त आणि साधा मजकूर HTML कोडमध्ये तथाकथित वर्ण ऑब्जेक्ट्स किंवा एस्केप सीक्वेन्स असू शकतात: नामांकित आणि क्रमांकित घटक. वाक्यरचनात्मक किंवा भौतिकरित्या प्रतिबंधित असलेल्या दस्तऐवजातील वर्ण तसेच कीबोर्डवरून प्रविष्ट केले जाऊ शकत नाहीत अशा वर्णांचे प्रतिनिधित्व करण्यासाठी ते आवश्यक आहेत. उदाहरणार्थ,

    टॅग नावे आणि विशेषता नावे आणि मूल्यांसाठी केस महत्त्वाचे नाही. जरी काही शैली राखण्याची शिफारस केली जाते, उदाहरणार्थ, सर्व टॅगची नावे मोठ्या अक्षरात किंवा लहान अक्षरात किंवा लहान अक्षरात लिहा, परंतु प्रथम कॅपिटल अक्षराने. असा मजकूर एखाद्या व्यक्तीला समजणे सोपे आहे.

    अतिशय महत्त्वाची नोंद! ब्राउझरचा उद्देश क्लायंटला आपले पृष्ठ दर्शविणे आहे. एखाद्या त्रुटीवर ब्राउझरची नेहमीची प्रतिक्रिया म्हणजे त्रुटी सुधारण्याचा प्रयत्न करणे आणि जर ते अयशस्वी झाले, तर ते समजत नसलेले शब्द किंवा टॅग वगळा. हे चांगले आणि वाईट दोन्ही आहे. एकीकडे, परिणामी, ब्राउझर वापरकर्त्याला शक्य तितका मजकूर दर्शविण्याचा प्रयत्न करेल, परंतु, दुसरीकडे, या मजकूरात टॅग आणि स्क्रिप्टसह एक भाग समाविष्ट असू शकतो किंवा वास्तविक मजकूर असू शकत नाही. जर ब्राउझरला ते समजले असेल तर समाविष्ट करा, उदाहरणार्थ, टिप्पणी म्हणून. वेबसाइट डेव्हलपरसाठी, ब्राउझरचे हे वर्तन खूप त्रासदायक आहे. या वस्तुस्थितीसाठी तयार रहा की प्रथम ब्राउझर आपल्या त्रुटी काळजीपूर्वक दुरुस्त करेल, परंतु काही काळानंतर तो गोंधळून जाईल आणि पूर्वी कार्यरत तुकड्या आपल्यासाठी कार्य करणे थांबवतील. म्हणून, सल्ला: चुका करू नका, त्याऐवजी आधुनिक संपादकांचा वापर करा ज्यांना html नियमांची माहिती आहे आणि त्रुटी तुमच्या लक्षात आणून द्या.

    भाषेचा भाग म्हणून DOM

    HTML5 मध्ये, DOM ची संकल्पना प्रथम सादर केली गेली (जरी ती आधी अस्तित्वात होती, परंतु ती भाषेचा भाग नव्हती), आता HTML दस्तऐवज टॅग नव्हे तर ऑब्जेक्ट्सचा संच मानला जातो. म्हणून, असे कोणतेही HTML5 वाक्यरचना नाही. तथापि, कोड लिहिताना, तुम्ही HTML 4.01 किंवा XHTML 1.0 मध्ये स्थापित केलेल्या टॅग मार्कअप नियमांचे पालन करू शकता.

    HTML 4.01 वाक्यरचना

    पाचव्या आवृत्तीपूर्वी HTML मध्ये, कोड लिहिण्यासाठी अनेक नियम होते:

  • HTML 4.01 मध्ये वापरलेला लूज मोड
  • HTML 4.01 मध्ये वापरलेला कठोर मोड
  • फ्रेम्सशी संबंधित वाक्यरचना देखील होती. HTML5 मधील फ्रेम्स अप्रचलित मानल्या जातात, परंतु बरेच डेव्हलपर अजूनही त्यांचा वापर करतात कारण काही वेब ॲप्लिकेशन्स विकसित करताना फ्रेम्स अतिशय सोयीस्कर असतात.
  • XHTML 1.0 वाक्यरचना

    XHTML मध्ये, कोड लिहिण्यासाठी दोन नियम होते:

  • XHTML 1.0 मध्ये संक्रमण मोड वापरले
  • XHTML 1.0 मध्ये वापरलेला कठोर मोड
  • आधुनिक HTML5 वाक्यरचना

    HTML5 वापरताना, HTML दस्तऐवजाच्या सुरुवातीला एक doctype लिहून, तुम्ही वर सूचीबद्ध केलेल्या कोणत्याही भाषेतील वाक्यरचना (कोड लिहिण्यासाठीचे नियम) वापरू शकता किंवा HTML 4.01 आणि XHTML 1.0 एकमेकांशी जोडू शकता.

    उदाहरणार्थ, विशेषता मूल्ये attribute=value उद्धृत करू नका (मुक्त मोड HTML 4.01 - सैल), परंतु त्याच वेळी स्लॅश टाका सिंगल टॅग
    (कठोर मोड XHTML 1.0 - कठोर).

    XHTML (कठोर), सर्वाधिक प्राधान्य

    HTML5 मध्ये कोड लिहिताना अनुभवी एचटीएमएल कोडर सामान्यत: कठोर XHTML कठोर वाक्यरचना वापरतात, कारण ते कोडरला त्याच्या पायाच्या बोटांवर ठेवते, त्याला आराम करू देत नाही आणि त्यामुळे त्याचे संरक्षण होते. संभाव्य चुकाकोड मध्ये. तसेच, प्रोग्रामिंग शिकताना कठोर वाक्यरचना वापरणे उपयुक्त आहे, कारण तेथे वाक्यरचनाची काटेकोरता अत्यंत महत्त्वाची आहे.

    शेवटचे अपडेट: 11/18/2019

    HTML5 दस्तऐवज तयार करताना, आम्ही दोन भिन्न शैली वापरू शकतो: HTML आणि XML.

    HTML शैली खालील मुद्दे गृहीत धरते:

      घटकांमध्ये सुरुवातीचे टॅग नसू शकतात

      घटकांमध्ये एंड क्लोजिंग टॅग असू शकत नाहीत

      फक्त शून्य घटक (उदा. br , img , लिंक) स्लॅश /> सह बंद केले जाऊ शकतात

      टॅग आणि विशेषता नावांच्या बाबतीत काही फरक पडत नाही

      तुम्हाला कोट्समध्ये विशेषता मूल्ये जोडण्याची गरज नाही

      काही विशेषतांमध्ये मूल्ये नसतील (तपासलेले आणि अक्षम केलेले)

      विशेष पात्रे सुटलेली नाहीत

      दस्तऐवजात DOCTYPE घटक असणे आवश्यक आहे

    दस्तऐवज तयार करताना सवलतींवर आधारित ही तथाकथित "परवानगी देणारी" शैली आहे.

    XML वाक्यरचना वापरून HTML5 दस्तऐवज देखील वर्णन केले जाऊ शकते. या शैलीला "XHTML" देखील म्हणतात. जर सामग्री-प्रकार शीर्षलेख application/xml+xhtml असेल तर ते वापरले जाते. या शैलीसाठी खालील नियम वैशिष्ट्यपूर्ण आहेत:

      प्रत्येक घटकाला प्रारंभिक ओपनिंग टॅग असणे आवश्यक आहे

      स्टार्ट ओपनिंग टॅग असलेल्या नॉन-व्हॉइड घटकांना एंड क्लोजिंग टॅग देखील असणे आवश्यक आहे

      कोणताही घटक स्लॅश /> सह बंद केला जाऊ शकतो

      टॅग आणि विशेषता नावे केस-संवेदनशील असतात आणि सामान्यत: लोअरकेस असतात

      विशेषता मूल्ये अवतरणांमध्ये संलग्न करणे आवश्यक आहे

      मूल्यांशिवाय विशेषतांना अनुमती नाही (फक्त चेक करण्याऐवजी checked="checked")

      विशेष वर्ण सुटणे आवश्यक आहे

    चला दोन दृष्टिकोनांची तुलना करूया. HTML5 दृष्टीकोन:

    शीर्षक

    HTML5 दस्तऐवज सामग्री

    आणि एक्सएचटीएमएल दृष्टिकोन वापरून तत्सम उदाहरण:

    शीर्षक

    HTML5 दस्तऐवज सामग्री

    XHTML सिंटॅक्स वापरताना, आम्हाला दिलेल्या दस्तऐवजासाठी नेमस्पेस देखील निर्दिष्ट करणे आवश्यक आहे:

    HTML दस्तऐवज लिहिताना विशिष्ट शैलीची निवड प्रोग्रामर किंवा वेब डिझायनरच्या प्राधान्यांवर अवलंबून असते. मिश्र शैली बहुतेकदा वापरली जाते, जी पहिल्या आणि द्वितीय शैलींमधून नियम उधार घेते.

    त्याच वेळी, हे लक्षात घेतले पाहिजे की घटकावरील क्लोजिंग आणि ओपनिंग टॅगची उपस्थिती ब्राउझरद्वारे घटक चुकीच्या पद्धतीने व्याख्या केली जाण्याची शक्यता कमी करते.

    तसेच, कोट्समध्ये विशेषता मूल्ये संलग्न केल्याने संभाव्य त्रुटी टाळण्यास मदत होईल. अशा प्रकारे, वर्ग विशेषता एका ओळीत अनेक मूल्ये घेऊ शकते. उदाहरणार्थ: . परंतु जर आपण अवतरण वगळले तर, "navmenu" हे मूल्य म्हणून वापरले जाईल आणि ब्राउझर "bigdesctop" ला स्वतंत्र विशेषता म्हणून अर्थ लावण्याचा प्रयत्न करेल.

    अडचणी उद्भवल्यास, तयार करणे किती योग्य आहे html मार्कअप, नंतर ते https://validator.w3.org येथे वैधकर्ता वापरून तपासले जाऊ शकते:

    आम्ही वेब पृष्ठ कोड मजकूर फील्डमध्ये पेस्ट करू शकतो आणि तळाशी असलेल्या "चेक" बटणावर क्लिक केल्यानंतर, सत्यापनकर्ता एकतर लाल रंगात त्रुटी प्रदर्शित करेल किंवा हिरव्या रंगात आम्हाला सूचित करेल की कोणत्याही त्रुटी नाहीत आणि कोड प्रमाणित केला गेला आहे.

    
    2024, applelavka.ru - संगणकाचा अभ्यास करणे. फक्त काहीतरी क्लिष्ट. गॅझेट