9 Replies - 724 Views - Last Post: 19 June 2010 - 03:25 PM

#1 CasGrimes  Icon User is offline

  • D.I.C Head

Reputation: 10
  • View blog
  • Posts: 97
  • Joined: 09-March 10

first website issues

Posted 19 June 2010 - 12:04 PM

i have been coding my website in html using visual web developer 2010 and bought a domain name (from domainmonster.com) and signed up to a web host (000webhost.com). And I've got my site online but it shows an index of my files and pages instead of my website.

the website problem pic is showing how i'm uploading my files using filezilla, is there something i need to upload with it or do i need to make my site an exe or something?
i've made a new directory and uploaded my images into that but that doesn't work and also clicking on any of my links to aother part of my site takes me to google instead :@

any suggestions?

Attached image(s)

  • Attached Image
  • Attached Image

This post has been edited by CasGrimes: 19 June 2010 - 12:08 PM


Is This A Good Question/Topic? 0
  • +

Replies To: first website issues

#2 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3730
  • View blog
  • Posts: 6,017
  • Joined: 08-June 10

Re: first website issues

Posted 19 June 2010 - 12:21 PM

Hey.

You need to define a index file of your own, or the web server will just list the files in the directory. You simply create a file called index.html (or .htm, or .php) and put whatever you want shown on the index in there.

This post has been edited by Atli: 19 June 2010 - 12:24 PM

Was This Post Helpful? 1
  • +
  • -

#3 CasGrimes  Icon User is offline

  • D.I.C Head

Reputation: 10
  • View blog
  • Posts: 97
  • Joined: 09-March 10

Re: first website issues

Posted 19 June 2010 - 12:29 PM

View PostAtli, on 19 June 2010 - 11:21 AM, said:

Hey.

You need to define a index file of your own, or the web server will just list the files in the directory. You simply create a file called index.html (or .htm, or .php) and put whatever you want shown on the index in there.

that worked but the images and links don't work :(
any help?
thanks for getting one step closer :)
Was This Post Helpful? 0
  • +
  • -

#4 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3730
  • View blog
  • Posts: 6,017
  • Joined: 08-June 10

Re: first website issues

Posted 19 June 2010 - 12:36 PM

Could you show us an example of what happens?
What do your links and images look like (the HTML), and what does the URL of the page you are taken to upon clicking them look like?

Usually you are going to want to define links and images either relative to the current document <a href="folder/page.html"> or relative to the web root (an "absolute" link) <a href="/folder/page.html">.

A relative link will take you to a page relative to whichever page it appears on; e.g. the link I posted above in a page called example.com/myWeb/page.html will take you to example.com/myWeb/folder/page.html.

The absolute link, on the other hand, would take you to example.com/folder/page.html, no matter where in the hierarchy it is called.

This applies to all links, including images, style-sheets, files, etc...

This post has been edited by Atli: 19 June 2010 - 12:37 PM

Was This Post Helpful? 1
  • +
  • -

#5 CasGrimes  Icon User is offline

  • D.I.C Head

Reputation: 10
  • View blog
  • Posts: 97
  • Joined: 09-March 10

Re: first website issues

Posted 19 June 2010 - 12:41 PM

View PostAtli, on 19 June 2010 - 11:36 AM, said:

Could you show us an example of what happens?
What do your links and images look like (the HTML), and what does the URL of the page you are taken to upon clicking them look like?

Usually you are going to want to define links and images either relative to the current document <a href="folder/page.html"> or relative to the web root (an "absolute" link) <a href="/folder/page.html">.

A relative link will take you to a page relative to whichever page it appears on; e.g. the link I posted above in a page called example.com/myWeb/page.html will take you to example.com/myWeb/folder/page.html.

The absolute link, on the other hand, would take you to example.com/folder/page.html, no matter where in the hierarchy it is called.

This applies to all links, including images, style-sheets, files, etc...

