Google fonts URL break HTML5 Validation on w3.org

html w3c-validation google-font-api
Octavian picture Octavian · Mar 17, 2014 · Viewed 60.3k times · Source

I load 3 fonts in different sizes using this HTML tag:

<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">

Till ~1/2 weeks ago this was supported by w3.org validator for HTML5; now it gives this error:

 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.

What's the things the W3C Markup Validator does not like now?

Answer

steveax picture steveax · Mar 18, 2014

URL encode the | (pipe characters) in the href attribute (%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">

Related questions

Are (non-void) self-closing tags valid in HTML5?

The W3C validator doesn't like self-closing tags (those that end with "/>") on non-void elements. (Void elements are those that may not ever contain any content.) Are they still valid in HTML5? Some examples of accepted void elements: <…

Read More
div inside table

Can somebody tell me whether div inside a table is allowed or not according to w3c

Read More
"Attribute name not allowed on element div at this point"

I am getting a W3V validator error that I can't understand: Line 31, Column 61: Attribute name not allowed on element div at this point. That is this row: <div name="message" class="jGrowl bottom-right errorGrowl"></div> …

Read More