Maison >interface Web >tutoriel HTML >Introduction aux balises d'ancrage de lien HTML et à leur rôle dans la production de pages SEO_HTML/Xhtml_Web

Introduction aux balises d'ancrage de lien HTML et à leur rôle dans la production de pages SEO_HTML/Xhtml_Web

WBOY
WBOYoriginal
2016-05-16 16:38:581516parcourir

La balise

3499910bf9dac5ae3c52d5ede7383485 est principalement utilisée pour définir des liens et des signets. Elle est également appelée lien hypertexte ou lien d'ancrage. Les utilisations les plus courantes sont les suivantes :

.

Créez un attribut href de lien hypertexte et accédez au lien au milieu de href="".

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

Créez un signet, utilisez l'attribut name ou id et ajoutez "#" à la fin du lien hypertexte et le nom de ce signet pour accéder à un certain emplacement sur la page Web

<a name="top"></a>
<a name="1"></a>
<a name="2"></a>
<a href="#top">返回顶部</a>
<a href="#1">打开第一章</a>
<a href="#2">打开第二章</a>

Lorsque vous ouvrez le didacticiel en ligne E-Dimension Technology W3CSchool, la navigation sous le titre apparaîtra. Ceux-ci sont créés via le nom du signet.

Attributs d'événement Javascript, exécutez différentes commandes après avoir cliqué sur

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

Style CSS du lien d'ancrage

Lorsqu'il n'y a pas de lien d'ancrage personnalisé7441550ff19d67aece0736607957bb92texte du lien d'ancrage5db79b134e9f6b82c0b36e0489ee08edStyle CSS, le style de lien d'ancrage par défaut est le suivant :

Style de lien par défaut, veuillez utiliser la souris pour déclencher et voir l'effet

080b747a20f9163200dd0a7d304ba388

