The last time I remember using HTML before Wednesday’s class was probably the last time I updated my MySpace page. So I decided to start on the Beginner tutorials, and that was definitely the right choice for me and my and my lackluster coding skills. (I definitely used to apply my CSS inline with my HTML, but in my defense I was 13 and didn’t even know what CSS was). The most interesting thing that I’ve learned so far about HTML is actually something that I’ve interacted with a lot, but have never previously understood: absolute and relative links.
Prior to starting at Carleton I worked in curriculum development, and after spending the better part of two years editing documents in InDesign, I’ve edited hundreds of absolute and relative links. I just didn’t know that’s what they were called or that they were meaningfully different. I probably should have gotten the hint from the fact that InDesign separates them into two different control panels and only allows one of the two kinds to be used for images, but I was too busy getting mad at the links for breaking to learn more about them.
That is until I read the HTML Dog beginner HTML tutorial on links and was introduced to concept of absolute and relative links. Absolute links point to specific websites, but relative links define the definition of the link in relation to the current page section. Absolute links look like <pre><img src=”https://url.com/imageyouwanttolinkto”></pre> and relative links look like <pre><img src=”pictures/imageyouwanttolinkto.jpg></pre>. While this distinction isn’t particularly complicated, it is important to pay attention to because certain aspects of a web page can only be structured with relative links.
Well, I guess I shouldn’t say “aspects” plural because I really only know of one: linking to another section on the same page. As the links tutorial explains, “you can add an id attribute to just about any tag, for example <pre><h2 id=”moss”>Moss</h2></pre>, and then link to it by using something like this:<pre><a href=”moss”>Go to moss</a></pre>. Selecting this link will scroll the page straight to the element with that ID.”
It is cool to see you mention the relative and absolute links! I got frustrated at links very frequently too. I hope that that by learning about how they actually work, people can avoid problems when using links…
Nice work, Michelle. Knowing the distinction between relative and absolute links can save a lot of headache when you start getting errors for page not found on your server if you forgot to add the http:// to the href attribute. Linking to a specific part of the current page is usually called an anchor, hence the name of the <a> tag