Link to home page

Intro

In this lesson, we’ll go over how to link back to your home page from the About page. It’s a little different than creating links to other pages.

Steps

Now let’s add a link from about.html back to the home page. Open up about.html again in your editor.

There are a couple of ways of linking to the home page.

Add anchor element

First, create a new line after the <h1> element. Then type a and press Tab. Type / for the href attribute, and put the word Home for the link text.

<h1>About</h1>
<a href="/">Home</a>

Try clicking on the About link in the preview to get to the About page. You should see a new link that says Home on the About page. Try clicking on the Home link to get back to the Home page.

Second approach

You can also write index.html instead of /. However, if you use this approach, people will see index.html in the address bar, which doesn’t look as nice (it would look something like this: example.com/index.html).

<!-- second method (not recommended) -->
<a href="index.html">Home</a>

Final code

If you’ve been following along so far, this is the code that should be inside the body tags in about.html.

<h1>About</h1>
<a href="/">Home</a>