Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    May 2010
    Posts
    79
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Subfolders in a web-design project

    Hi everyone,
    I've been coding for about eight months now in HTML, XHTML, etc, but the projects have always been small snippets which means that I've been able to keep everything in one folder with no subfolders. Now that I'm starting my first project...I find that I can't use subfolders.

    The correct use of a subfolder would be like this:

    Code:
    <img src="/subfolder/image.jpg" />
    Am I missing something or is this not the right way to do this...assuming that the subfolder is in the same folder as the HTML file. When I do this the image doesn't show up but if I put it in the main folder and adjust the code accordingly it shows up fine.

    Thanks,
    aa

  • #2
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    <img src="/subfolder/image.jpg" />

    I think the leading slash is not necessary.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #3
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,880
    Thanks
    6
    Thanked 1,035 Times in 1,008 Posts
    Look into relative and absolute paths. If you’re developing locally (i. e. without server) then you should use relative paths.

    Absolute path with specific domain:
    Code:
    <img src="http://example.com/subfolder/image.jpg" />
    Domain independent absolute path (will look for the file from the root directory – in your case this looks for a subfolder in the top directory of the hard disk):
    Code:
    <img src="/subfolder/image.jpg" />
    Relative paths, relative to current HTML document:

    Looks for the file in a folder on the same level as the document:
    Code:
    <img src="subfolder/image.jpg" />
    Looks for the file in a folder one level above the current document:
    Code:
    <img src="../subfolder/image.jpg" />
    In CSS and HTML files you write the paths relative to the current file. In external JavaScript files you would write the paths relative to the document where the script is executed (i. e. relative to the file where the path is used).

  • #4
    New Coder
    Join Date
    May 2010
    Posts
    79
    Thanks
    8
    Thanked 0 Times in 0 Posts
    It worked after removing the leading slash. I'm not planning on putting this page on the web, but for the purposes of learning, let's assume that I were going to. Would I have to redo all of these paths as absolute url's, or the fact that they would be hosted in the same folder as index.html makes it all right as it is?

    Thanks a lot,
    aa

  • #5
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,880
    Thanks
    6
    Thanked 1,035 Times in 1,008 Posts
    Yeah, if the structure (i. e. the relation of the files to one another) stays the same then you don’t need to change anything.

  • #6
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,864
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Would I have to redo all of these paths as absolute url's, or the fact that they would be hosted in the same folder as index.html makes it all right as it is?
    You may practice the things by installing a local server in your machine like xampp or wamp and you could use the absolute paths after setting up a virtual server there. ( Personally, I prefer absolute paths as it's very easy when dealing with complex directory structures or when making friendly urls)
    Last edited by abduraooft; 06-11-2010 at 11:11 AM.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •