…when you own all the files…you can link to them directly Relative Links Means you specify where the link leads relative to where you currently are (what page?)
If pages are in the same directory (file folder) Link ON page1.html to page2.html my-site page1.html page2.html <a href=“page2.html”>Page 2</a>
If page is one folder deeper Link ON page1.html to page2.html my-site fold page1.html page2.html <a href=“fold/page2.html”>Page 2</a>
If page is two folders deeper Link ON page1.html to page2.html ..pattern continues if even deeper folders my-site fold page1.html inner page2.html <a href=“fold/inner/page2.html”>Page 2</a>
If page is outside current folder Link ON page1.html to page2.html my-site fold1 page1.html page2.html <a href=“../page2.html”>Page 2</a>
If page is in Different folder Link ON page1.html to page2.html my-site fold1 fold2 page1.html page2.html <a href=“../fold2/page2.html”>Page 2</a>
Note .. Means go back a directory If I need to exit out of two folders <a href=“../../page2.html my-site fold1 page2.html fold2 page1.html
Pattern holds To escape back out of folders Need a ../ for each folder you’re escaping
Terms to use when folders are relative to each other A is the parent directory B is the child directory A B
Naming Conventions All this can be confusing enough Name files appropriately: NO SPACES! – smoosh words or use hyphens Name folders (directories) after what they contain Name images based on what they show Name HTML files based on what they contain Main HTML file for a site is ALWAYS index.html