Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

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

Nick Marsh
Nick Marsh
14,255 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