5

This has been bugging me for a long time so I need to ask the question.

What is the difference between / and ./, is it just down to server settings?

For example, if we were looking for an images folder in the root directory we would write:

<img src="/images">

However, another server will only accept it as follows:

<img src="./images">

It's not a biggie, but in an ideal world I'd like to think I could transfer my sites to another server relatively easily without having to update minor details like these.

Of course, I can declare it in PHP and set it once in a config file, but it really is bugging me. Why is there two methods for declaring the root?

user1100149
  • 266
  • 1
  • 4
  • 12

3 Answers3

13

To reference files relative to the current page, you can either write the path plainly without a prefix, or you can be explicit about it by prefixing with ./. To reach files with paths relative to the root of your site, you prefix the path with /.

Summary

/ absolute path (full path to resource from root directory)
./ relative path from current directory (equal to not specifying any folder prefix)
../ relative path from parent directory
../../ relative path from parent of parent

Examples

Current URL               Resource path          Resolves to

/pages/home.html          ./picture.jpg          /pages/picture.jpg
/pages/home.html          ../img/picture.jpg     /img/picture.jpg
/pages/about/home.html    /img/picture.jpg       /img/picture.jpg
/pages/about/home.html    img/picture.jpg        /pages/about/img/picture.jpg
/home.html                img/picture.jpg        /img/picture.jpg
sshow
  • 8,820
  • 4
  • 51
  • 82
  • That makes absolute sense now you've pointed it out. Even makes me feel a little stupid! Though I'm still puzzled why some environments I work in won't accept `/` as the root. – user1100149 Mar 12 '13 at 09:45
  • Looking at the table you've added, I think you've cracked it. One place it doesn't work is in localhost where I have a number of sites. i.e. `localhost/site1`, `localhost/site2`, etc. So if I declare the root, rather than the current folder, it would go back to the root of localhost? – user1100149 Mar 12 '13 at 09:58
  • Yeah. If you're at `localhost/site1/page.html` and request `/js/jquery.js`, you're requesting `localhost/js/jquery.js`. You can get around this by binding your different sites to different ports, instead of having them in different folders on `localhost:80`. – sshow Mar 12 '13 at 10:07
  • Thanks stigok. I was thinking along these lines before but never managed to put my finger on it, and if you put `/` and `./` into Google it's very difficult to find an answer! (I have tried a few times.) When I'm at work I actually have my dev environment set up in my hosts file so have individual URLs (and root directories) allocated to each site. At home I use localhost, hence the differences. Every day's a school day. – user1100149 Mar 12 '13 at 10:13
1

This is the same only if the source page (the one containing this HTML) is itself at the root of the domain.

In the general case, ./images is equivalent to images.

Denys Séguret
  • 372,613
  • 87
  • 782
  • 758
  • Thanks dystroy. Following from stigok's answer this makes good sense too. I guess I've never experienced issues with declaring it as the current folder (e.g. `./images`) because almost all of the sites I build are based around an index page in the root which will pull in any other pages and content. – user1100149 Mar 12 '13 at 09:47
  • Just a tip : Prefer relative url. When both `images` and `/images` are valid, use the first one, as it will still be valid if you move your site down in the hierarchy of the domain. – Denys Séguret Mar 12 '13 at 10:16
0

This has nothing to do with HTML, apart from the fact that URLs are used in HTML, too. This is defined in URL specifications. Briefly, ./ is relative to current base URL, and / is relative to the server root (technically, it refers to the server part of the base URL).

Jukka K. Korpela
  • 195,524
  • 37
  • 270
  • 390