ब्राउज़र संगतता के बारे में चिंता किए बिना मैं कौन से एचटीएमएल 5 टैग का उपयोग कर सकता हूं?


93

मैं पीसी पर उपयोग के लिए एक वेब ऐप बना रहा हूं। IE8 और इसके बाद के ब्राउजर्स के साथ संगतता के मुद्दों को रोकने के लिए HTML5 टैग से दूर रहने के लिए क्या हैं?

नोट: इस विषय पर अधिकांश प्रश्न 1-3 वर्ष पुराने हैं।


48
अप-टू-डेट ब्राउज़र संगतता जानकारी के लिए caniuse.com और html5please.com की जाँच करें ।
rink.attenders.6

@ शिम के बारे में अधिक जानने के लिए कोई लिंक लिंक करें?
स्वैग


47
IMHO आप ब्राउज़र संगतता की चिंता किए बिना वेब विकास में कुछ भी उपयोग नहीं कर सकते ...
Uooo

2
HTML5 उपयोग के तीन स्तर देखें । स्तर 1 सामान एक समस्या के बिना इस्तेमाल किया जा सकता है। स्तर 2 सुविधाओं को इनायत से नीचा दिखाना। लेवल 3 की विशेषताओं के लिए पॉलीफिल की आवश्यकता होती है यदि पुराने ब्राउज़रों के लिए समर्थन एक चिंता का विषय है।
मथियास बिएनेंस

जवाबों:


100

आपने पूछा है कि HTML5 टैग से दूर रहने के लिए क्या है।

वैसे मेरी जानकारी से HTML5 के कुछ टैग अर्थगत कारणों से बनाए गए थे। उदाहरण के लिए निम्नलिखित की तरह।

<article> <section> <aside> <nav> <header> <footer> ..ect

ये साथ काम करने के लिए लगभग ठीक हैं, और बस थोड़े सीएसएस जैसे की आवश्यकता है। display: block;ज्यादातर ब्राउज़रों में सामान्य रूप से काम करने के लिए, हालांकि पुराने ब्राउज़र में। इंटरनेट एक्सप्लोरर आपको इसके अनुकूल होने के लिए जावास्क्रिप्ट में एक तत्व बनाने के लिए आवश्यक है।

यहाँ एक उदाहरण है।

document.createElement('article');

<article>पुराने Internet Explorer में उपयोग के लिए तत्व सेट करेगा ।

अधिक उन्नत एचटीएमएल 5 टैग्स के लिए जिन्हें कार्य करने के लिए जावास्क्रिप्ट कार्यक्षमता की आवश्यकता होती है, वे कुछ इस प्रकार हैं।

<audio> <video> <source> <track> <embed> And most importantly <canvas> 

पुराने ब्राउज़रों में इन तत्वों का समर्थन करना मुश्किल है। हालांकि मैंने नीचे ब्राउज़र पॉलीफ़िल को पार करने के लिए एक लिंक शामिल किया है, हालाँकि मैंने व्यक्तिगत रूप से उनकी जांच नहीं की है।

तो मैं कहूंगा कि किसी भी ऐसे तत्व की आवश्यकता नहीं है जो जावास्क्रिप्ट कार्यक्षमता के लिए थोड़ा सा क्रॉस ब्राउज़र समर्थन कोड के साथ उपयोग करने के लिए ठीक है।

यदि आपका लक्ष्य > IE8 है तो आपको ठीक होना चाहिए यदि आप एक शिव का उपयोग करते हैं।

पुराने ब्राउज़र को क्या कहते हैं? <आईई 9

HTML5 टैग के लिए ब्राउज़र समर्थन आज है।

<section>, <article>, <aside>, <header>, <footer>, 
<nav>, <figure>, <figcaption>, <time>, <mark>

8 से कम इंटरनेट एक्सप्लोरर द्वारा समर्थित नहीं हैं, लेकिन इस तरह तय किया जा सकता है।

सीएसएस:

section, article, aside, header, footer, nav, figure, figcaption{
   display: block;
}
time, mark { 
    display: inline-block;
}

जावास्क्रिप्ट:

var elements = ['section', 'article', 'aside', 'header', 'footer', 'nav', 'figure', 'figcaption', 'time', 'mark'];
for( var i = 0; i < elements.length; i++ ) {
    document.createElement(elements[i]);
}

और <IE 9<audio> <video> <canvas> में समर्थित नहीं हैं

<embed>तत्व में आंशिक समर्थन हासिल है IE8>


आपको इस टैग पर भी गौर करना चाहिए।

 <meta http-equiv="X-UA-Compatible" content="IE=edge">

यह metaटैग इंटरनेट एक्सप्लोरर को पेज को उच्चतम IE मोड में प्रदर्शित करने के लिए कहता है, बजाय संगतता मोड में जाने और पेज को IE7 या 8 के रूप में प्रस्तुत करने के। उस पर अधिक जानकारी यहाँ


HTML5 हेल्पर लिंक


किक स्टार्ट के लिए आप एचटीएमएल 5 बॉयलरप्लेट की जांच कर सकते हैं

ब्राउज़र संगतता समर्थन तालिकाओं के लिए आप देख सकते हैं - http://caniuse.com/

HTML5 शिव - https://github.com/afarkas/html5shiv

HTML5 पॉलीफ़िल की सूची - https: //github.com/Modernizr/Modernizr/wiki / ...

अपडेट करें

जैसा कि एक टिप्पणी में उल्लेख किया गया है

