What other things can HTML links be set to?

Question

In the context of this exercise, what other things can HTML links be set to?

Answer

Links in HTML can be set to several different things.

As covered in the exercise, links are mainly used to connect a webpage with other webpages. This can be done by setting the link to go to the URL of a specified site, like

<a href="www.codecademy.com">Codecademy</a>

Links can also be set to link to documents and files, such as text, audio, video and image files. For example,

<a href="www.example.com/image.svg">Image</a>

HTML links can also be set to a specific part of the same webpage, such as a section header. This can be done using the id attribute of an element, and using that id value preceded by a # as the value of the href attribute. For example, in the following code, clicking the “Main” text would make the browser jump to the section with the corresponding id value of "main".

<a href="#main">Main</a>

<div id="main">
</div>
9 Likes

In the second HTML link where it gives you an example of what it would look like, why does the example:

Image
^
Shouldn’t “Image” have its own tag ? Wouldn’t it potentially mess up the formatting on the website since it does not have it’s own tag designator ? At least according to the text in the exercise, it makes it seem like that would be the case.

4 Likes

Hello,

“Image” has its own tag indeed.

  1. You can add images by using the img element, and point to a specific image’s location using the src attribute. That location can be (a) an URL (online) or (b) a file on your computer (then instead of the URL, we will need to specify the path of the file).

(a) <img src="https://content.codecademy.com/programs/code-foundations-path/web-dev-survey/pets.jpg" alt="a cat playing with a dog">

(b) <img src="images/mypets.jpg" alt="a cat playing with a dog">

(There are other (optional) attributes available for the img tag (such as width , length … but the alt attribute is necessary because if the user cannot see the image, they can at least see the text stored in the alt attribute.)

  1. You can turn your image (img element) into a link (clickable element) by wrapping or nesting it within a a element:
    <a href="www.codecademy.com"><img src="images/mypets.jpg" alt="a cat playing with a dog"></a>

  2. You can turn any part of your text into a link. In the example, they turned the word “Image” into a link (not the img element). It could have also been:
    <a href="www.example.com/image.svg">Click here to see my image</a>

I hope this helps. (I’m also a beginner :slightly_smiling_face: )

34 Likes

Thank you! Well explained

1 Like

I will put this in my tool box and use it, that’s expanding my horizon.
thank you.

1 Like

I love how thorough and indepth these highlighted FAQs are. I’ve always just skimmed through the HTML portion thinking it’s quite trivial. But that last bit, about how we can use href with a pound sign(#) to jump from section to section is a great to know tidbit.

Thank you!

3 Likes

@jephos249 Thanks for explaining briefly and precisely!!

Thank you for the clear explanation with examples.

I just started my career path for Front-End Develper at age 50.

This forum will continue to guide me to become a well rounded developer.

Once again, Thank you all for your support!!!

6 Likes

Keep it up man, love to see that people still enthusistic to learn something new.

2 Likes

What you say is really inspiring. I’m 32 and i’m starting to learn the career path for being a Full Stack Developer, and some of my doubts were about my age and also my language as i’m not a natively english speaker.

1 Like

Thank you, you have explain it in simple way and understandable, this is helpful information for beginners.

1 Like

I’m getting a rather late start myself. I completely empathize! Glad I’m not alone :smiley:

Congratulations!!..

Obrigado pela explicação bem objetiva.

hey folks, thanks to be feeding the forum with so many good information. Im 39 years old, brazilian (not a english native speaker) but I hope with your help by here I can finally have a new profession and help my family for a better life.

1 Like