Here's an example of a link on my home page (now renamed index page in which i changed all the href's so it goes to the relative part of my site).
<div id="RightColumn" class="SizeSide" style="position:relative; font-family: Arial, Helvetica, sans-serif; color: #FFFFFF;">
<a href="MyImages.htm">
<img src="../MyLinkImages/ImagesWebsiteLink.jpg" alt="Click here to see some of my work" style="margin-left: 65px; margin-top: 50px"/></a>


Thing is, when I 'view in browser' while I'm using visual web developer 2010, it works fine. But when I type my domain name it shows the index page without the pics and when I click where the links should be it takes me to google :S

This post has been edited by CasGrimes: 19 June 2010 - 12:42 PM

Was This Post Helpful? 0
  • +
  • -

#6 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3730
  • View blog
  • Posts: 6,017
  • Joined: 08-June 10

Re: first website issues

Posted 19 June 2010 - 12:45 PM

Ok, I see. If I'm reading the images of FileZilla you posted above correctly, you had the pages in a file called MyPages but moved them out of it when you uploaded them to the server?

If so, simply remove the ../ from the front of the links. Those characters tell the browser to look one directory up, but since you move the files, that is not needed anymore. A normal, relative link should work fine.

P.S.
Also, you seem to have a number prefixed to all your file names. Perhaps that is messing up the links as well?

This post has been edited by Atli: 19 June 2010 - 12:46 PM

Was This Post Helpful? 1
  • +
  • -

#7 CasGrimes  Icon User is offline

  • D.I.C Head

Reputation: 10
  • View blog
  • Posts: 97
  • Joined: 09-March 10

Re: first website issues

Posted 19 June 2010 - 01:13 PM

I managed to get the pics to show but the links still don't work, I've attached what I've done on filezilla now (I removed the ../ on the index references because I realise the index page must not be in a folder, is this the case with all pages?)

Here is how the links on my home page look like

 <a href="MyImages.htm">
<img src="../MyLinkImages/ImagesWebsiteLink.jpg" alt="Click here to see some of my work" style="margin-left: 65px; margin-top: 50px"/></a>
<a href="WrittenAssignments.htm">
<img src="../MyLinkImages/WrittenAssignmentsWebsiteLink.jpg" 
        alt="Check out some of my written assignments" 
        style="width: 282px; margin-left: 8px"/></a>
<a href="../MyWordDocuments/CV (games).htm">
        <img src="../MyLinkImages/CvWebsiteLink.jpg" alt="My cv" 
        style="width: 103px; margin-left: 100px;"/></a>
        <a href="Programs.htm"><img src="../MyLinkImages/ProgramsWebsiteLink.jpg" 
        alt="Check out some of the programs I've coded" style="margin-left: 56px"/></a>
<a href="Contacts.htm"><img src="../MyLinkImages/ContactsWebsiteLink.jpg" 
        alt="Click to see how you can contact me" style="margin-left: 68px"/></a> 

Attached image(s)

  • Attached Image

Was This Post Helpful? 0
  • +
  • -

#8 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3730
  • View blog
  • Posts: 6,017
  • Joined: 08-June 10

Re: first website issues

Posted 19 June 2010 - 01:58 PM

Each folder can have an index page. They are the Index for that folder, in an old-fashion, essay kind of way. The concept was that each directory on a website would have a single file that listed it's contents. Web server like Apache now do this automatically, but we are still allowed to create custom HTML documents to act as the Index for the directory, which we of course "abuse" into displaying the contents of our websites instead. (Keep in mind that these concepts were created well before the web evolved beyond simple text files.)

So yes, you can put your index file into another directory, but it simply becomes the index file for that directory instead. You still need an index file for you top-level directory as well.

As to your links. You realize that when a page at the web root (e.g. /index.html ) links to a page in another directory, the "working directory" (meaning; the directory you are currently in) changes. All relative links are then relative to that directory rather than the web root.

