HTML Resources > 3. Hyperlinks
Login to LinkedIn Learning via NorthwesternOverview Resources
- LinkedIn Learning video: Exploring the anchor element (2:58)
- Absolute versus relative paths
1. Navigating Relative File Paths
Given the image below, the following relative paths are from the perspective of the index.html file.
../test.html # go up one directory and access the test.html file
../files/blah.html # go up one directory and then into the files directory, and access the blah.html file
../images/dogs/a1.png # go up one directory, then into the images directory, then into the dogs directory, and access the a1.png image
styles/my_style.css # go into the styles directory and access the my_style.css file
styles/dark/new.css # go into the styles directory, then into the dark directory, and access the new.css file
Download the sample files to experiment with relative file paths (and view the home/index.html).
2. Linking to pages within your own site
- LinkedIn Learning Video: Linking to pages within your own site (10:21)
3. Linking to external pages
Additional Resources
- LinkedIn Learning Video: Linking to external pages (4:18)
4. Linking to page regions
Additional Resources
- LinkedIn Learning Video: Linking to page regions (9:46)
5. Organizing links into a menu
The links in this example don’t link to anything (yet), but is meant to show that div and span tags can be useful for grouping links into conceptual widgets (like menus)