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
Tyler Rood
775 PointsW3C HTML Validator Error
When I pasted my "index.html" code into the Direct Input screen, and hit check I got a message saying I had 1 error and 3 warnings. I cross checked all of Nick's code and couldn't find what the error was even though the site told me what it was. When I checked my CSS code it worked. I have added a link to a screenshot I took of the error and a google doc of my HTML code.
4 Answers
Jason Anello
Courses Plus Student 94,610 PointsHi Tyler,
You need to url encode the vertical bar | in the google fonts url. Replace it with %7C
Tyler Rood
775 PointsThat worked! Thank you so much! Although I'm wondering why Nick's code worked in the video. Also, I still have 1 more additional warning than he had in the video.
Jason Anello
Courses Plus Student 94,610 PointsForgot to mention that the "warning" about "section lacks heading" probably will go away once the other error is fixed.
All it is though is a warning that tells you your section element doesn't contain a heading. It's not necessarily something you need to fix. It's just that in html5 usually a section element has a heading element in it to identify what that section is about.
Errors are more serious than warnings. You should try to fix all errors but not necessarily all warnings.
Jason Anello
Courses Plus Student 94,610 PointsI believe that the validator was updated after Nick recorded the video. At the time, it wasn't properly catching the vertical bar but now it does. That's my quess anyways.
Which other warning are you talking about?
There's a few warnings you can ignore. One is about the "html5 conformance checker" and the other may have been something about the charset.
Tyler Rood
775 PointsI would agree that the '''section''' warning isn't something I need to fix. And I'm not sure what the other warning is, just that there's an extra one. It could be an extra warning due to the validator being updated. I think Treehouse should add something in the lesson about how you need to replace the bar.
Thank you for your help and HTML advise!
Caleb King
32,777 PointsTyler Rood remember when following along with the instructors, some pieces of code will become available in the later tutorials, which may leave you with some errors. Debugging is a very useful skill when programming. Keep up the good work!
Tyler Rood
775 PointsThanks! I didn't think about that. Although it'd be nice to know what I've done wrong.
Tyler Rood
775 PointsI tried replacing all of my HTML documents with the posted files and I'm still getting the same Error.
Caleb King
32,777 Pointspost your code on the forum.
Tyler Rood
775 PointsIn what way? Seems like posting it as answer to the question isn't working.
Tyler Rood
775 Points<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Tyler Rood | Designer</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>Tyler Rood</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/TylerRDesigns"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a> <a href="http://facebook.com/TylerRoodDesigns"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a> <p>© 2014 Tyler Rood.</p> </footer> </div> </body> </html>
Jason Anello
Courses Plus Student 94,610 PointsHere's a post on how to post code in the forums.
Tyler Rood
775 PointsThank you. I will use that from now on.
Tyler Rood
775 PointsTyler Rood
775 PointsI just noticed that Nick's code in the video is missing the code in line 10 of mine. He added it in the previous video.