For example, if you have a link like so: <a href="folder/index.html">Link</a>.
If you put this link into a file, it will ask for the directory called "folder" inside the directory you are currently in. So if you start at the web root, in the index file there (e.g. /index.html), and press the link, you are transferred to /folder/index.html. If that page also has the exact same link, you would be transferred to /folder/folder/index.html. And so fort.

So, in your case, if you have all your images in a folder called /MyImages/, if you want them displayed in both the /index.html file and the pages at /MyPages/, you need to use different paths. The /index.html file would call /MyImages/image.jpeg, whereas the others would call ../MyImages/image.jpeg. (The ../ chars tell it to go one folder up, like it does in the Unix and Windows terminals).

This is also the case for the HTML files themselves. If the file you are trying to link to is in the folder above the one you are in, you need to use the ../ chars. If it is in a folder that belongs to the current folder, you only need to use the path relative to your current position.

I hope I'm making sense of this :)
Was This Post Helpful? 1
  • +
  • -

#9 CasGrimes  Icon User is offline

  • D.I.C Head

Reputation: 10
  • View blog
  • Posts: 97
  • Joined: 09-March 10

Re: first website issues

Posted 19 June 2010 - 02:29 PM

View PostAtli, on 19 June 2010 - 12:58 PM, said:

Each folder can have an index page. They are the Index for that folder, in an old-fashion, essay kind of way. The concept was that each directory on a website would have a single file that listed it's contents. Web server like Apache now do this automatically, but we are still allowed to create custom HTML documents to act as the Index for the directory, which we of course "abuse" into displaying the contents of our websites instead. (Keep in mind that these concepts were created well before the web evolved beyond simple text files.)

So yes, you can put your index file into another directory, but it simply becomes the index file for that directory instead. You still need an index file for you top-level directory as well.

As to your links. You realize that when a page at the web root (e.g. /index.html ) links to a page in another directory, the "working directory" (meaning; the directory you are currently in) changes. All relative links are then relative to that directory rather than the web root.

For example, if you have a link like so: <a href="folder/index.html">Link</a>.
If you put this link into a file, it will ask for the directory called "folder" inside the directory you are currently in. So if you start at the web root, in the index file there (e.g. /index.html), and press the link, you are transferred to /folder/index.html. If that page also has the exact same link, you would be transferred to /folder/folder/index.html. And so fort.

So, in your case, if you have all your images in a folder called /MyImages/, if you want them displayed in both the /index.html file and the pages at /MyPages/, you need to use different paths. The /index.html file would call /MyImages/image.jpeg, whereas the others would call ../MyImages/image.jpeg. (The ../ chars tell it to go one folder up, like it does in the Unix and Windows terminals).

This is also the case for the HTML files themselves. If the file you are trying to link to is in the folder above the one you are in, you need to use the ../ chars. If it is in a folder that belongs to the current folder, you only need to use the path relative to your current position.

I hope I'm making sense of this :)

i removed ALL of the ../ for all links and it fixed the images but it still sends you to google when you click a link on my site.
Referinng to my code I posted and the pic of how I'm uploading, is there anything you would do?

This post has been edited by CasGrimes: 19 June 2010 - 02:33 PM

Was This Post Helpful? 0
  • +
  • -

#10 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3730
  • View blog
  • Posts: 6,017
  • Joined: 08-June 10

Re: first website issues

Posted 19 June 2010 - 03:25 PM

Yea, I would recommend avoiding relative links altogether, in a static project like that. (Even in a dynamic project, absolute links are easier to manage, really.)

Prefix every link, image location, and every other "link" to anything with a single /, followed by the full path to the resource you want, as you would see it in your browser's URL bar. Like, if you want to display an image at example.com/MyImages/image.jpeg you do <img src="/MyImages/image.jpeg" />. If you want to link to a HTML page at example.com/MyPages/Something.html you do <a href="/MyPages/Something.html">Something</a>.

That's by far the easiest way to get around whatever problems you may be having with relative links.
Was This Post Helpful? 1
  • +
  • -

Page 1 of 1