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

Posted by Hassan Kamal
Hassan Kamal
Courses Plus Student 1,879 Points

hey all !! The HTML validator has found 1 error and 1 warning. below is the link. Would appreciate if anyone can..

hey all !!

The HTML validator has found 1 error and a warning. below is the link. Would appreciate if anyone can help me out as to what it exactly mean? thanks.

http://snag.gy/WlzHR.jpg

4 Answers

Cissie Scurlock
Cissie Scurlock
11,072 Points

The error happens because of the pipe character. If you change the | to %7C it should pass.

Hassan Kamal
Hassan Kamal
Courses Plus Student 1,879 Points

Hello Cissie,

had the pipe replaced with '%7C' but no luck. below is the complete code, try validating it if you can http://validator.w3.org/ maybe i am missing out on something. Thanks for the help.

'' <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Hassan Kamal | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Changa+One %7C Open+Sans:400italic,700italic,400,700,800" type="text/cs"> <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>Hassan Kamal</h1> <h2>Designer</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 modes in Photoshop.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt=""> <p>Trying to create an 80's style of glows.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>Drips created using Photoshop brushes.</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>© 2014 Hassan Kamal.</p> </footer> </div> </body> </html> ''

Cissie Scurlock
Cissie Scurlock
11,072 Points
Cissie Scurlock
Cissie Scurlock
11,072 Points

Hmm, try deleting the spaces around the %7C. Also at the end of that line it should say "type=text/css" but is says "cs"

Hassan Kamal
Hassan Kamal
Courses Plus Student 1,879 Points

Wow It works :) .. but could you please explain how? appreciate it :)

Cissie Scurlock
Cissie Scurlock
11,072 Points

I had the same problem with my project. It has something to do with the fact that the charset is set to UTF-8 and it doesn't recognize the pipe character. Here's some info from Stack Overflow: http://stackoverflow.com/questions/22466913/google-fonts-url-break-html5-validation-on-w3-org.

Hassan Kamal
Hassan Kamal
Courses Plus Student 1,879 Points

Thanks for sharing the info Cissie. :) and congratulation on given the best answer.. :)

Thanks again.

Cissie Scurlock
Cissie Scurlock
11,072 Points

Happy to help. Thanks for gifting me the best answer.

Kim Cowart
Kim Cowart
32,918 Points
Kim Cowart
Kim Cowart
32,918 Points

Perhaps a space or comma between italics700 and italics400?

Hassan Kamal
Hassan Kamal
Courses Plus Student 1,879 Points

Hey Kim!!

just checked it but no luck, it keeps pointing onto the same Line 7, Column 142 which is the greater then sign. :(

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,254 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,254 Points

As for the second one, to make it valid do as the warning suggests. That said, warnings are not crucial and the code will validate regardless. :-)

Hassan Kamal
Hassan Kamal
Courses Plus Student 1,879 Points

hi Jonathan

ya i am not much worried about the warning but with an error message would the code validate fine?

Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,254 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,254 Points

I think it all depends on if you're happy to stick with it for that line of code i.e. the error

It looks like you're looking to get a font from a Content Delivery Network, so use a font hosted on Google's server. Which is fine, but sometimes there's little or no way of writing valid code without messing up the correct code to use the font properly. .