Is it necessary to use `./` to link local files?

On your local machine it is probably not a good idea to use the root of your C: drive as your site root. You have a User folder, so keep your files in that folder. Your User can be logged in with a limited use account and still have full read/write access to that folder. This is the recommended configuration.

Now given that, it makes sense to isolate your code projects from the other content of your User folder. Give it a parent folder, and then give each project, or site its own folder. Inside that have the index.html page which will be the home page of that site.

Files in that folder are relative to the home page. ./ says, ā€œsame folderā€. Thatā€™s Linux, not Windows, but is should still work in Windows. If about.html is in the same folder, then <a href="about.html">About</a> will work as expected if that link is in the index page. It is relative to the requesting page.

/ says, Volume Root on your local machine. It is off the table. Never use that at the start of a URL within your site navigation, that is until it is mounted on a web server. Then it will be your Site Root.

5 Likes

so when do I use ./ or / with my webpage? Can I put different web pages in different folder or it has to be in the same folder for that specific website?

I used the format on Linux <a href="./index.html">webpage</a> and it worked! But when I tried <a href="./index.html">webpage</a> it did not work for some reason.

1 Like

On your local machine, the latter, never. The former is okay, but it can also be ignored. Itā€™s a Linux thing. For now, it is okay to ignore it. Stick to relative paths.

1 Like

(When I posted this, the pathways all had three ellipses (ā€¦) before the slashes instead of the two that I wrote. I donā€™t know why the website is changing it, but they are all only supposed to have two dots and a slash. :frowning:

Iā€™m 76 years old and just getting into coding after varied careers in Electronic Engineering, Quality Assurance, Law Enforcement and University Financial Aid, among others. Iā€™m really enjoying the course, but had a bit of trouble wrapping my head around the hierarchy of file storage and retrieval. Finally saw your response here and it made sense. I had my program file in the Desktop/Coding Projects/Test Project folder and my original image (photograph) file in my C:\Users\timot\OneDrive\Desktop\PHOTOS folder and LISTED THAT as the original path, which worked. Then I saw your file accessibility explanation, so I moved the photo into the same folder as my project file and used <img=ā€œphoto name.jpgā€/> and it worked. Then I moved the photo up one folder and tried <img="ā€¦/photo name.jpg"/> and it still worked. Moved the photo onto the desktop and tried <img="ā€¦/ā€¦/photo name.jpg"/> and . . . still working. Finally moved the photo back into my PHOTOS folder on the desktop and routed it <img="ā€¦/ā€¦/PHOTOS/photo name.jpg"/> and, of course, it still works great. Trying out all these variations helped me understand how the file system works and how to refer to the different possible pathways. Thanks so much for your time and effort and your brilliant explanations!

3 Likes

The forum software interprets two dots as an ellipsis. To get around that, be sure to wrap code fragments in single back ticks for inline, and triple back ticks for sample code blocks.

We can also indent by four spaces to render a line of code.

 <img src="../images/photo.jpg" alt="">

Search for ā€˜how to format code in postsā€™ and experiment with the various techniques given in that article. It is a way to preserve our original code layout and make it readable as code (or markup).

Thank you. Iā€™ll look into your suggestion.

1 Like

So now my question is this.

Relative paths

  • Index.html
  • /graphics/img.png
  • /help/articles/how-do-i-set-up-a-webpage.html

Absolute paths
http:///www.mysite.com
http://www.mysite.com/graphics/image.png
http://www.mysite.com/help/articles/howdoisetup.html

Now my questions is when writing out absolute paths. Do I need to create a folder for them? If so, how would I know how to write out the folder / file name?

Links to resources on mysite.com do not (and should not) use absolute paths, but relative, for the most part, or absolute minus the domain.

<img src="/graphics/image.png">

<a href="/help/articles/howdoisetup.html">How Do I Set Up a Webpage?</a>

Note that the leading forward slash is the site root, as in,

<a href="/">Home</a>

will take us to the index.html page on the site root.

Only links from other domains need to use your web URL.

1 Like

Sir
I tried that in windows explorer and find out it didnā€™t work, but backslash did. So I think you meant:
\ => C:
Thank you

mtf
you are a wonderful moderator. 70s 80s dos 2.0, unix, dbase, they all had there slashes in different directions, foreword for this, back slash for that. Ego kept everyone from agreeing on a simple thing like which way to go forward or backward for root directory. 1 dot 2 dot and away we go. Thank you for your clear answers.

1 Like

Reading this ( not even having to do it ) also gave me simpler insight as to how multiple dots can be use to find a certain file located further away so TYVM ofc ill find out later what the reasons would be to place a file so far away or the benefits to creating a ā€¦ path, probably something beneficial to multi links or folders. My mind wonders now for example to one link opening two new and different webpages :stuck_out_tongue: And like others mention its rlly helpfull to read trough the questions section and learn some details it saves alot of time on experimenting myself too seeing as im on a reasonable fast time scedual. Excuse me to those that prefer to see perfect english spelling.

Being said it was not a must to use ā€œ./ā€ , then what is the reason for it to use ./index.html instead of just index.html?

Currently its working by typing the name of html file directly without ./

Also, keep in mind the starting point of our file paths. It really helps to understand this tiny detail. If we have two HTML files in one directory, paths for both of them would start from where they exist in the directory. Kind of like the maze game or a treasure map :smiling_face:

I donā€™t know every tech aspect but Iā€™ve seen that we can use the necessary root without ā€œ./ā€ You need to write just the name of your HTML document. For example, (I wrote it without angle brackets on both sides to may to see it so just add them if you need it ^_^)
a href=ā€œThe_1st_Codecadamy_website_from_the_course.htmlā€ target=ā€œ_blankā€>My first website on Codecadamy</a
Iā€™ve put it on https://validator.w3.org and it hasnā€™t found any mistakes.