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

Posted by Ashley Bennett
Ashley Bennett
2,307 Points

Images and Lists HTML Assignment

I am working on the images and lists section of the build a simple website project. I am having issues because the images are not showing in my web browser for some reason. I suspect that it is due to the location of the files on my hard drive, but I am not sure.

Here is my code. 

<!DOCTYPE HTML>
<HTML>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>Smells Like Bakin' Cupcake Company</title>
    </head>
    <body>
            <img src="img/logo.gif" alt="Smells Like Bakin'">
    </body>
</HTML>

I would appreciate it if anyone could let me know what I need to do in order for the images to display properly.

4 Answers

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Ashley Bennett -

When your images don't show up unless you put them in the same folder as your HTML, the reason this works is because your a working around an issue with your file paths. Now is as good time as any to learn how file paths work, as issues with file paths are one of the most common issues for those new to HTML.

Here's a quick primer on file paths that should get you going. If you still don't understand just let us know here in this thread.

Jack Carr
Jack Carr
7,329 Points
Jack Carr
Jack Carr
7,329 Points

The code you have shown is just a line of text. I guess you didnt paste all your code in.

You should create a new folder on your DESKTOP. In that folder you should place all of your images that you need to work with, you should also save all the webpages inside of it. When working with the simple website, you will probably only make a index.html and a styles.css text doucement. Non the less, save those all into the folder on your desktop. Keep things easy and organized.

Armando Amador
Armando Amador
6,813 Points
Armando Amador
Armando Amador
6,813 Points

Hey Ashley,

Just to add to what Jack wrote, make sure your image folder is named exactly the same in your code. For example in this assignment the instructor's images folder is img.

Code example <img src="img/logo.gif" alt="Smells Like Bakin">

Other instructors will use images instead of img. Make sure to always point to whatever you named your images folder.

Ashley Bennett
Ashley Bennett
2,307 Points
Ashley Bennett
Ashley Bennett
2,307 Points

Thanks everyone! It worked when I moved everything into the same folder as you recommended.