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
Amil Boddie-Willis
9,661 PointsHTML - My Website...
I keep getting this, every time I try and validate my website, using the validator website that you directed me to:
Error found while checking this document as HTML5! Result: 1 Error, 3 warning(s)
Should I be concerned, at all? - Just wanted to know before I considered publishing my website - Thanks...
Amil
P.S.
Here's the coding that I put in:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vision Central</title>
<link rel="stylesheet" href="css/normalize.css">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700,800|Share+Tech+Mono' 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>
<div>
<header>
<h1>
<img class="title" src="img/1362.jpg" alt="Title Photo">
</h1>
<nav>
<ul>
<li><a href="index.html" class="selected">Homepage</a></li>
<li><a href="biography.html">Biography</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<div id="everything">
<section>
<ul id="homepage">
<li>
<a href="img/write.jpg">
<img src="img/write.jpg" alt="">
</a>
</li>
</ul>
</section>
</div>
<footer>
<a href="http://facebook.com/Amil"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a>
<a href="http://twitter.com/abw2"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a>
<p>© 2014 Vision Central.</p>
</footer>
</div>
</body>
</html>
2 Answers
Mike Hickman
19,817 PointsHi Amil,
If you scroll down after the validation test it will show you the exact error and warnings. It's saying invalid character in query for the link with your Google Fonts URL. I looked into a bit, and the "|" before the Share Tech Mono code is invalid in HTML 5.
Instead, you have to use the actual unicode that creates that character. Replace "|" with "%7C" in its place, and your code will pass. I found a link with all of the unicode URL replacements in case you need it in the future.
http://www.tutorialspoint.com/html5/html5_url_encoding.htm
Have fun!
-Mike
Pav Cieslak
808 PointsHi Amil,
here's a link to another teamtreehouse Forum post on the same subject with a good explanation of why is it happening.
Its all about UTF-8 encoding. Once u swap over | symbol with %7C your code validates just fine with no errors.
all the best Pav
Amil Boddie-Willis
9,661 PointsAmil Boddie-Willis
9,661 PointsIt worked - My website has been cleared - Thanks a bunch... P :)
Amil