Google फोंट URL w3.org पर HTML5 सत्यापन तोड़ते हैं

187

मैं इस HTML टैग का उपयोग करके विभिन्न आकारों में 3 फोंट लोड करता हूं:

<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Open+Sans:400,600,300,800,700,400italic|PT+Serif:400,400italic|Bree+Serif">

~ 1/2 सप्ताह पहले तक यह HTML3 के लिए w3.org सत्यापनकर्ता द्वारा समर्थित था ; अब यह त्रुटि देता है:

 Line 14, Column 163: Bad value http://fonts.googleapis.com/css?family=Open+Sans:400,600,300,800,700,400italic|PT+Serif:400,400italic|Bree+Serif for attribute href on element link: Illegal character in query: not a URL code point.

W3C मार्कअप वैलिडेटर को अब कौन सी चीजें पसंद नहीं हैं?

html w3c-validation google-font-api

— ऑक्टेवियन
स्रोत

346

URL |(विशेषता में पाइप वर्ण) को एन्कोड करता है href( %7C):

<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Open+Sans:400,600,300,800,700,400italic%7CPT+Serif:400,400italic%7CBree+Serif">

— steveax
स्रोत

1

क्या यह Google द्वारा निर्मित URL या w3 सत्यापनकर्ता के साथ कोई समस्या है? क्या वास्तव में किसी भी युक्ति को HTML विशेषता में एन्कोडेड होने के लिए पाइप वर्ण की आवश्यकता होती है?

— मिको रानाल्टेन 6

2

@MikkoRantalainen, RFC 1738 नोट करता है कि पाइप वर्ण असुरक्षित है: अन्य वर्ण असुरक्षित हैं क्योंकि गेटवे और अन्य परिवहन एजेंट कभी-कभी ऐसे वर्णों को संशोधित करने के लिए जाने जाते हैं। ये वर्ण "{", "}", "|", "\", "^", "~", "[", "]", और "` "हैं।

— स्टीवेक्स

2

मैं कच्चे UTF-8 को UTF-8 में मान्य होने की अपेक्षा करूँगा कि अन्य वर्णों को कूटबद्ध किए बिना HTML को कूटबद्ध किया जाए, लेकिन जो HTML उदाहरण के लिए उपयोग किया जाता है &, "और '। और उन विशेष वर्णों को HTML नियमों (जैसे &ampआदि) द्वारा कूटबद्ध करने की आवश्यकता होगी । उपयोगकर्ता एजेंट को तब आरएफसी 3987 का अनुसरण करने और आईआरआई को प्रतिशत में इनकोडेड UTF-8 में बदलने के लिए HTTP ( tools.ietf.org/html/rfc3987 ) पर सबमिट करने की उम्मीद है ।

— मिको रांटलैनेन

10

इस सत्यापन समस्या को ठीक करने के 2 तरीके हैं:

URL तत्व |की hrefविशेषता में (वर्टिकल बार / लाइन) वर्ण को एनकोड करता है link(जैसे %7C):
```
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Open+Sans:400,600,300,800,700,400italic%7CPT+Serif:400,400italic%7CBree+Serif">
```

कई linkतत्वों के साथ अलग फोंट शामिल करना :

<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Open+Sans:400,600,300,800,700,400italic">
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=PT+Serif:400,400italic">
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Bree+Serif">

— dippas
स्रोत

2

मुझे पता है कि यह पुरानी पोस्ट है, लेकिन क्या किसी को पता है कि <link>टैग अलग करने का कोई प्रदर्शन (डिस) फायदा है ? क्या एक फोन में कई फोंट होने पर गूगल सेक करता है?

— पैट्रिक मूर

@PatrickMoore 2 चीजें: ए) आपका सर्वर अपलोड / रिस्पॉन्स स्पीड बनाम आपका एंड-यूजर डाउनलोड स्पीड बी) एक और कनेक्शन बनाने का समय (सर्वर रिस्पांस टाइम बनाम एंड-यूजर रिस्पांस टाइम), सैद्धांतिक रूप से, यदि आप 2 "भारी" फोंट लोड कर रहे हैं और आपका पृष्ठ अन्यथा तेजी से लोड हो रहा है, उन्हें अलग से लोड कर रहा है (पार्सल तरीके से) तेजी से लोड हो सकता है। लेकिन यह वास्तव में a) और b) पर निर्भर करता है

— jave.web

7

http://www.utf8-chartable.de/

आपको चरित्र को बदलना होगा | इसके संबंधित UTF-8 वर्ण द्वारा, जो देता है

href="http://fonts.googleapis.com/css?family=Cookie%7cAmaranth%7cKaushan+Script%7cCousine%7cBilbo+Swash+Caps%7cRancho&amp;effect=shadow-multiple"

— lapouth
स्रोत

-3

मेरा मामला पागल लाइन ब्रेक चरित्र था। कृपया संलग्न छवि देखें।

— खैर स्मिथ
स्रोत

-4

मैं भगदड़ और के साथ " & amp; " और काम करता है ठीक है, उदाहरण के:

<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />

— ऑस्कर टेलो
स्रोत

1

यह सवाल |चरित्र के बारे में है; न; &;-)

— jave.web