Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

HTML

Jade Clarke
Jade Clarke
349 Points

Bad value sitemap/Class exercise.pdf for attribute href on element a: Illegal character in path segment: not a URL code

I USED W3C VALIDATOR AND IT FOUND 8 ERRORS AND 1 WARNING

 Line 22, Column 28: Element a not allowed as child of element ul in this context. (Suppressing further errors from this subtree.)
                <a href="#">Exercises</a>
Contexts in which element a may be used:
Where phrasing content is expected.
Content model for element ul:
Zero or more li and script-supporting elements.
Error Line 34, Column 57: Bad value sitemap/Class exercise.pdf for attribute href on element a: Illegal character in path segment: not a URL code point.
                    <a href="sitemap/Class exercise.pdf">Sitemap</a>
Syntax of URL:
Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.
Error Line 39, Column 28: Element a not allowed as child of element ul in this context. (Suppressing further errors from this subtree.)
                <a href="#">Experiments</a>
Contexts in which element a may be used:
Where phrasing content is expected.
Content model for element ul:
Zero or more li and script-supporting elements.
Error Line 53, Column 32: Element a not allowed as child of element ul in this context. (Suppressing further errors from this subtree.)
                    <a href="#">Exercises</a>
Contexts in which element a may be used:
Where phrasing content is expected.
Content model for element ul:
Zero or more li and script-supporting elements.
Error Line 56, Column 31: Bad value p1b /index.html for attribute href on element a: Illegal character in path segment: not a URL code point.
                    <a href="p1b /index.html">Project 1B</a>
Syntax of URL:
Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.
Error Line 62, Column 55: Bad value p1c/process/p1c process.pdf for attribute href on element a: Illegal character in path segment: not a URL code point.
                    <a href="p1c/process/p1c process.pdf">Project 1C pw</a>
Syntax of URL:
Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.
Error Line 65, Column 55: Bad value p1d/process/p1d process.pdf for attribute href on element a: Illegal character in path segment: not a URL code point.
                    <a href="p1d/process/p1d process.pdf">Project 1D pw</a>
Syntax of URL:
Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.
Error Line 68, Column 52: Bad value p1d/project1d pw3.pdf for attribute href on element a: Illegal character in path segment: not a URL code point.
                    <a href="p1d/project1d pw3.pdf">Project 1D pw2</a>
Syntax of URL:
Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.

8 Answers

rydavim
rydavim
18,780 Points

You have spaces in your urls, have you tried the escape sequence given in the validator?

Characters should be represented in NFC and spaces should be escaped as %20.

<a href="p1b%20/index.html">Project 1B</a>

Your other error is referring to your anchor elements being children of your unordered list. These must be nested inside list items.

Element a not allowed as child of element ul in this context.

<li>
  <a href="#">Exercises</a>
</li>

For more specific advice, you'll need to post your html.

EDIT - If you haven't created a webpage before, I would start with the How to Make a Website course.

Jade Clarke
Jade Clarke
349 Points

I'm a student still learning and getting used to the coding. Could you possibly break that explanation down for me please. What do you mean by,

"You have spaces in your urls, have you tried the escape sequence given in the validator?

Characters should be represented in NFC and spaces should be escaped as %20."

and how can I post my html?

rydavim
rydavim
18,780 Points

In the href attribute of your a anchor tags, your website address (url) has a space character. You may not have spaces in urls, so you must replace all spaces with %20.

Jade Clarke
Jade Clarke
349 Points

I'm also having another problem. When I try to upload a specific pdf to my sftp server, it loads, and when it reaches the very end of the bar it says

"failed to upload"

and it cannot be open by pressing the link. I tried to save it again and replace the old file but that did nothing.

rydavim
rydavim
18,780 Points

Unfortunately, this is probably something you'll need to talk to your host about. You could try posting this problem here, but I can't promise someone will have the same provider you're using, so it may be difficult to troubleshoot your issue.

Jade Clarke
Jade Clarke
349 Points

THIS IS MY CURRENT HTML. I MADE SOME CHANGES. I REMOVED THE UL AND LI TAGS AND USED DIVS INSTEAD. STILL HAVING PROBLEMS. HOWEVER I FIND IT MORE DIFFICULT TO CHANGE THE LAYOUT IN CSS. I'M THINKING I SHOULD CONTINUE WITH THE OLD HTML I HAD WHICH I WILL POST IN THE NEXT COMMENT.

