Links and Linking Absolute Beginners Course in Web Development

Linking is one of the most important assets to web development. This is a tutorial coming from an absolute beginners point of view. There are 2 major kinds of links. There are inbound links and outbound links. Lets illustrate both examples.

Inbound Links

An inbound link is a link that is linked within your website. You will “link” the pages together using an “anchor” element. On this webpage you will see a lot of inbound links in the menu above. As long as the links start with https://a1websitepro.com you know it is an inbound link because it resides on this server. There are 2 different ways to write inbound links.

Inbound Link Method #1

In this method we are going to use the complete URL {Universal resource Locator}. This is a fancy way of saying web address.

Only cool people share!

<a href="http://yourwebsite.com/page.html">Page Anchor text</a>

 

Inbound Link Method #2

Since we are working within our domain we do not have to put the first part of the URL in. We can use a “relative” link address. Here is an example.

<a href="page.html">Page Anchor text</a>

 

Outbound Linking

Outbound linking requires you to put the full URL in the link. Like method #1 above you must include the domain name. here is an example of our Facebook page outbound link.

<a href="https://www.facebook.com/pages/A1WebsitePro/139087542802830">Outbound Link Anchor text</a>

 

Jump Anchor Links

You may want to use jump anchor links. This will put a link on you page that will jump to a certain section of the page. The first thing you want to do is set and id in a tag.

<p id="foo">This is a paragraph tag with the id of foo</p>

Now create the link at the top of the page.

<a href="#foo">Jump To Foo</a>

You can jump down on a page or even jump up on a page.

target=””

If you wanted your link to open in a new tab on the users browser use the target=”_new” attribute in the link.

<a href="https://facebook.com" target="_new">Outbound Anchor Text</a>

rel=”nofollow”

If you do not want search engine spiders to follow your links use rel=”nofollow”. Webmasters use this method when linking to sites that they do not want to pass page rank to.

<a href="https://facebook.com" rel="nofollow" target="_new">Outbound Anchor Text with nofollow</a>

Codes for Today’s Lesson

Here are the codes for both pages that we used in today lesson.

index.html file

<html>
<head>
<title>All About Links</title>
</head>
<body>
<a href="inbound.html" target="_blank" rel="nofollow" title="Learn Linking">Inbound Link</a>
<a href="https://a1websitepro.com/links-and-linking-absolute-beginners-course-in-web-development/">Click Here</a>
<a href="#foo">Link To Foo</a>

<h2 id="boo">Heading 1</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<h2>Heading 2</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<h2>Heading 3</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<h2>Heading 4</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<h2>Heading 5</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<h2>Heading 6</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<h2>Heading 7</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<h2>Heading 8</h2><a href="#boo">Top</a>
<p id="foo">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</body>
</html>

inbound.html

<html>
<head>
<title>Inbound Link Example Page</title>
</head>
<body>
<h1>Inbound Link Example Page</h1>
</body>
</html>

 

Next Lesson

Links and Linking Absolute Beginners Course in Web Development was last modified: October 29th, 2021 by Maximus Mccullough
Summary
Links and Linking Absolute Beginners Course in Web Development
Article Name
Links and Linking Absolute Beginners Course in Web Development
Description
Linking is one of the most important assets to web development. This is a tutorial coming from an absolute beginners point of view. There are 2 major kinds of links. There are inbound links and outbound links. Lets illustrate both examples.
Author
Publisher
A1WEBSITEPRO LLC
Logo
Links and Linking Absolute Beginners Course in Web Development

1 Comment

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.