Relative Links
If our directory (folder) structure is similar to this:mysite/texas/harris/houston/index.htm
How do we create a relative link to
mysite/arkansas/pulaski/littlerock/capital.jpg?
A relative link MUST be to a file on the same DOMAIN or, if you're limited to a FOLDER in that domain, it has to be in your folder. If my website is on cnocandoire.com and the file I want to link to is on txrusk.com, I MUST use a full URL to get there.
Even though my Rusk County pages are actually located on my Cnoc an Doire webspace, I can't relatively leave cnocandoire.com and go to txrusk.com because I don't own the space ABOVE cnocandoire.com - the server.
I also manage txgenwebcounties.org/sherman/ and txgenwebcounties.org/oldham/. They're on the same DOMAIN but I DON'T HAVE ACCESS to the txgenwebcounties.org main folder so I cannot relatively leave sherman and go to oldham. Think of it as having a locked room between you and the place you want to go; you'll have to send a letter with the complete address.
Most folks are very visual with learning so I've used this to help explain relative links.
If I just moved to Main Street and I've been told that the grocery store is a couple of blocks down, also on Main Street, I know I can drive straight down the road to get there. I don't need an address but the name of the store is helpful.
The same is true with a relative link.
I know the file is in the same folder as the page I'm working on, so I don't need an address (URL), just the name of the file will do.
<a href="grocery.jpg"> - a very simple relative link.
However, if my new neighbor tells me that I'll have to turn right onto Johnson Street and watch for the hardware store. I've added a new piece of information to my directions. I still don't need an address, simple directions will work.
Now my file is in a different folder, so I need to tell the browser in which folder.
<a href="johnsonstreet/hardware.css">
But what if the nearest cell phone store is up the highway, a few miles out of town? (Main Street is actually a highway that leads to the next town.) Now I'll need to leave my new town and go up the road and look for the phone store. Still very simple directions.
So I tell the browser to LEAVE the folder it's viewing and THEN open the file. We leave the folder with ../.
<a href="../cellphone.htm">
Well, now I have new directions. The feed store is actually in Springfield, the next town town over.
So I tell the browser to leave the folder it's currently viewing, go INTO the new folder and THEN open the file.
<a href="../springfield/feed.php">
Christmas is just around the corner and I need to go gift shopping and the nearest shopping mall is on the highway but in the next county. I'll need to leave my town, leave my county and THEN look for the mall.
<a href="../../mall.txt">
Remember that when you leave one folder, you're already in the other one, so you don't need to name it.
I did most of my shopping at the mall and went back home but now I need a specialty store to get my mom's gift and it's back in the other county but on a different highway, locally called Gulf Street. I need to leave my town, leave my county and turn onto the other road to get there.
File translation says leave two folders, go into the new folder and open the file.
<a href="../../gulfstreet/specialty.asp">
So going back to the question at the top of the page, in order to link relatively, we need to leave the folder named houston, leave harris, leave texas, enter arkansas, enter pulaski, enter littlerock and open the file:
Back