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 Creating HTML Content Build the Footer

Posted by isabelbolger
isabelbolger
1,412 Points

Images appear as blue boxes with "?" marks in center when viewing webpage in Workspaces

Hi, when I view my website that I've created in workspaces, the images appear as blue boxes with "?" marks in the center of each box. I'm not sure why the images themselves aren't appearing. Is there something I can do to the settings of my web browser that will allow the images to display? I am using Safari on my mac with the latest version. Thanks!

5 Answers

Amandeep Dindral
Amandeep Dindral
8,915 Points

Your code seems to be good. Do you have the folder "img" uploaded onto workspaces? You can check on the left hand side. It will show you your file directory and the img folder should be visible there if it was uploaded. Also, what browser are you using to preview your work? Id recommend using Chrome.

isabelbolger
isabelbolger
1,412 Points

I am using safari. The name of my folder is Images, not img so that may be the problem Thanks!

isabelbolger
isabelbolger
1,412 Points

I am using safari. The name of my folder is Images, not img so that may be the problem Thanks!

Kevin Korte
Kevin Korte
28,149 Points
Kevin Korte
Kevin Korte
28,149 Points

Almost always, this means that your code is not referencing the correct location of the images. It's common that there might be a mistype of the file name, you're one folder directory in front of or behind of where the images actually are. So double check your image paths and spellings.

Amandeep Dindral
Amandeep Dindral
8,915 Points
Amandeep Dindral
Amandeep Dindral
8,915 Points

Something may be wrong in how you are typing out the file path to the image within your code. Can you post a picture of your code? Your image code should read something like this :

<img src="img/JavaScript.png" alt=""

in the "src=" the first word in the "/" should be the name of the folder you have the image in. So in my example the image is in the "img' folder and the second word in the "/" should be the name of your image. In this example the name of the image is JavaScript.png

Hope this helps !

isabelbolger
isabelbolger
1,412 Points

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Isabel Bolger | Designer</title> </head> <body> <header> <a href="index.html"> <h1>Isabel Bolger</h1> <h2>Designer</h2> </a> <nav> <ul> <li><a href="index.html">Portfolio</a></li> <li><a href="about.html">About</a></li> <li><a href= "contact.html">Contact</a></li> </ul> </nav> </header> <section> <ul> <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"><image src="img/twitter-wrap.png" alt="Twitter Logo"></a> <a href="http://facebook.com/nickpettit"><image src="img/facebook-wrap.png" alt="Facebook Logo"></a> <p>© 2015 Isabel Bolger.</p> </footer> </body> </html>

This is my code

Amandeep Dindral
Amandeep Dindral
8,915 Points
Amandeep Dindral
Amandeep Dindral
8,915 Points

Great! If my answer was helpful dont forget to up vote it!

Happy coding

isabelbolger
isabelbolger
1,412 Points

Also, I am using 10.10.5 for this mac and Xcode 7. I keep getting an error that says "Playground execution terminated because the process stopped unexpectedly." It displays every time it tries to run the code. I tried restarting the mac but that did not work. Do you know how to fix this?

Amandeep Dindral
Amandeep Dindral
8,915 Points
Amandeep Dindral
Amandeep Dindral
8,915 Points

http://stackoverflow.com/questions/25996714/playground-execution-terminated-because-the-playground-process-exited-unexpected

It seems to be a common issue for Xcode. For most people a restart does the trick but for many it doesnt.

Id generally stay away from text editors that are still in beta which xcode is. Beta means that the program is still in testing mode and has bugs (like the one you are experiencing). Id recommend Sublime Text. This is a popular text editor and also the one ive seen most commonly used in tech. You can download it for free at the link below.

http://www.sublimetext.com/

Hope this helps