How to add hyperlinks to your website or blog with HTML tags [Guide]

htmlHTML is what transformed the Internet into the Web. Whilst websites designers can set up websites with design software without inserting any code directly, they can still edit the HTML tags to make design modifications. HTML hyperlink tags are perhaps the most essential addition to any website or page. They are essential to the site’s overall navigation, and also link to external pages. These are a few of the HTML hyperlink tags that you can add to your website or blog.

To add a basic hyperlink to your website or blog, you insert <a href = “”>. For an external link you add the URL of the website between the inverted commas. An external link to the dotTech website would be: <a href = “http://dottech.org/”>. If the hyperlink links to pages within your website it should include a page file. As such, it might be something like: <a href = “index.htm”>.

After that you insert some anchor text to the hyperlink. That’s the hyperlink text included on the page. For example, a hyperlink that links back to a website home page could be something like: <a href = “http://dottech.org/”>home page</a>. If that were added to a dotTech’s article HTML, the hyperlink would take you back to the site’s home page.

Having inserted some anchor text in the hyperlink’s HTML tag, you can also format the text. That is done with the usual text formatting tags such as <i>, <b> and <font size = “”>. Add the formatting tags before the <a href>, and their closing tags are included after the </a>. As such, a formatted hyperlink’s HTML could be:

<i><b><font size = “14”><a href = “http://dottech.org/”><home page</a></i></b></font>

That tag will add italic, bold and size 14 font to the hyperlink’s anchor text. You could also add some of these formatting tags as well:

  • <strike></strike>
  • <font color=”#??????”></font>
  • <h?></h?>
  • <blockquote></blockquote>

However, hyperlinks do not have to include anchor text. They could instead be images which link to other websites or pages. The HTML tag for image hyperlinks is:

<a href=”http://dotech.org/”><img src = “” width = “200” height = “200”></a>

Of course, you would add an img file for img src. That would include the image file name and format such as jpg etc. You adjust the width and height values by inputting alternative numbers.

An anchor link is another type of hyperlink which does not open new pages or websites. Instead it links to another part of a page. For example, you could add an anchor link that returns to the top of the same page. For that you add #top to the HTML tag which would be: <a href= “#top”>Back to top</a>. That link jumps back to the top of the page.

Overall, there’s a variety of HTML tags for adding hyperlinks to pages. You can also add hyperlink buttons, navigation bars, rollovers etc to websites and pages. For more HTML tags check out this website.

Share this post

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

1 comment

  1. Al

    Hi MatthewA,

    Your interesting article on “How to add hyperlinks to your website…” ends with the words: ” For more HTML tags check out .”
    And no more…. did you forget to add your own hyperlink?

    Al