une{couleur:#00F}

a:visité{color:#800080}

a:hover{color:#F00}

531ac245ce3e4fe3d50054a55f265927

7441550ff19d67aece0736607957bb92www.jb51.net5db79b134e9f6b82c0b36e0489ee08ed

a{color:#00F} Les liens d'ancrage non visités sont bleus et soulignés

a:visited{color:#800080} Le lien après avoir cliqué sera violet et souligné

a:hover{color:#F00} Lorsque la souris est enfoncée, elle sera rouge et soulignée

Cependant, parce que ces trois couleurs sont trop fortes, elles ne peuvent souvent pas correspondre à tous les styles de conception Web. Si vous avez besoin de styles de liens d'ancrage dans d'autres couleurs, il vous suffit de modifier la couleur et l'arrière-plan en CSS en fonction des trois styles ci-dessus.

Pourquoi les liens d’ancrage doivent-ils être soulignés ?

En fait, lorsque le HTML a été lancé pour la première fois, les navigateurs n’étaient pas aussi avancés qu’aujourd’hui. En même temps, les écrans d’ordinateur de l’époque n’avaient pas les couleurs des écrans LCD d’aujourd’hui, et beaucoup étaient même en noir et blanc. À cette époque, la manière de distinguer s'il s'agissait d'un lien consistait à souligner. Sur de nombreux écrans en noir et blanc, ou sur des pages Web destinées aux utilisateurs daltoniens, il était préférable de continuer à souligner, sinon les utilisateurs ne pourraient pas distinguer les couleurs. .

Bien sûr, par souci d'esthétique, la conception Web moderne ne met généralement pas de soulignement directement sur les liens. Cependant, afin de prendre en charge les utilisateurs daltoniens et les utilisateurs d'écrans de téléphone mobile en noir et blanc, il est recommandé de définir le style CSS pour qu'il soit souligné lorsque la souris de l'utilisateur le déclenche.

Paramètres de la fenêtre de saut cible du lien d'ancrage

Lorsque vous ouvrez des liens sur cette page, vous constaterez que l'ouverture de certains liens apparaîtra dans d'autres fenêtres, tandis que l'ouverture de certains liens remplacera directement cette page. Cette méthode de saut peut utiliser l'attribut cible du lien d'ancrage pour définir la fenêtre de saut.

_self La fenêtre actuelle est ouverte et les liens d'ancrage passeront par défaut à la fenêtre actuelle du navigateur, c'est-à-dire la cible par défaut="_self"

<a href="http://www.jb51.net/" target="_self">这里是当前新窗口显示E维科技首页</a>

_blank Une nouvelle fenêtre s'ouvre

<a href="http://www.jb51.net/" target="_blank">这里是打开新窗口显示E维科技首页</a>

La cible sans nom s'ouvre dans une nouvelle fenêtre

<a href="http://www.jb51.net/" target="_weigeti"> 如果这里面的_weigeti不是网页内部的name或id,就网页中所有target="_weigeti" 链接都在同一个新窗口打开,而_blank每个链接都打开不同新窗口 </a>

nom ou identifiant du cadre

<a href="http://www.jb51.net/" target="weigeti">点击这里,将在下面name="weigeti" 的框架里面显示E维科技首页,不会跳转新窗口或者替换当前窗口</a>
<iframe name="weigeti"></iframe>

_parent La fenêtre parent s'ouvre et charge le fichier lié dans le jeu de cadres parent ou la fenêtre parent contenant le cadre lié. Si le cadre contenant le lien n'est pas imbriqué, le fichier lié est chargé dans la fenêtre plein écran du navigateur, tout comme le paramètre _self.

<iframe>
   <a href="http://www.jb51.net/" target="_parent">这里是框架内部</a>
</iframe>

_top Le niveau supérieur du cadre , par exemple, la page Web B est intégrée dans l'iframe du réseau A et la page Web C est intégrée dans l'iframe de la page Web B

<iframe>
   <iframe><a href="http://www.jb51.net/" target="_top">这里是框架内部的框架</a></iframe>
</iframe>

Si le paramètre de lien target=_parent dans la page Web C, sautez pour supprimer la page Web B et intégrez directement la page de lien dans la page Web C dans A

Et si target=_top dans la page Web C, il sortira de toutes les iframes et ira directement à la page de liens en C.

_top ouvre le document lié dans toute la fenêtre actuelle du navigateur, supprimant ainsi tous les cadres

Le rôle des liens d'ancrage dans le SEO

Les liens externes ont toujours été considérés comme l'un des éléments essentiels de l'optimisation des moteurs de recherche. Pour cette raison, diverses formes de liens externes sont apparues, mais tous les liens externes ne sont pas efficaces pour le référencement.

Les liens externes écrits en JS ne sont pas valides pour le référencement

Les moteurs de recherche sont relativement réticents à reconnaître Javascript, c'est donc facile à comprendre.

<a href="#" onclick="this.href='http://www.jb51.net/'">这样的链接对SEO无效</a>
<a href="#" onclick="window.open('http://www.jb51.net/');">这样的链接对SEO无效,甚至在Chrome等浏览器下都无法打开</a>

Le lien rel=nofollow est également invalide pour le référencement

Si vous échangez des liens avec un autre site Web et découvrez grâce au code source que l'autre site Web a ajouté l'attribut rel=nofollow à votre lien, cela signifie que le lien ne sera pas exploré par les moteurs de recherche.

<a href="http://www.jb51.net/" rel="nofollow">这样的链接对SEO无效</a>

<meta name="robots" content="nofollow" />
<a href="http://www.jb51.net/">如果网页开头有上面一句话,那么这个网页内部所有链接都不会会搜索引擎抓取,所以对SEO无效</a>

Les liens et les couleurs d'arrière-plan ne sont pas efficaces pour le référencement

La recherche Google a lancé un nouvel algorithme pour sévir contre les liens externes de la même couleur que Pékin, et ces liens externes sont généralement considérés comme des liens noirs.

<style type="text/css">
#vgtlink{background:#FFF}
#vgtlinka{background:#FFF}
</style>
<div id="vgtlink">
  <a href="http://www.jb51.net/" id="vgtlinka">这样的链接对SEO无效</a>
</div>

 <a href="http://www.jb51.net/" style="background:#FFF">这样的链接对SEO也无效</a>
Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn