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 Arjan Blok
Arjan Blok
Courses Plus Student 1,808 Points

Saving / preview in workspaces treehouses

When I'm changing in my html txt and save/preview it doesn't show the new changes, I read in the community about saving/preview and refresh, but then it show this?

In the toolbar it says 'Index of /' and on the refreshed webpage only shows my workspace directories? : 'index of/

  • foto's/
  • joy.jpg
  • my own first webpage (if I click this it does show the webpage however?)
  • style css

What am I doing wrong?

3 Answers

Sergey Podgornyy
Sergey Podgornyy
20,660 Points
Sergey Podgornyy
Sergey Podgornyy
20,660 Points

You need open html tag (and close at the end of document). You need close your head tag - tags inside head tag will not display on page. After that you need open body tag, where you place all tags, which will display on page.

<html>
<head>
<meta charset="utf-10">
<title>Arjan is een eindbaaaaasss</title>
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel="stylesheet" type="text/css">
<link href="style.css" rel="stylesheet">
</head>

<body>
<img src="Overhemd foto.jpg" alt="Arjan">
<h1>Arjan1</h1>
<h2>Eindbaas</h2>
<h3>Amsterdam e.o</h3>
<h4>What I do:</h4>
<p>Ik ben html, css en java scripting via @treehouse online aan het leren</p>
<h4>What I enjoy doing:</h4>  
<p> Ik vind dit geweldig om uit te vogelen</p>
<h5> Why am I doing this?</h5>
<p> Omdat het gaaf is te leren !</p>
</body>

</html>

More info

Main structure looks like:

<html>
<head>
   metadata about page
</head>
<body>
  content of a page
</body>
</html>

Also your default file should be named as index.html, index.html or index.php by default for automatically display

Arjan Blok
Arjan Blok
Courses Plus Student 1,808 Points

@sergey, thx for your answers. You helped me a lot! By them I learned my own (beginners-)mistakes: 1.- indeed I named the file 'my first webpage.html' now I renamed it to index.html again and it works. Question: how do you then identify the right files if you make more webpages? You cannot name them all 'index.html, can you?

2.-Furthermore in the directory structure I replaced my used picture in a seperate created directory 'photo's', then it didn't appear anymore. Now I placed it back to the main directory structure as seperate file and the meta- info in the html file in the heading can find it again and shows it (after saving and refreshing).

Sergey Podgornyy
Sergey Podgornyy
20,660 Points
Sergey Podgornyy
Sergey Podgornyy
20,660 Points

Webservers, such as Apache, indexing by default index.html, index.htm, index.php. That means, that when you type on browser, for example, https://www.facebook.com, webserver will search on folder index files and redirect you to https://www.facebook.com/index.php.

If an index.htm home page has not been created for a web site, many web servers will default to display a list of files located in the site's directory, if the security settings of the directory permit. This list will include hyperlinks to the files, allowing for simple file sharing without maintaining a separate index file.

The home page is used to facilitate navigation to other pages on the site, by providing links to important and recent articles and pages, and possibly a search box. You can name your files as you wish, but they will not be display in browser as home page, you need to provide links to them.

Sergey Podgornyy
Sergey Podgornyy
20,660 Points
Sergey Podgornyy
Sergey Podgornyy
20,660 Points

About your image: You need carefully name directories, avoid special characters in the name. More info you can find here - http://www.cyberciti.biz/faq/linuxunix-rules-for-naming-file-and-directory-names/

Also, if you move you image to another folder, you should change path to this image, like 

<img src="photos/image.png" alt="My image">
Sergey Podgornyy
Sergey Podgornyy
20,660 Points
Sergey Podgornyy
Sergey Podgornyy
20,660 Points

Did you create index.html file? If yes, can you provide the code of it?

Arjan Blok
PLUS
Arjan Blok
Courses Plus Student 1,808 Points
Arjan Blok
Arjan Blok
Courses Plus Student 1,808 Points

Hello Sergey, thnx for your quick response. I thought I created a ( my first, very simple..) html file? Being:

<!-- Ik wil gewoon alles uitproberen, dus ook deze notes --> <!DOCTYPE html> <html lang="NL"> <head> <meta charset="utf-10"> <title>Arjan is een eindbaaaaasss</title> <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel="stylesheet" type="text/css"> <link href="style.css" rel="stylesheet"> </head>
<body> <img src="Overhemd foto.jpg" alt="Arjan">

<h1>Arjan1</h1>

<h2>Eindbaas</h2>

<h3>Amsterdam e.o</h3>

  <h4>What I do:</h4>
     <p>Ik ben html, css en java scripting via @treehouse online aan het leren</p>

<h4>What I enjoy doing:</h4>  
  <p> Ik vind dit geweldig om uit te vogelen</p>
<h5> Why am I doing this?</h5>
<p> Omdat het gaaf is te leren !</p>

</body> </html>

Arjan Blok
Arjan Blok
Courses Plus Student 1,808 Points

followed by </body> </html>