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
Matthew Lehman
5,282 Pointsso i got a few errors when I tried to validate my index.html. may someone please take a look please?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Matthew Lehman | Designer</title>
<link rel="stylesheet" href="css/normalize.css">
<link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400,400italic,700,700italic,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>Matthew Lehman</h1>
<h2>Designer</h2>
</a>
<nav>
<ul>
<li><a href="index.html">Portfolio</a></li>
<li><a href="about.html" class="selected">About</a></li>
<li><a href="contacts.html">Contacts</a></li>
</ul>
</nav>
</header>
<div id="wrapper">
<section>
<img src="img/matthew.jpg" alt="Photograph of Matthew Lehman" class="profile-photo">
<h3>About</h3>
<p>Hi, I'm Matthew Lehman. This is my personal portfolio where I share my work. When I'm not doing this in my free time, I work in the fitness industry. It's difficult to actually give myself a specific job title, since I do many different types of tasks at my job. </p>
<p>If you'd like to follow me on Twitter, my user name is <a href="http://twitter.com/mattyind">@mattyind</a></p>
</section>
<footer>
<a href="http://www.twitter.com/mattyind"><img src=img/twitter-wrap.png alt="Twitter Logo" class="social-icon"></a>
<a href="http://www.facebook.com"><img src=img/facebook-wrap.png alt="Facebook Logo" class="social-icon"></a>
<p>© 2015 Matthew Lehman</p>
</footer>
</div>
</body>
</html>
Rich Bagley
25,869 PointsJust updated your question so it's a little clearer to view. You can view a guide on markdown here.
-Rich
2 Answers
Rich Bagley
25,869 PointsHi Matthew,
Would you be able to post the validation error please?
At a guess I'd say one of the issues would be this line:
<link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400,400italic,700,700italic,800' rel='stylesheet' type='text/css'>
Can you try escaping the pipe (|) character in that line to %7C please? It should then look like this:
<link href='http://fonts.googleapis.com/css?family=Changa+One%7COpen+Sans:400,400italic,700,700italic,800' rel='stylesheet' type='text/css'>
Hope that helps.
-Rich
Matthew Lehman
5,282 PointsThank you so much
I replaced it, and it worked.
Thanks so much
Rich Bagley
25,869 PointsNo problem :)
-Rich
Matthew Lehman
5,282 Pointsthanks again for helping me out yesterday.
But I did have one more question. How did you know to add %7? I just went to google fonts again just to see what would happen. And again it gave me the old link that included this key (I). instead of the (%7) key.
Just like to know this for my future reference when I start designing actual webpages. let know once again if you can help me out.
Thanks
MATT
Grace Kelly
33,990 PointsHi Matthew,
The first thing I can see is you don't have a body tag before your content, you need to add it after your stylesheet links and before your "body" of content, it would also be a good idea to put a closing body tag at the end of your content, just before you end your html :)
Secondly on your links to the css i would include type="text/css" like so:
<link rel="stylesheet" type="text/css" href="css/main.css">
Also, I noticed you have a closing header tag on line 22 without an opening header tag before it.
Grace Kelly
33,990 PointsThis answer is for your second preview of code, on your first preview i see you have the opening header and the body tags
Matthew Lehman
5,282 Pointsthank you Grace.
I changed it, and it worked.
So thank you so much.
Grace Kelly
33,990 Pointsno worries, glad i could help :D
Matthew Lehman
5,282 PointsMatthew Lehman
5,282 Points<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Matthew Lehman | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400,400italic,700,700italic,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>Matthew Lehman</h1> <h2>Designer</h2> </a> <nav> <ul> <li><a href="index.html">Portfolio</a></li> <li><a href="about.html" class="selected">About</a></li> <li><a href="contacts.html">Contacts</a></li> </ul> </nav> </header> <div id="wrapper"> <section> <img src="img/matthew.jpg" alt="Photograph of Matthew Lehman" class="profile-photo"> <h3>About</h3> <p>Hi, I'm Matthew Lehman. This is my personal portfolio where I share my work. When I'm not doing this in my free time, I work in the fitness industry. It's difficult to actually give myself a specific job title, since I do many different types of tasks at my job. </p> <p>If you'd like to follow me on Twitter, my user name is <a href="http://twitter.com/mattyind">@mattyind</a></p> </section> <footer> <a href="http://www.twitter.com/mattyind"><img src=img/twitter-wrap.png alt="Twitter Logo" class="social-icon"></a> <a href="http://www.facebook.com"><img src=img/facebook-wrap.png alt="Facebook Logo" class="social-icon"></a> <p>Ā© 2015 Matthew Lehman</p> </footer> </div> </body> </html>