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 How to Make a Website Responsive Web Design and Testing Website Testing

Shazad Kazi
Shazad Kazi
10,758 Points
Posted by Shazad Kazi
Shazad Kazi
10,758 Points

w3 check html error

I have followed along with the sessions and my website seems to be working fine.

I just keep getting one error. Not sure why?

http://validator.w3.org/check

My code is

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Shazad Kazi | 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>Shazad Kazi</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>&copy; 2015 Shazad Kazi.</p>
      </footer>
    </div>
  </body>
</html>

This is the response, I get from w3

Line 7, Column 138: 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'>

Could someone please explain to me what I am doing wrong.

2 Answers

Rich Bagley
Rich Bagley
25,869 Points

Hi,

Try changing:

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

to:

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

Note the | has been replaced with %7C. This is due to the charset requiring the pipe to be encoded.

Hope that helps :)

-Rich

Adam Creasey
Adam Creasey
5,756 Points

I was having the same problem as Shazad, I followed your instruction and my code passed the test. Thanks Rich

Alisa Trunczik
Alisa Trunczik
3,659 Points
Alisa Trunczik
Alisa Trunczik
3,659 Points

Had the same problem, thank you, this helped!

Rich Bagley
Rich Bagley
25,869 Points

No problem Adam Creasey / Alisa Trunczik :)

-Rich

Wilfredo Miranda
Wilfredo Miranda
2,222 Points
Wilfredo Miranda
Wilfredo Miranda
2,222 Points

Hey Rich Bagley do we need to do this for all the (|) in that specific code ? or is it only at a certain point.

Rich Bagley
Rich Bagley
25,869 Points

Hi Wilfredo,

Yes you'll need to do that for all pipes (|).

Hope that helps :)

-Rich

Wilfredo Miranda
Wilfredo Miranda
2,222 Points
Wilfredo Miranda
Wilfredo Miranda
2,222 Points

Yes this did help out ! Thanks I really appreciate it (: