Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML How to Make a Website Responsive Web Design and Testing Website Testing

Nick Marsh
Nick Marsh
14,763 Points

Error Found

Hola, I keep getting this message that my website is invalid: Bad value http://fonts.googleapis.com/css?family=Open+Sans|Changa+One for attribute href on element link: Illegal character in query: not a URL code point. …gleapis.com/css?family=Open+Sans|Changa+One' rel='stylesheet' type='text/css' > Syntax of IRI reference: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.

Any reason why?

Thanks

4 Answers

Justin Hunter
PLUS
Justin Hunter
Courses Plus Student 11,484 Points

I have not figured a reason why, but I had the same error. Everything renders properly and the code is cut directly from Google, so I wouldn't worry about it.

Daniel Temiagin
Daniel Temiagin
5,741 Points

Try This Go to google.com/webfonts, search for the font you want to use on your page using the search box e.g Magra. Toward the right close to the add to collection click the quick use, then scroll down on the page, you should see a link similar to this """<link href='http://fonts.googleapis.com/css?family=Magra' rel='stylesheet' type='text/css'>""""" copy the link and add it to your heading on your html file....The open your css style file and apply the font as you want on you stylesheet ..Example body { font-family: 'magra', sans-serif, etc.. } to you css file....Let me know if if work

Daniel Temiagin
Daniel Temiagin
5,741 Points

Try This Go to google.com/webfonts, search for the font you want to use on your page using the search box e.g Magra. Toward the right close to the add to collection click the quick use, then scroll down on the page, you should see a link similar to this """<link href='http://fonts.googleapis.com/css?family=Magra' rel='stylesheet' type='text/css'>""""" copy the link and add it to your heading on your html file....The open your css style file and apply the font as you want on you stylesheet ..Example body { font-family: 'magra', sans-serif, etc.. } to you css file....Let me know if if work

Daniel Temiagin
Daniel Temiagin
5,741 Points

Your can also Try This, Download the fonts you want to use on a seperate folder and name the folder "fonts" or name it to what you want Now write this code to your internal or external css style

@font-face{ font-family: 'font name', "back-up font name"; font-weight: 400l; font-style: normal; src: url('fonts/name-of-font') format('format') src: url('fonts/name-of-font') format('format') ----if you are adding more than a single font------- }

The nested format should be replace with the format of the font---- ttf = truetype, woff = woff, svg = svg, eot = embeded-opentype