मेटा टैग X-UA- संगत के साथ सावधान रहें। यदि आप html5 बॉयलरप्लेट जैसी किसी चीज़ का उपयोग करते हैं जिसमें तत्व के आसपास सशर्त टिप्पणियां हैं (यह html5 doctype IIRC के साथ भी होता है), तो आप IE9 में समस्याओं के साथ ही IE7 मानकों के लिए मजबूर कर सकते हैं। IE फिर से हमला करता है

आप इस पर गौर करना चाहते हैं, मेरे पास इस समय इसे वापस करने के लिए कुछ भी नहीं है।


इसके अलावा, यदि आप निर्दिष्ट कर सकते हैं, तो पुराने IE क्या है? 6,7,8?
स्वैग

4
आम तौर पर पुराना IE है <IE9
iConnor

मेटा टैग X-UA- संगत के साथ सावधान रहें। यदि आप html5 बॉयलरप्लेट जैसी किसी चीज़ का उपयोग करते हैं जिसमें <html>तत्व के आसपास सशर्त टिप्पणियां हैं (यह html5 doctype IIRC के साथ भी होता है), तो आप IE9 में समस्याओं के साथ ही IE7 मानकों के लिए मजबूर कर सकते हैं । IE फिर से हमला करता है।
cheezone

जानकारी के लिए धन्यवाद, किसी भी ब्लॉग पोस्ट या कुछ जानकारी है कि मैं इस मुद्दे के बारे में जवाब में जोड़ सकते हैं अच्छा होगा :)
iConnor

12

आम तौर पर, मुद्दे हैं।

मुझे बताया गया है कि आपके प्रश्न को HTML 5 टैग के बारे में पूछने के लिए कहा गया है, लेकिन यह किसी भी जावास्क्रिप्ट के प्रकाश में नई सुविधाओं को देखने के लिए उपयोगी है जो आपको मिल सकती हैं या लिख ​​सकते हैं।

व्यवहार में, अनुशंसित विधि विशिष्ट ब्राउज़र के बजाय सुविधा के अस्तित्व के लिए परीक्षण करना है। Modernizr स्क्रिप्ट इस संबंध में सहायक हो सकता है, लेकिन यह भी की रिपोर्ट देखते हैं एचटीएमएल 5 में undetectable सुविधाओं

कुछ सुविधाएँ जैसे local storageIE8 पर वापस जाती हैं।

अन्य, जैसे FileReader, IE10 / Firefox21 / Chrome27 की आवश्यकता होती है

वर्तमान जानकारी के लिए, http://caniuse.com देखें


1
मुझे ध्यान देना चाहिए कि लोकलस्टोरीज और फाइलरीडर एचटीएमएल टैग नहीं हैं, ओपी ने पूछा कि एचटीएमएल 5 टैग में संगतता समस्याएँ क्या हैं।
इकोनोर ५

अरे हां। शब्दार्थ टैग की यह एक बड़ी सूची है जो HTML5 को आपके पृष्ठ को अधिक मशीन पठनीय और शायद अधिक एसईओ अनुकूल [या शायद नहीं] बनाने के लिए धकेल रही है। कुछ नए इनपुट तत्व हैं। मुझे लगता है कि इनमें से कुछ में एक या अधिक ब्राउज़र में समस्याएँ हो सकती हैं। मुझे लगता है कि caniuse के पास वह जानकारी हो सकती है ...
पॉल

8

HTML 5 को सामान्य रूप से लिखें और पुराने ब्राउज़रों के साथ संगतता सुनिश्चित करने के लिए शम्स का उपयोग करें। आपको केवल जावास्क्रिप्ट एपीआई के साथ वास्तव में सावधान रहने की आवश्यकता है, क्योंकि वे शायद ही शिम-सक्षम हैं। यदि आप संगतता के लिए HTML 4 को आधारभूत बनाने की कोशिश कर रहे हैं, तो HTML 5 का उपयोग करने का कोई मतलब नहीं है।


7
मैं ख़ुशी <!DOCTYPE html>से शीर्ष पंक्ति के रूप में उन शापित लंबी बदसूरत चीज़ों के बजाय पहले ही समय में हम पर प्रयोग किया था।
पॉल

यदि आपके HTML 4 और "HTML 5" दस्तावेज़ों के बीच केवल यही एक चीज़ है ... तो बात क्या है? :)
छल

4

ब्राउज़र में क्या टैग उपलब्ध हैं, और प्रत्येक टैग के लिए किस स्तर के समर्थन की एक त्वरित तुलना के लिए, html5test.com एक महान संसाधन है।


2

आप एक HTML5 कंपेटिबिलिटी मैट्रिक्स की तलाश में हैं

http://en.wikipedia.org/wiki/Comparison_of_layout_engines_(HTML5)


2
ध्यान दें: "इस लेख की तथ्यात्मक सटीकता को आउट-ऑफ-डेट जानकारी के कारण समझौता किया जा सकता है। हाल की घटनाओं या नई उपलब्ध जानकारी को प्रतिबिंबित करने के लिए कृपया इस लेख को अपडेट करें। (मार्च 2013)"
gersande

1
हाँ, यह संभवतः सच है, लेकिन सामान्य रूप से Google में html5 compatabilityमुझे यकीन है कि कई संसाधन हैं।
ब्रैडगोनसर्फिंग

2

इसके अलावा, सबसे अच्छा क्रॉस ब्राउज़र संगतता के लिए, मेरा सुझाव है कि आप एरिक मेयर द्वारा बनाए गए इस रीसेट का उपयोग करें। http://meyerweb.com/eric/tools/css/reset/ यह उन तत्वों को बनाता है जो एक ब्राउज़र से दूसरे ब्राउज़र में भिन्न होते हैं, सभी ब्राउज़रों में समान व्यवहार करने के लिए।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.