<!doctype html> <html>

<head> <meta charset="UTF-8"> <title>Insert Title Here</title> <link rel="stylesheet" href="css/styles.css"> <link href='http://fonts.googleapis.com/css?family=Quicksand:300,400,700' rel='stylesheet' type='text/css'> </head>

<body>

<div class="wrapper">
<div class="container">
    <div class="h1">Jade Clarke</div>
    <div class="h4">My work</div>
        <div class="nav">

        <div class="box1"><a href="ex/ex1/index.html">Exercise A</a></div>

        <div class="box2"><a href="ex/ex2/index.html">Exercise B</a></div>

        <div class="box3"><a href="ex/ex3/ex3.pdf">Exercise C</a></div>

        <div class="box4"><a href="sitemap/Class exercise.pdf">Sitemap</a></div>




        <div class="box5"><a href="portfolio/badminton.html">Create a webpage</a></div>

        <div class="box6"><a href="portfolio/website.html">Website</a></div>

        <div class="box7"><a href="portfolio/rolloverpractice.html">Rollover</a></div>




        <div class="box8"><a href="p1b /index.html">Project 1B</a></div>

        <div class="box9"><a href="p1c/index.html">Project 1C</a></div>

        <div class="box10"><a href="p1c/process/p1c process.pdf">Project 1C pw</a></div>

        <div class="box11"><a href="p1d/process/p1d process.pdf">Project 1D pw</a></div>

        <div class="box12"><a href="p1d/project1d pw3.pdf">Project 1D pw2</a></div>

        <div class="box13"><a href="p1d/index.html">Project 1D</a></div>

        <div class="box14"><a href="p2a/badminton.pdf">Project 2A</a></div>



    <footer>
        Footer: YSDN1006
    </footer>
</div>
</div>
</div>

</body> </html>


Validation Output: 5 Errors

Error Line 25, Column 67: Bad value sitemap/Class exercise.pdf for attribute href on element a: Illegal character in path segment: not a URL code point. … <div class="box4"><a href="sitemap/Class exercise.pdf">Sitemap</a></div> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20. Error Line 39, Column 56: Bad value p1b /index.html for attribute href on element a: Illegal character in path segment: not a URL code point. <div class="box8"><a href="p1b /index.html">Project 1B</a></div> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20. Error Line 43, Column 69: Bad value p1c/process/p1c process.pdf for attribute href on element a: Illegal character in path segment: not a URL code point. …div class="box10"><a href="p1c/process/p1c process.pdf">Project 1C pw</a></div> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20. Error Line 45, Column 69: Bad value p1d/process/p1d process.pdf for attribute href on element a: Illegal character in path segment: not a URL code point. …div class="box11"><a href="p1d/process/p1d process.pdf">Project 1D pw</a></div> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20. Error Line 47, Column 63: Bad value p1d/project1d pw3.pdf for attribute href on element a: Illegal character in path segment: not a URL code point. … <div class="box12"><a href="p1d/project1d pw3.pdf">Project 1D pw2</a></div> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.

rydavim
rydavim
18,780 Points

You absolutely want to be using an unordered list (ul) and list items (li) here. Stick with the idea of your code posted below.

Jade Clarke
Jade Clarke
349 Points

<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>Insert Title Here</title> <link rel="stylesheet" href="styles.css"> <link href='http://fonts.googleapis.com/css?family=Quicksand:300,400,700' rel='stylesheet' type='text/css'>

