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

Hello, my url is invalid. Can someone help me

here is my index.html. it is said to be 'invalid' when I plug it into validator.w3.org. Can someone help me out? Thanks!

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Vitrerie d'Urgence | Service d'Urgence Montreal</title> <link rel="stylesheet" href="css/normalize.css"> <link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/responsive.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <header> <a href="index.html" id="logo"> <h1>Vitrerie d'Urgence</h1> <h2>Service d'Urgence Montreal</h2> </a> <nav> <ul> <li><a href="index.html" class="selected">Portfolio</a></li> <li><a href="about.html">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <div id="wrapper"> <section> <ul id="gallery"> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> <p>Experimentation with color and texture.</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/numbers-02.jpg" alt=""> <p>Playing with blending modees in Photoshop.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt=""> <p>Playing to create 80's.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>Drips using Photoshop.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>Creating shapes using repetition.</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com/nickrp"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a> <a href="http://facebook.com/nickpettit"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a> <p>© 2015 Vitrerie d'Urgence.</p> </footer> </div> </body> </html>

3 Answers

Gavin Ralston
Gavin Ralston
28,770 Points

If it's just the validation error for the google fonts link, be sure to replace the pipe characters with %7C

So that means

<link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'>

becomes instead

<link href='http://fonts.googleapis.com/css?family=Changa+One%7COpen+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'>

Wow! thank you so much I appreciate it

Gavin Ralston
Gavin Ralston
28,770 Points

Some of the videos here list that in the teacher's notes section, others don't. If you google that validation error there's a bunch of hits on Stack Overflow, as well as a few questions about this error in the Treehouse Forums, too.

Gavin Ralston
Gavin Ralston
28,770 Points

No problem. It can be frustrating when you're following along and still get a strange error or unexpected results.

The upside of this is that you'll frequently be googling and researching new errors, bugs, and "undocumented features" all the time anyway. Things change rapidly, and that validation error is one example of how the HTML5 "rolling release" way of handling changes will have you going back to the search engine frequently. :)

Gavin Ralston
Gavin Ralston
28,770 Points

Well, one thing you'll want to remember is to add the doctype at the head of your file:

<!doctype html>

That should eliminate a few errorors.

Additionally, you'll want to check here on Treehouse or Google for ways to update the google fonts link. You need to get rid of the pipe characters | and use a suitable replacement for them in the url.

Finally, you'll want to check to make sure all your div tags are matched up. It looks like one is floating around by itself, not matched up to anything.

Gavin Ralston
Gavin Ralston
28,770 Points

Try reading the warnings in the vaildator output, and just "solve" the ones you think you can get a handle on.

Then post to the forums with the specific warning or error you're having trouble with. It'll make replying to your questions a lot easier.

Thank you, This is what it tells me

Line 7, Column 142: Bad value http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800 for attribute href on element link: Illegal character in query: not a URL code point. …ne|Open+Sans:400italic,700italic,400,700,800" rel="stylesheet" type="text/css"> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.

Nick Calabro
Nick Calabro
16,335 Points

Are we assuming you have the html tags wrapped around the whole thing - and the body and head tags?

It has to do with my google fonts link it says the error is the > sign at the end of the link... any other errors seen are due errors when i copy pasted it onto the site.