Current Section: Html -> Page Anchors // « Back


Page Anchors

---

Ever wonder how people have a link that takes you to another part of the page? Well first off its called a page anchor. It can be helpful if you have a lot of information on one page and makes it easier for the user to navagat through the page also making it faster. They can get the info they want quick and not have to scroll through a bunch of stuff.

---

First thing you have to do is name your paragraph.

<a name="paragraph name">title of paragraph</a>

To help you under stand this better i'll create an example. Lets say the paragraph i want it to anchor too is this:
Kitties!
Cats are great pets to have. They are cute and cuddely. And...in anime they can talk! But how is it that cats can talk? I mean, dags cant talk, lamas cant. o.o maybe cats are going to take over planet o.o''...oops drifted from topic again didn't i? XD

The code for this would be:

<a name="cat">Kitties!</a>
Cats are great pets to have. They are cute and cuddely. And...in anime they can talk! but how is it that cats can talk? I mean, dags cant talk, lamas cant. o.o maybe cats are going to take over planet o.o''...oops drifted from topic again didn't i? XD

---

Next we need the link so it will take us to this paragraph. The code for this is:

<a href="#paragraph name here">paragraph title</a>

For our paragraph above the link would look like this:

<a href="#cat">Kitties</a>

The result of this is:
Kitties!

Note: This link above only works if there is a lot on a page or you are scrolled down on page a lot - -