</head> <body> <div class="wrapper"> <div class="container"> <header>Jade Clarke</header> <section> <article> <h4>My work</h4> </article> </section> <nav> <ul>

            <a href="#">Exercises</a>

                <li>
                <a href="ex/ex1/index.html">Exercise A</a>
                </li>
                <li>
                <a href="ex/ex2/index.html">Exercise B</a>
                </li>
                <li>
                <a href="ex/ex3/ex3.pdf">Exercise C</a>
                </li>
                <li>
                <a href="sitemap/Class exercise.pdf">Sitemap</a>
                </li>



            <a href="#">Experiments</a>



                        <li>
                        <a href="portfolio/badminton.html">Create a webpage</a>
                        </li>
                        <li>
                        <a href="portfolio/website.html">Website</a>
                        </li>
                        <li>
                        <a href="portfolio/rolloverpractice.html">Rollover</a>
                        </li>

                <a href="#">Projects</a>

                <li>
                <a href="p1b /index.html">Project 1B</a>
                </li>
                <li>
                <a href="p1c/index.html">Project 1C</a>
                </li>
                <li>
                <a href="p1c/process/p1c process.pdf">Project 1C pw</a>
                </li>
                <li>
                <a href="p1d/process/p1d process.pdf">Project 1D pw</a>
                </li>
                <li>
                <a href="p1d/project1d pw3.pdf">Project 1D pw2</a>
                </li>
                <li>
                <a href="p1d/index.html">Project 1D</a>
                </li>
                <li>
                <a href="p2a/badminton.pdf">Project 2A</a>
                </li>

        </ul>
    </nav>
    <footer>
        Footer: YSDN1006
    </footer>
</div>
</div>

</body> </html>

rydavim
rydavim
18,780 Points

Okay, the problem here is that you have anchor elements (a) that are not nested inside list items (li).

All elements in an unordered list must be inside list item tags.

<!-- This is the beginning of the unordered list. -->
<ul>
  <!-- You can't put a link here, outside of a list item! -->
  <a href="#">Index</a> <!-- Don't do this! -->

  <!-- Here is a list item. You may put links inside these. -->
  <li>
    <a href="#">Index</a>
  </li>
</ul>
Jade Clarke
Jade Clarke
349 Points

NOW 5 ERRORS AND 3 WARNINGS. NESTED THE a href WITHIN THE li TAGS

Validation Output: 5 Errors

Warning Line 15, Column 11: Section lacks heading. Consider using h2-h6 elements to add identifying headings to all sections. <section> ✉ Error Line 37, Column 57: Bad value sitemap/Class exercise.pdf for attribute href on element a: Illegal character in path segment: not a URL code point. <a href="sitemap/Class exercise.pdf">Sitemap</a> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20. Error Line 61, Column 31: Bad value p1b /index.html for attribute href on element a: Illegal character in path segment: not a URL code point. <a href="p1b /index.html">Project 1B</a> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20. Error Line 67, Column 55: Bad value p1c/process/p1c process.pdf for attribute href on element a: Illegal character in path segment: not a URL code point. <a href="p1c/process/p1c process.pdf">Project 1C pw</a> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20. Error Line 70, Column 55: Bad value p1d/process/p1d process.pdf for attribute href on element a: Illegal character in path segment: not a URL code point. <a href="p1d/process/p1d process.pdf">Project 1D pw</a> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20. Error Line 73, Column 52: Bad value p1d/project1d pw3.pdf for attribute href on element a: Illegal character in path segment: not a URL code point. <a href="p1d/project1d pw3.pdf">Project 1D pw2</a> Syntax of URL: Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.

Jade Clarke
Jade Clarke
349 Points

I ALSO INCLUDED THE %20 IN THE SPACES AND IT WORKED LIKE A CHARM!! THANK YOU! THERE'S ONLY ONE MORE PROBLEM TO BE SOLVED.

Validation Output: 3 Warnings

Below is a list of the warning message(s) produced when checking your document. Warning Line 15, Column 11: Section lacks heading. Consider using h2-h6 elements to add identifying headings to all sections. <section>

rydavim
rydavim
18,780 Points

You are using section elements. These elements are intended to mark sections in a document such as chapters, headers, or footers. You probably don't want to be using them in this case, but when you do use them the validator is suggesting you add headers, like h1, to describe these sections.

At this point, I would just remove the section and article elements at the top and leave the header element (h4) on it's own.

    <section>  <!-- Remove these section and article tags. -->
        <article>
            <h4>My work</h4> 
        </article>
    </section>

You'll also probably need to put your main header in a header tag (h1) inside your header element.

<!-- This header is just like the footer, it's a block. You still need to put tags about what's inside. -->
<header>Jade Clarke</header>

<!-- Add a heading tag around this. -->
<header>
  <h1>Jade Clarke</h1>
</header>