HTML link anchor tag and its role in SEO

Time:2020-7-8

<a>Tags are mainly used to define links and bookmarks, also known as hyperlinks or anchor links. The most common uses are as follows:

Set up the hyperlink’s attribute and jump to the link in the middle.

<a href="https://www.jb51.net/">www.jb51.net</a>

Create a bookmark, use the name or ID attribute, add “ා” at the end of the hyperlink and the name of the bookmark to jump to a certain location on the page

<a name="top"></a>
<a name="1"></a>
<a name="2"></a>
< a http: // top "> back to top</a>
Open Chapter 1</a>
Open Chapter 2</a>

When you open the e-dimensional W3C school online tutorial, the navigation below the title will be displayed. These are created through the bookmark name.

JavaScript event attribute, click to execute different commands

<a href="javascript:void(0)" onclick="this.href='https://www.jb51.net/'">www.jb51.net</a>

Anchor link CSS Style

When there is no custom anchor link < A=“ https://www.jb51.net/ “> when anchor link text < / a > is CSS style, the default anchor link style is as follows:

The default link style, please use the mouse to trigger to see the effect

<style type=”text/css”>

a{color:#00F}

a:visited{color:#800080}

a:hover{color:#F00}

</style>

<a href=”https://www.jb51.net/”>www.jb51.net</a>

A {color: ා 00f} not visited anchor links are blue and underlined

a: After clicking, the link is purple and underlined

a: Hover {color: ා F00} mouse trigger is red, underline style

However, these three colors are too strong to match all web design styles. If you need anchor link styles of other colors, you just need to modify the color and background according to the above three styles in CSS.

Why should anchor links be underlined?

In fact, when HTML was just launched, browsers were not as advanced as they are now. At the same time, the computer screens at that time did not have the color of LCD, and many of them were even black and white. At that time, the way to distinguish whether a link is a link or not is to use an underline. On many black-and-white monitors or web pages for color blind users, try to keep the underline, otherwise users can’t distinguish colors.

Of course, for the sake of beauty, the general modern web design will not directly put the underline on the link. However, in order to take care of color blind users and black-and-white mobile phone monitor users, it is recommended to set the CSS style to be underlined when the user’s mouse is triggered.

Anchor link target jump window settings

When you open the links on this page, you will find that some open links will pop up to other windows, and open some links will directly replace this page. In this way, you can use the target attribute of the anchor link to set the jump window.

A kind of Self the current window opensBy default, anchor links jump to the current browser window, that is, the default target = “_ self”

<a href=" https://www.jb51.net/ " target="_ Self "> here is the current new window to display the homepage of e-dimensional technology</a>

A kind of Blank new window opens

<a href=" https://www.jb51.net/ " target="_ Blank "> here is to open a new window to display the homepage of e-dimensional technology</a>

Nameless target opens with a new window

<a href=" https://www.jb51.net/ " target="_ Weigeti "> if the_ Weigeti is not the name or ID inside the web page, but all the target = "_ "Weigeti" links open in the same new window, and_ Blank each link opens a different new window</a>

Frame name or ID

<a href=" https://www.jb51.net/ "Target =" weigeti "> Click here, the homepage of e-dimensional technology will be displayed in the frame of name =" weigeti "below, without jumping to a new window or replacing the current window</a>
<iframe name="weigeti"></iframe>

A kind of The parent parent window opensTo load the linked file into the parent frameset or window containing the linked frame. If the link is not loaded in the full screen of the browser_ The self parameter is the same.

<iframe>
   <a href=" https://www.jb51.net/ " target="_ Parent "> here is the inside of the framework</a>
</iframe>

A kind of Top frameFor example, web a embeds iframe into web page B, and web page B embeds iframe into web page C

<iframe>
   <iframe><a href=" https://www.jb51.net/ " target="_ Top "> here is the frame inside the frame < / a > < / iframe >
</iframe>

If the target is set for the connection in web page C=_ Parent, then skip to remove page B from page B and embed the linked page in page C directly from page a;

If the target in web page C=_ Top, it will jump out of all iframe frameworks and turn to the link page in C directly.

A kind of Top opens the linked document in the current browser window, removing all frames

The effect of anchor link on SEO

The outer chain has always been regarded as one of the core of search engine optimization, for which various forms of external chain have appeared, and not all the external chains have an effect on SEO.

The outer chain written by JS is invalid for SEO

Search engines are less willing to recognize JavaScript, all of which is easy to understand.

<a href="#" onclick=" this.href= ' https://www.jb51.net/ '"> such links are invalid for SEO</a>
<a href="#" onclick=" window.open () https://www.jb51.net/ '; "> such links are invalid for SEO, even in browsers such as chrome</a>

Link rel = nofollow is also invalid for SEO

If you change the chain with someone else’s website, through the source code, it is found that the other party’s website has added the rel = nofollow attribute to your link, it means that the link will not be captured by the search engine.

<a href=" https://www.jb51.net/ "Rel =" nofollow "> such links are not valid for SEO</a>

<meta name="robots" content="nofollow" />
<a href=" https://www.jb51.net/ "> if there is a sentence above at the beginning of a web page, all the links inside the page will not be crawled by the search engine, so it is invalid for SEO</a>

Links have no effect on SEO as the background color

Google search brush first launched a new algorithm to crack down on links with the same color as Beijing’s outside chain, which is generally considered to be black chain.

<style type="text/css">
#vgtlink{background:#FFF}
#vgtlinka{background:#FFF}
</style>
<div id="vgtlink">
  <a href=" https://www.jb51.net/ "Id = vglink" > such a link is not valid for SEO</a>
</div>

 <a href=" https://www.jb51.net/ "Style =" background: ා FFF "> such links are also invalid for SEO</a>

Recommended Today

Comparison and analysis of Py = > redis and python operation redis syntax

preface R: For redis cli P: Redis for Python get ready pip install redis pool = redis.ConnectionPool(host=’39.107.86.223′, port=6379, db=1) redis = redis.Redis(connection_pool=pool) Redis. All commands I have omitted all the following commands. If there are conflicts with Python built-in functions, I will add redis Global command Dbsize (number of returned keys) R: dbsize P: print(redis.dbsize()) […]