How to Create a Link With Simple HTML Programming

Download ArticleDownload Article

Once you've created a couple web pages using HTML, you'll want to connect them into a larger site. Learn how to link from one page of your site to another, or to any other site on the internet. You can even send your visitors to a specific spot on the page to save them scrolling time.

Method 1
Method 1 of 2:

Linking to Another Web Page

Download Article
  1. How.com.vn English: Step 1 Open your HTML file.
    Open the HTML file for the page you would like to edit. (If you're starting from scratch and need some background info, create the document before reading this article.)
  2. How.com.vn English: Step 2 Place a link on your page.
    Add the following code to the body of your HTML document, where you would like the link to appear:
    • Create a href tag.
    • <a href="https://www.how.com.vn/todo/en/">Link text</a>
    • This displays like this: Link text.
    Advertisement
  3. How.com.vn English: Step 3 Write the link text to display.
    Anything in between the <a> and </a> tags will appear on your page as a link. You can alter this with other html tags just as you would any other text.
    • You can also turn an image into a link:
      <a href="https://www.how.com.vn/todo/en/"><img src="wikihow_logo.png"></a>.
      The user will see the image wikihow_logo.png, and can click the image to visit https://www.wikihow.com/.
  4. How.com.vn English: Step 4 Change the destination of the link.
    The <a></a> tag you just created is called an "anchor." The href attribute inside the anchor defines the destination of the link. Replace https://www.wikihow.com/ in the example above with the URI you would like to link to.
    • Always surround the URI with quotation marks.
    • URIs are case sensitive.[1] Copy-paste them or type them in exactly as they appear.
  5. How.com.vn English: Step 5 Link to a page in the same folder.
    You do not need to include a full URL if you are linking to a page on the same website (although it will work). It's easier to keep your website organized if you use relative links instead, without including the domain name. Here's a simple example linking from one page to another in the same folder:
    • Let's say you're editing the page http://example.edu/about/author.html.
    • To link to the page http://example.edu/about/family.html, just type the file name:
      <a href="family.html">Link text</a>
  6. How.com.vn English: Step 6 Link to other pages on your website.
    You can also use relative links to direct the link to any other page on the same site. There are only two things you need to know:[2]
    • To link to a page in a subfolder, include the new file path. For example, if you're on the page http://example.edu/about/author.html and want to link to http://example.edu/about/pets/dog.jpg, you can skip everything up to "about:"
      <a href="/pets/dog.jpg">Link text</a>
    • To link to a page in a different branch of the site, use "../" to move up to a higher folder. For example, to link from /about/author.html to http://example.edu/writing/books.html, type:
      <a href="../writing/books.html">Link text</a>
  7. Advertisement
Method 2
Method 2 of 2:

Linking Within a Page

Download Article
  1. How.com.vn English: Step 1 Create a destination anchor.
    If you're linking to a long web page, you might want to lead people to a specific point on the page instead of the top. To make this possible, open the HTML document for the destination page. Insert this anchor tag at the point you want to link to:
    • <a id="anchorname">Anchor text.</a>
      This will display as normal text, since it is the destination of a link and not a link itself. You can replace "anchorname" with any name, as long as you don't use the same name twice on one page.
  2. How.com.vn English: Step 2 Link to the destination anchor.
    To link to a specific point on the page, add the symbol # to the end of the URI, followed by the exact name you used for the id attribute. This is case sensitive.
    • For example, to link to the anchor <a id="pictures"></a> on the page http://example.edu/vacation.html, type:
      <a href="http://example.edu/vacation.html#pictures">Link text.</a>.
    • You can add this to absolute or relative links (see instructions in separate method).
  3. How.com.vn English: Step 3 Add an anchor to any HTML tag.
    You can also create an anchor by inserting id="anchorname" into any HTML tag.[3] Link to this in exactly the same way. Here are a couple examples:
    • <h1 id="topheader">Header Text</h1>
      Link to this by adding #topheader to the URL.
    • <p id="introparagraph">Paragraph text</p>
      Link to this by adding #introparagraph to the URL.
  4. Advertisement

Community Q&A

Search
Add New Question
  • Question
    What's better, a 32 bit or 64 bit laptop?
    How.com.vn English: Community Answer
    Community Answer
    While most programs will run fine on 32 bit PCs (or have an alternative 32 bit version of software), gamers go for 64 bit because it allows for more RAM. You need to ask yourself if you need it.
  • Question
    Is there a program to show hyperlink?
    How.com.vn English: Community Answer
    Community Answer
    You'll want to take a look at JavaScript and jQuery for animating and dynamically creating elements on the fly. These programming languages/libraries can let you adjust the content of the link whenever you want (on the viewer's screen).
  • Question
    How can I link one webpage to the other?
    How.com.vn English: Community Answer
    Community Answer
    First, you need to find the URL for the webpage you want to link to. In your HTML, you will use this line of code to link to the site. If you want, you could mess with the style and add text to the link.
See more answers
Ask a Question
200 characters left
Include your email address to get a message when this question is answered.
Submit
      Advertisement

      Tips

      • To make the linked page open in a new window, use the "target" attribute:<a href="https://www.how.com.vn/todo/en/ target="_blank">Go To How.com.vn</a>
      • You can use Cascading Style Sheets (CSS) to modify the appearance of a link in all four of its (4) states: Link, Visited, Hover, and Active.
      Submit a Tip
      All tip submissions are carefully reviewed before being published
      Thanks for submitting a tip for review!
      Advertisement

      Warnings

      • Be sure to remember to close the <a> tag with a corresponding </a>. If you forget to do this, most browsers will change the rest of the page text into a link!
      Advertisement

      Things You'll Need

      • A simple text editor such as Notepad (PC), TextEdit (Mac), or SublimeText (Windows, Mac and Linux).

      Expert Interview

      Thanks for reading our article! If you’d like to learn more about html programming, check out our in-depth interview with Tyrone Showers.

      About This Article

      How.com.vn English: Tyrone Showers
      Co-authored by:
      Technologist
      This article was co-authored by Tyrone Showers. Tyrone Showers is a Technologist and the Co-owner of Taliferro Group, an IT consulting company based in Seattle, Washington. With over 35 years of professional experience, he specializes in API Design, e-Commerce, Operational Efficiency, and website development. He has a B.S. in Computer Science from DeVry Institute of Technology. This article has been viewed 106,097 times.
      How helpful is this?
      Co-authors: 33
      Updated: August 22, 2023
      Views: 106,097
      Categories: Programming
      Thanks to all authors for creating a page that has been read 106,097 times.

      Reader Success Stories

      • How.com.vn English: Anonymous

        Anonymous

        Oct 23, 2016

        "Everything helps me in understanding this. I like it very much!"
      Share your story

      Is this article up to date?

      ⚠️ Disclaimer:

      Content from Wiki How English language website. Text is available under the Creative Commons Attribution-Share Alike License; additional terms may apply.
      Wiki How does not encourage the violation of any laws, and cannot be responsible for any violations of such laws, should you link to this domain, or use, reproduce, or republish the information contained herein.

      Notices:
      • - A few of these subjects are frequently censored by educational, governmental, corporate, parental and other filtering schemes.
      • - Some articles may contain names, images, artworks or descriptions of events that some cultures restrict access to
      • - Please note: Wiki How does not give you opinion about the law, or advice about medical. If you need specific advice (for example, medical, legal, financial or risk management), please seek a professional who is licensed or knowledgeable in that area.
      • - Readers should not judge the importance of topics based on their coverage on Wiki How, nor think a topic is important just because it is the subject of a Wiki article.

      Advertisement