How to properly assign and use the HTML anchor?


Today's topic for discussion will be the HTML anchor. This element allows quick transitions both inside the page and in external documents. Anchors are often used by web developers. Since they help to organize a website that is convenient for readers. The article will provide a detailed description of this element and examples of effective use.

anchor html


An HTML anchor is a kind of unique bookmarkweb page. It always has its own individual name, which should not be repeated on one page. The main purpose of the anchor is to quickly jump from one part of the document to another, to a specific location. Particularly effective this element brings, when the web page is large. Because of this, users are uncomfortable to read the contents of the site. And the anchor on the HTML page allows for a quick transition.


To create such a bookmark on the page, you canuse two different methods. The first is to use the Name attribute, and in the second case, you need to use the ID attribute. Next, we'll look at each method separately. The transition in both cases occurs using the tag "a", whose attribute contains a name or an identifier. For example: "a href =" # footer "". The # symbol tells the browser that the link will anchor.


The Name attribute was created specifically to create an anchor on the page. Its value can be any text. This HTML anchor can only be used in conjunction with the "a" tag.

anchor on the html page

For example, you want to create a bookmark at the very endyour page. You need to put the tag "a name =" footer "" / a "in the desired part of the web document. In another area of ​​the page, you need to create a link to the anchor, for this, add the entry "a href =" # footer "" link "/ a". When you click on this item, the browser automatically takes you to the part of the document where the Footer tab is located.


First of all, it's worth mentioning that ID isAn identifier that does not have a direct purpose to create anchors. But it allows you to create bookmarks on the entire document area without creating additional links. That is, you can apply the ID attribute to any HTML element. And then, using the "a" tag, refer to it. Here's an example: the "p" element is in the middle of the document. To go to it from the beginning of the page without using scrollbars, add the ID attribute: "p id =" centr "" "/ p". Next, create a link: "a href =" # centr "" The text is "/ a". Thus, we get quick access to any part of the document. The value of the ID attribute can be any text.

html link anchor

Effective use

In HTML, the anchor link is very often used forconstruction of document navigation. For example, a page has a huge amount of textual information, which in turn is divided into separate paragraphs or chapters. To make it convenient for visitors to use the site, you must assign bookmarks to quickly jump to a separate part of the document. To do this, in each chapter we create an anchor link, or use ID identifiers. And from the top we'll make a navigation bar with the contents of all the links. An interesting fact is that you can refer to anchors from other web pages. It is enough to add the value of the Name or ID attributes to the end of the link. Do not forget to add the # symbol. The schema in this case should look like this: main link # name (id).


An HTML anchor is very useful and in somecases, even the necessary element. In the article I presented only one example of its effective use. But in fact, this kind of bookmarks can be used in many situations. The main thing is to understand their main idea.