Contacts

Bases HTML : Travailler avec des liens. Balise A et ses attributs rel, target, name. Est-il possible d'utiliser target="_blank". Question d'un lecteur Attribut cible de la balise a

Description

Vous pouvez définir la fenêtre dans laquelle sera chargée la page Web ouverte à partir du lien. Pour cela, utilisez l'attribut target ; sa valeur est le nom de la fenêtre ou du frame. Si la cible n'est pas définie, le résultat renvoyé est affiché dans la fenêtre actuelle.

Valeurs de syntaxe

La valeur est le nom de la fenêtre ou du cadre. Si un nom inexistant est défini, une nouvelle fenêtre s'ouvrira. Les éléments suivants sont utilisés comme noms réservés.

Vide Charge la page dans une nouvelle fenêtre de navigateur. _self Charge une page dans la fenêtre actuelle. _parent Charge la page dans le cadre parent ; s'il n'y a pas de cadre, cette valeur fonctionne comme _self . _top Supprime tous les cadres et charge la page dans une fenêtre de navigateur complète ; s'il n'y a pas de cadres, cette valeur fonctionne comme _self .

Si target="_blank " est défini pour la balise, vous pouvez ouvrir le lien dans la fenêtre actuelle en l'ajoutant à la balise attribut target="_self" .

Validation par défaut

L'utilisation de cet attribut est déconseillée par la spécification HTML ; un code valide n'est obtenu qu'en utilisant la transition .

Exemple 1 : Ouverture d'un lien dans une nouvelle fenêtre

Balise de base, attribut cible

Exemple 2

Balise de base, attribut cible

Navigateurs : Ordinateur de bureau Mobile ?
Internet ExplorerChromeOpéraSafariFirefox
2 1 2 1 1
AndroidFirefox MobileOpéra MobileSafari Mobile
1 1 6 1

Navigateurs

Les notations suivantes sont utilisées dans la table du navigateur.

  • - l'élément est entièrement pris en charge par le navigateur ;
  • - l'élément n'est pas perçu par le navigateur et est ignoré ;
  • - pendant le fonctionnement, diverses erreurs peuvent apparaître, ou l'élément est pris en charge avec des réserves.

Le numéro indique la version du navigateur à partir de laquelle l'élément est pris en charge.

Bonjour, chers lecteurs du site blog. J'ai décidé de consacrer la publication d'aujourd'hui à l'aspect le plus important du webmastering, où je vais essayer d'expliquer en détail ce qu'est un lien hypertexte, qui est inextricablement lié à, qui, à son tour, sans exagération, constitue la base d'Internet.

Mais pour créer correctement des hyperliens et les insérer dans le code des pages Web (par exemple, votre site Web), vous devez étudier le domaine correspondant du langage de balisage hypertexte (), puisque ces éléments sont formés à l'aide du code HTML. une balise, qui a la capacité de mettre à niveau le lien vers le type souhaité.

Ainsi, aujourd'hui, nous examinerons de quelles parties se compose un lien hypertexte, comment l'utilisation de l'attribut target blank permet d'ouvrir une page dans une nouvelle fenêtre (onglet), comment faire de n'importe quelle image un lien et bien d'autres détails importants. Entre autres choses, ces informations vous feront progresser dans l’apprentissage du langage HTML.

Qu'est-ce qu'un hyperlien et peut-on l'appeler un lien ?

Répondant à la question posée dans le titre, je dirai que le terme « lien » a un spectre sémantique plus large (lien vers la Sibérie, bancaire pour identifier le payeur, texte dans un livre, etc.), incluant le sens inhérent à la notion de « hyperlien » , qui est associé uniquement à l'hypertexte, qui permet de percevoir des informations de manière non linéaire.

Ainsi, un lien hypertexte est un cas particulier de lien, il est donc tout à fait possible de les utiliser sur un pied d'égalité dans le sujet d'aujourd'hui. C'est ce que j'utiliserai à mon avantage tout au long du message d'aujourd'hui, en utilisant les deux termes pour éviter les spams inutiles par mots clés.

Mais il existe aussi des services invisibles, créés à l'aide de et situé à l'intérieur, dont la tâche est d'envoyer de nombreux signaux et commandes aux navigateurs pour exécuter une fonction particulière.

Par exemple, en utilisant des hyperliens de service, il est possible d'afficher une icône. Ils ne sont visibles que dans le cadre du code HTML (pour cela, cliquez sur n'importe quelle page ouverte dans le navigateur) :


Pour l’instant, laissons de côté les liens de service et considérons le modèle général de création d’hyperliens. Ce qu'ils ont en commun, c'est qu'ils ont tous un attribut href obligatoire, dont la valeur est l'adresse du document (). Un lien HTML peut mener soit vers une page interne du site, soit vers un document externe.

Encore une remarque importante. L'utilisation de l'attribut href rend les hyperliens cliquables, c'est-à-dire qu'il permet aux utilisateurs d'accéder automatiquement à la page correspondante du site Web en cliquant dessus.

Comment créer un lien hypertexte en HTML en utilisant href

Ainsi, nous savons déjà que pour créer un lien, il faut la balise a et l'attribut href, dont les paramètres peuvent être des URL de différents types. Puisque a est , alors entre l'ouverture et fermeture contient le contenu qui sera affiché sur la page Web.

Ce contenu est appelé une ancre et peut être présenté sous forme de texte ou d’image (nous parlerons plus en détail de la façon de faire d’une image un lien ci-dessous). Comme je l'ai déjà noté, l'ancre sera cliquable. Regardons un exemple de lien hypertexte avec du contenu textuel. Voici à quoi ressemblera sa conception en code HTML :

un peu sur les ancres

En plus du HTTP, le protocole sécurisé HTTPS peut être utilisé. Le lien ne doit pas nécessairement mener à une page Web. Tout dépend de la valeur href, qui peut être le chemin d'accès à un fichier :

//site/wp-content/uploads/2012/05/giperssylqi-v-html.jpg

télécharger

Sur la page web, ce lien prendra la forme suivante :

Le navigateur « comprend » qu’un objet portant l’extension .zip ne peut être destiné qu’au téléchargement, ce que l’utilisateur est invité à faire.

À propos, le chemin d'accès à n'importe quel fichier est parfois indiqué via FTP(). Ensuite, dans l'URL utilisée comme paramètre d'attribut href, vous devez simplement remplacer le protocole HTTP (HTTPS) par FTP. Le lien du fichier ressemblera à ceci :

télécharger depuis le serveur

Mais ce n'est pas tout. De même, un lien vers le courrier électronique est créé à l'aide du pseudo-protocole mailto pour un accès rapide à la fonction de rédaction de lettres :

écrire des lettres

Après avoir cliqué sur un tel lien, une fenêtre du client de messagerie par défaut devrait apparaître, dans laquelle vous pouvez composer le texte du message et l'envoyer à l'adresse déjà spécifiée, tirée, comme vous l'avez probablement deviné, du href.

Dans la pratique, les hyperliens vers le courrier étaient très souvent utilisés auparavant par les webmasters et les propriétaires de grandes ressources pour assurer la commodité des utilisateurs et des clients qui pouvaient accéder au formulaire de courrier en un clic.

Mais ce type de communication sur les ressources Web n'est plus aussi populaire (d'autant plus qu'il peut être installé par exemple), car les adresses e-mail ainsi ouvertes sont activement interceptées par des logiciels et utilisées par divers types de spammeurs.

J'ai donné à titre d'exemple uniquement les protocoles les plus courants qui font partie de l'URL, qui, à son tour, est un paramètre de l'attribut href lors de la formation d'un lien hypertexte. En plus de HTTP (HTTPS), FTP et mailto, il en existe d'autres pour résoudre des problèmes plus spécialisés. Peut-être les examinerons-nous plus en détail dans d’autres publications.

Types d'hyperliens

Essayons maintenant de classer les liens selon certains critères.

Selon leur périmètre :

1. Externe - mènent à des pages situées en dehors du site sur lequel elles sont publiées ;

2. Interne - connectez les pages Web situées dans la même ressource Web.

Par format :

2. Graphiquement - dans ce cas, l'ancre du lien hypertexte est une image (y compris une vignette), une bannière, un bouton, etc.

Par type d'URL servant de valeur à l'attribut href :

1. Absolu, qui contient une indication explicite du protocole de transfert de données (par exemple, HTTP) et du nom de domaine du site (dans tout ce qui concerne les domaines).

Ces liens sont le plus souvent utilisés pour renvoyer à des pages de ressources externes. Dans ce cas, la valeur href inclura le chemin complet vers le fichier ou la page Web souhaité. Voici un exemple de lien hypertexte absolu :

Le contexte, qu'est-ce que c'est ?

2. Relatif, une des options de création qui sera le chemin précisé par rapport au dossier racine du site (d'où le nom de ce type d'hyperliens). Dans ce cas, le protocole (HTTP) et le domaine du site seront supprimés de l'URL :

Le contexte, qu'est-ce que c'est ?

Les hyperliens relatifs sur une page Web peuvent fournir des liens vers des pages internes. Sous cette forme, ils sont plus courts, ce qui facilite le code HTML. Bien sûr, tout n’est pas si simple et nécessite une couverture plus large, que vous pouvez voir en suivant le lien fourni.

Attributs de la balise a

Voyons maintenant quels autres attributs existent, outre le href requis, et comment ils peuvent affecter la création d'un lien hypertexte. Les données les plus complètes à cet égard, pour ainsi dire, « de première main », peuvent être trouvées sur le site officiel du Consortium international W3C, où les informations les plus récentes apparaissent le plus rapidement.

Ils sont totalement identiques et déclenchent l'ouverture d'une page web dans l'onglet courant. Si vous souhaitez que les pages s'ouvrent dans un nouvel onglet lorsque vous suivez des liens, vous devez ajouter l'attribut target avec le paramètre vide lors de la création d'un lien :

Le contexte, qu'est-ce que c'est ?

Bien que certains webmasters et spécialistes du référencement estiment qu'il est préférable que le visiteur ait la possibilité de choisir (c'est-à-dire de ne pas spécifier de cible), car si nécessaire, la page peut être ouverte dans un nouvel onglet à l'aide du menu contextuel (déplacer le curseur sur le lien, faites un clic droit et cliquez jusqu'au point approprié) :


De plus, comme vous pouvez le constater, dans ce cas, l'utilisateur a l'avantage de pouvoir ouvrir une page Web non seulement dans un nouvel onglet, mais également dans une nouvelle fenêtre (cette option ne peut pas être implémentée via HTML, uniquement à l'aide de scripts). .

Mais je pense que tous les utilisateurs novices ne connaissent pas parfaitement les capacités et les paramètres des navigateurs populaires (). Il est fort probable qu'un lecteur, ayant suivi un hyperlien externe et ayant perdu de vue la page source (le document destinataire apparaîtra à sa place), fermera simplement l'onglet par frustration.

Ainsi, le propriétaire d'une ressource Web peut non seulement perdre un visiteur prometteur, mais également subir une détérioration des facteurs comportementaux (), ce qui entraînera une perte de position de la page dans le classement.

De plus, ouvrir une page dans un onglet adjacent est très pratique d'un point de vue convivialité (). L'utilisateur suit un lien hypertexte vers une page Web, reçoit des informations supplémentaires et, comme si de rien n'était, continue d'étudier le matériel principal.

Pour créer une image objective, il convient d'ajouter que l'application de « target="_blank" » à des liens externes s'avère lourde de risques pour la sécurité. Si quelqu'un est intéressé, vous pouvez lire où des recommandations sont données pour résoudre les problèmes lors de l'utilisation du blanc cible, ainsi que des options alternatives pour mettre en œuvre la tâche d'ouverture d'une page Web dans un nouvel onglet.

Il semble que j'ai noté tous les avantages et inconvénients de l'utilisation de la valeur vide pour ouvrir un lien hypertexte dans un nouvel onglet. Si vous lisez des articles sur mon blog, vous avez probablement déjà deviné mon attitude envers ce paramètre d'attribut cible.

Pour le moment, ses avantages l’emportent sur ses inconvénients et j’en suis un partisan inconditionnel. Sur la base des faits ci-dessus, vous pouvez vous forger votre propre opinion sur cette question. Bien que... compte tenu de l'émergence de nouvelles circonstances, cela peut changer.

Comment créer des liens de hachage, des ancres et pourquoi sont-ils nécessaires ?

Ensuite, je voudrais attirer votre attention sur un autre type d'hyperliens, qui peuvent être utiles si le matériel situé sur une page Web est assez volumineux et doit être structuré pour améliorer la navigation.

Vous n’avez pas besoin de chercher bien loin un exemple, il suffit de regarder la table des matières de cette publication au tout début. Voyez-vous qu'il y a une liste de sections de l'article ? Les hyperliens vers ces sections ne sont que des liens de hachage. Après avoir cliqué sur l'un d'entre eux, le navigateur fera défiler la page jusqu'à l'endroit où commence la partie correspondante.

De tels liens se créent tout simplement. Vous devez d'abord créer une ancre (ancre) en plaçant la marque appropriée à l'endroit requis sur la page sous la forme d'un identifiant, qui est l'un des attributs globaux appliqués à toute balise HTML.

Grâce à l’universalité de l’identification, ces balises d’ancrage peuvent être installées presque n’importe où sur une page Web. Étant donné que le texte est généralement divisé en paragraphes, ils peuvent également être appliqués aux fichiers . Je pose principalement des ancres avec lesquelles les articles sont divisés en parties logiques :

Après avoir ainsi marqué tous les endroits nécessaires dans le code HTML, nous créons ensuite des hyperliens vers ceux-ci. Pour ce faire, à la fin, après la dernière barre oblique « / » dans l'URL (qui, comme vous le savez déjà, est la valeur de l'attribut href), on écrit séquentiellement le signe dièse « # » et le nom de l'étiquette (ID ) :

Comment former des liens de hachage et des ancres ?

De plus, si un tel lien d'ancrage est placé sur la même page que les ancres, alors une partie de l'URL jusqu'à et y compris la dernière barre oblique avant le hachage peut être omise et seul « # » plus le nom d'ID sont utilisés comme paramètre href. (en substance, c'est l'une des options pour les liens relatifs) :

Comment former des liens de hachage et des ancres ?

Autrement dit, lors de la compilation d'une table des matières pour un manuel visant à optimiser le code HTML, vous pouvez facilement utiliser cette option légère. Si vous ne mettez qu'un seul signe dièse comme URL, sans le nom de l'identifiant, alors à partir de l'endroit où se trouve un tel lien, la page défilera jusqu'en haut :

Haut

En fait, c'est l'option la plus simple, qui constitue encore une fois un avantage supplémentaire pour la convivialité de la ressource, car elle facilite la vie de ses visiteurs. Vous pouvez utiliser une image attrayante comme ancre pour créer un bouton.

Comment supprimer le soulignement et changer la couleur du lien

Les développeurs HTML ont réfléchi à presque toutes les nuances qui peuvent aider à optimiser tel ou tel aspect, il en va de même pour les hyperliens. Par exemple, en suivant un hyperlien vers une autre page Web puis en revenant en arrière, l'utilisateur verra que l'hyperlien a changé de couleur.

S'il doit répéter de telles actions à plusieurs reprises, il pourra déterminer rapidement sur quels liens il a déjà cliqué et lesquels il n'a pas cliqué. Cette option est incluse dans presque tous les navigateurs. Il n’est pas nécessaire d’expliquer à quel point cela est pratique et combien de temps cela permet de gagner.

Par défaut, et sans utilisation d'outils CSS, les hyperliens sont mis en évidence avec un soulignement et trois options de couleur, chacune ayant son propre attribut pour :

  • lien - définit la couleur du lien hypertexte sur la page Web (bleu par défaut, désigné #0000ff) ;
  • alink — la couleur du lien hypertexte actif pendant la période pendant laquelle il est traité par le navigateur Web (rouge #ff0000) ;
  • vlink — la couleur du lien visité par l'utilisateur (violet, #800080).

Comment modifier les couleurs des liens que les navigateurs affichent pour votre site ? Eh bien, pour un simple site HTML où les pages sont créées manuellement (et je pense qu'il n'existe pratiquement pas de ressources entièrement fonctionnelles de ce type dans les réalités modernes, à l'exception de simples journaux et pages de destination), il vous suffit de trouver la balise d'ouverture et d'écrire le les paramètres nécessaires (d'ailleurs, pour désigner les couleurs et son nom peuvent être utilisés), par exemple :

Si vous avez installé un système de gestion de contenu () pour administrer votre ressource Web, alors, quel que soit le type de moteur que vous utilisez, vous devez ouvrir pour éditer le fichier chargé d'afficher l'en-tête (en-tête), où la balise d'ouverture est présente .

Si votre ressource exécute WordPress, alors pour mettre en œuvre pratiquement cette idée, vous pouvez l'utiliser comme un outil pour insérer automatiquement une image dans un lien hypertexte, où vous sélectionnez d'abord dans la bibliothèque ou téléchargez l'image souhaitée et l'insérez dans le texte :

Sélectionnez ensuite le code de l'image obtenu et appuyez sur le bouton « lien » de l'éditeur, après quoi vous collez le lien hypertexte copié souhaité dans la fenêtre qui apparaît :


Bonjour, chers lecteurs du site blog. Aujourd'hui, je veux parler plus en détail de ce qu'est un lien hypertexte en HTML, comment les placer dans le texte d'un site Web, comment créer un lien vers une image, comment utiliser correctement la balise « A » et ses attributs » Href » et « Target blank » (ouvrir dans une nouvelle fenêtre).

En général, un lien hypertexte est un élément clé. De plus, les liens constituent désormais l’un des trois principaux facteurs qui influencent la réussite de la promotion d’un site Web. Les utiliser correctement et comprendre, par exemple, comment ils sont affectés par les moteurs de recherche, peut affecter considérablement le trafic vers votre ressource.

Que sont les hyperliens et les ancres ?

Ainsi, nous avons déjà rencontré des balises obsolètes qui ne sont pas recommandées pour un usage quotidien. Continuons notre connaissance.

Afin de créer un lien hypertexte en code HTML, nous devrons également utiliser la balise A. Pour cela, nous pouvons utiliser divers attributs, définissant par exemple l'adresse URL de la cible pour se déplacer sur ce lien (href) ou instruisant à ouvrir dans une nouvelle fenêtre (target= _blank). Mais parlons de tout dans l'ordre.

Comme nous l'évoquions juste plus haut, les hyperliens sont un élément clé du langage HTML et ils permettent de créer un lien aussi bien vers les pages internes de votre propre site que vers d'autres ressources Internet. Je dirai une banalité - suivre un lien s'effectue en cliquant dessus (qu'en avez-vous pensé ?).

En plus du fait qu'ils peuvent être divisés en internes ou externes, ils peuvent également être auxiliaires et utilisés exclusivement pour les besoins du navigateur avec lequel les pages de votre site seront ouvertes.

Dans ce cas, ils ne seront pas visibles sur la page, car sont écrits dans la zone Head du code source du document, dont le contenu n'est pas affiché sur la page (j'ai évoqué la structure du code du langage de balisage hypertexte dans l'article sur ).

Les hyperliens de service sont créés non pas à l'aide de la balise « A » (comme les hyperliens habituels), mais à l'aide de la balise « Lien ». Ils effectuent de nombreuses tâches, par exemple, avec leur aide, des fichiers externes avec des feuilles de style en cascade CSS ou, par exemple, des fichiers .

Mais aujourd'hui, nous n'examinerons pas comment les créer (nous y reviendrons), mais nous nous attarderons en détail sur les liens visibles qui peuvent être créés à l'intérieur de la zone Corps et, par conséquent, ils seront affichés sur la page Web.

Mais néanmoins, tous les hyperliens (à la fois visibles et de service) ont une chose en commun : ils contiennent tous l'attribut Href requis. Dans celui-ci, comme sa valeur, est écrit un certain endroit dans le document (s'il a été préalablement marqué d'une ancre) ou l'adresse du document lui-même sur Internet (en Href, ou, en d'autres termes, le chemin d'accès à la page ou un autre fichier est écrit).

Les hyperliens sont des éléments de navigation conçus pour vous transférer vers d'autres documents du réseau, ou pour naviguer dans le contenu d'une page Web que vous consultez déjà à l'aide de marques faites au préalable dans le corps du document, également appelées ancres HTML.

Il peut y avoir une certaine confusion ici, parce que... en SEO, le mot est , mais en HTML, « ancre » désigne une ancre (traduction du mot ancre) ou une marque dans le texte, qui peut ensuite être référencée.

Pourquoi les ancres sont-elles utilisées en HTML ? C'est très pratique lors de la création d'une navigation sur une page Web assez longue. Vous l'avez probablement vu sur Internet lorsque sur la page que vous ouvrez, immédiatement en dessous de son titre se trouvent les noms des sections de l'article publié sur cette page.

De cette façon, le lecteur pourra se rendre immédiatement à l'endroit de la page où se trouve l'information qui l'intéresse, plutôt que de s'embêter à faire défiler le texte et à chercher visuellement le bon endroit. Pratique et améliore.

Comment les ancres et les hachages de liens sont créés

Ainsi, notre tâche dans ce cas sera d'installer des ancres aux bons endroits sur la page (document), qui ressembleront en général à ceci :

Ceux. pour créer une ancre, vous devez saisir un seul attribut « Nom » dans la balise d'hyperlien vide « A », dont la valeur utilise une étiquette unique qui ne doit pas contenir d'espaces et dans laquelle vous pouvez utiliser des caractères latins, des chiffres , traits d'union et traits de soulignement (en complète analogie avec les règles selon lesquelles vous pouvez créer des URL - ,,,[_],[-]).

Dans ce cas, l'ancre ne sera pas visible sur la page elle-même, car Nous n'avons écrit aucun texte à l'intérieur des éléments « A ». Cependant, les ancres créées de cette manière pollueront le code HTML, et donc maintenant beaucoup plus souvent que les ancres, elles utilisent une autre manière pour créer une étiquette.

Dans ce cas, vous n’avez pas besoin de créer une balise « A » vide, mais vous pouvez utiliser n’importe lequel des éléments déjà disponibles au bon endroit dans le texte. Par exemple, ceux-ci pourraient être .

Ceux. pour créer un analogue d'une ancre, il suffit d'attribuer un attribut d'identification universel à n'importe quelle balise (il peut être utilisé pour toutes les balises et, d'ailleurs, ils fonctionnent sur cette base), par exemple, comme ceci :

Texte du titre

Alors maintenant, au lieu de créer le nombre requis d'ancres qui polluent le code et ne sont actuellement pas valides (non recommandé par le consortium W3C, qui développe le langage HTML), on ajoute simplement Id.

Il s'avère que pour cela il faudra, comme d'habitude, insérer l'attribut recherché « Href » à l'intérieur du lien hypertexte « A », mais dont la valeur sera formée à partir du nom de l'étiquette souhaitée (ancre) précédé d'un hachage signe « # », également appelé hachage (c'est d'ailleurs là que poussent les jambes du nom fréquemment utilisé : hachage de lien) :

se déplacera à l'endroit de la page marquée d'une ancre

Veuillez noter que lorsque vous cliquez sur un tel hyperlien, aucun nouveau document ne sera ouvert. Le navigateur fera défiler la page déjà ouverte jusqu'à une position telle que l'endroit dans le texte où vous avez inséré l'ancre prend position tout en haut de l'écran. Il serait logique de supposer que les valeurs de toutes les balises (ancres) sur une page doivent être uniques afin d'éviter toute confusion pour le navigateur.

Si vous créez une ancre en utilisant l'attribut ID dans une balise idéalement située, vous devez alors prendre en compte qu'en plus de la restriction sur le type de caractères utilisés (,,,[_],[-]), la valeur ID doit commencer par une lettre latine.

Ensuite, tous les caractères valides peuvent être placés dans n'importe quelle quantité, mais le premier caractère de l'étiquette d'ancrage dans la valeur de l'attribut ID doit être une lettre (en latin, bien sûr). Sinon, une telle ancre insérée dans le code HTML ne fonctionnera pas (dans la plupart des navigateurs).

Si vous n'écrivez aucun nom d'étiquette d'ancrage (href="#") après le symbole dièse "#", alors un tel lien hypertexte fera défiler la page jusqu'au début. Voici comment créer un simple bouton « Retour en haut » en créant un lien à partir de l’image (nous en reparlerons un peu plus tard) et en l’insérant dans votre modèle de site Web, par exemple, comme ceci :

Href est un attribut de balise obligatoire de tout lien hypertexte

Passons maintenant de la navigation à l'intérieur du document (à l'aide d'ancres) à la navigation externe, c'est-à-dire nous devrons faire des liens menant vers d'autres documents sur notre site ou sur un autre. Désormais, dans l'attribut Href, nous n'avons plus besoin de spécifier les étiquettes d'ancrage, mais le chemin d'accès au fichier à ouvrir (la page, de par sa conception, est un fichier chargé dans le navigateur pour un affichage ultérieur).

ancre

Ici, nous devrions en parler davantage, mais j'en ai déjà parlé plus en détail dans le matériel mentionné, donc cela n'a probablement pas de sens de me répéter. Mais vous devez savoir comment définir le chemin d'accès au fichier dans l'attribut Href du lien hypertexte que vous avez créé. Par conséquent, n’essayez pas de vous familiariser avec le matériel fourni.

Cependant, je vous rappelle que lors de la création d'Urls, il est préférable d'utiliser uniquement les caractères suivants : (,,,[_],[-]) et de ne pas utiliser d'espaces. Si l'on considère le contenu de l'attribut Href pour les liens absolus, alors il peut être représenté schématiquement comme suit :

Si nous écartons ce que vous utiliserez rarement, alors vous pouvez présenter la même chose sous une forme quelque peu simplifiée :

Protocole (généralement http)://nom_domaine (par exemple, site Web)/chemin_vers_fichier (pages Web)

En plus du simple protocole http, vous pouvez trouver sur Internet des liens avec le protocole https, qui diffère en ce qu'il utilise le cryptage. Ce dernier est utilisé sur les sites où il est nécessaire de protéger le canal d’échange de données entre le serveur et le navigateur du client. Par exemple, il est utilisé dans les services de monnaie électronique Web Money.

Sur Internet, vous pouvez trouver différentes versions du contenu Href, par exemple celle-ci :

Https://site/videokursy

Ou ceci (avec l'extension de fichier) :

Https://site/seo/kak-raskrutit-sajt.html

Cela ne change pas l'essentiel, mais s'il y a une barre oblique à la fin du contenu de l'attribut Href à l'intérieur du lien hypertexte, cela signifie que l'accès ne se fait plus au fichier, mais au dossier dans lequel sera l'objet d'index correspondant. être recherchée (pour plus de détails, lire l'article sur les adresses url mentionné ci-dessus).

Téléchargez quelque chose à partir du lien

Comme vous pouvez le constater, cet hyperlien n'est pas différent d'un lien hypertexte normal, le navigateur comprend simplement qu'il doit télécharger le fichier avec l'extension zip et ne pas essayer de l'ouvrir pour le visualiser, comme, par exemple, des fichiers de documents avec l'extension HTML. extension. Cependant, vous pouvez personnaliser tout cela de manière purement individuelle dans votre navigateur en fonction de vos besoins personnels.

Télécharger depuis le serveur FTP

Vous pouvez aussi, par exemple, en créer une (mail) en ajoutant l'Url correspondante au Href :

Écrire une lettre

Lorsque vous cliquez sur un tel lien, le programme de messagerie par défaut que vous utilisez s'ouvrira sur votre ordinateur (vous pouvez configurer le navigateur pour que les liens avec mailto dans Href s'ouvrent dans Gmail, etc.) et une boîte de dialogue pour créer une nouvelle lettre apparaîtra, dans lequel dans le champ « À » sera insérée l'adresse postale indiquée dans Href.

En fait, vous pouvez créer des liens de courrier électronique assez complexes, à l'aide desquels d'autres champs de la boîte de dialogue d'envoi de courrier électronique seront remplis, mais cela est assez rarement utilisé.

Et en général, les webmasters ont récemment pratiquement cessé d'utiliser des hyperliens avec mailto dans Href en raison du fait qu'ils sont analysés par les spammeurs avec toutes les conséquences qui en découlent. Il est préférable de le créer sur le site, même si j'ai toujours tout présenté sous une forme classique sur la page contact. Je devrais le changer à loisir (ou pas... j'y réfléchirai).

Comment ouvrir un lien dans une nouvelle fenêtre (cible vide)

Lors de la création de liens en code HTML, nous sommes souvent confrontés à la question : dans quelle fenêtre du navigateur devons-nous ouvrir le document auquel il mène ? Par défaut, il s'ouvrira dans une fenêtre existante, chevauchant la page à partir de laquelle cet hyperlien a été placé.

Personnellement, je suis un grand partisan de l'attribut Target avec la valeur blank , qui permet d'ouvrir une page dans une nouvelle fenêtre, laissant ouvert le document dans lequel le lien a été placé. Je ne sais pas comment cela affecte la convivialité de mon blog, mais je préfère cette option et je l'utilise dans presque tous les cas.

Dans les moteurs de recherche, j'aime aussi configurer l'ouverture des liens dans une nouvelle fenêtre, pour que les résultats soient toujours à portée de main et que vous puissiez toujours y revenir. À ces fins, comme déjà mentionné, HTML utilise un attribut Target spécial, qui a par défaut la valeur Self :

Ouvre le document dans la même fenêtre

Bien sûr, personne n'écrit target="_self" dans la balise "A", car cette valeur est utilisée par défaut, mais si vous devez ouvrir la page dans une nouvelle fenêtre, vous devrez écrire target="_blank " :

Ouvre dans une nouvelle fenêtre

Veuillez noter que les valeurs de l'attribut Target sont écrites avec un trait de soulignement au début (_blank), car cela est stipulé dans le validateur Wc3, qui contient des trous dans le langage de balisage hypertexte. Ce qui est remarquable, c’est que HTML offre la possibilité de modifier l’option d’ouverture de lien par défaut.

Par exemple, si vous souhaitez que tous les hyperliens de votre site s'ouvrent dans une nouvelle fenêtre, vous devrez ajouter une balise Base avec l'attribut target="_blank" dans la zone Head du modèle que vous utilisez :

il y a autre chose là

Et maintenant, si vous souhaitez ouvrir l'un des liens dans la même fenêtre, alors vous devrez ajouter target="_self" à sa balise « A », car par défaut vous utilisez désormais _blank. Oh comment.

À propos, j'ai utilisé l'élément Base de la manière décrite ci-dessus, mais j'y ai également inclus une zone de code avec plusieurs hyperliens qui devaient être ouverts dans une nouvelle fenêtre. Ceux. J'ai également utilisé la balise de fermeture Base à l'intérieur de la zone Corps et cela a fonctionné. Bien entendu, un tel code s’avère invalide.

Survolez et cliquez sur les couleurs des hyperliens : comment les modifier

Le langage HTML a été conçu pour que l'utilisateur puisse facilement naviguer entre les liens qu'il a déjà ouverts et ceux qui sont restés intacts.

A cet effet, on utilise une couleur qui changera lorsque l'utilisateur cliquera sur le lien hypertexte et que le document qui y est lié sera ouvert avec succès. En revenant à la page d'origine, l'utilisateur constatera que le lien qu'il a visité a changé de couleur. Tous les navigateurs peuvent faire cette astuce.

Par défaut, en HTML pur (sans utiliser les propriétés CSS), les liens sont soulignés et peuvent avoir trois options de couleurs :

  • Le bleu est la couleur des liens non suivis sur lesquels l'utilisateur n'a pas encore cliqué
  • Rouge - il est accepté par le lien hypertexte immédiatement après avoir cliqué dessus et jusqu'à ce que le document demandé soit téléchargé sur le navigateur de l'utilisateur via le réseau (dans les conditions modernes, il n'est pas du tout facile de saisir ce moment et tout est à blâmer partout)
  • Le violet est la couleur des liens dépensés que l'utilisateur a déjà suivis
  • Dans HTML 4.01, ces couleurs pour les liens sont celles par défaut, mais elles peuvent être modifiées à l'aide d'attributs spéciaux écrits dans la balise Body, que vous pouvez trouver dans l'un des fichiers du modèle que vous utilisez. Pour changer les trois couleurs, trois attributs sont utilisés respectivement :

  • Lien : définit la couleur d'un lien non visité
  • Alink - la couleur de celui actuellement actif, qui est en cours de traitement par le navigateur
  • Vlink - la couleur du lien hypertexte déjà visité par l'utilisateur
  • Rappelez-vous, j'ai déjà écrit sur comment . En conséquence, les attributs mentionnés pourraient ressembler à ceci :

    Naturellement, il s'agissait ici d'une option purement HTML, lorsque, pour une raison quelconque, il n'est pas pratique ou possible d'utiliser le style, sinon toutes ces couleurs peuvent être facilement définies et modifiées à l'aide de .

    Comment faire d'une image un lien - deux manières

    Eh bien, tout est assez simple ici. Parce que est un élément minuscule, alors dans l'ensemble, toute image peut être considérée comme une simple lettre, peut-être seulement d'une taille plus grande.

    Dans le cas du HTML pur, vous aurez un cadre de trois pixels de large autour de l'image sur laquelle vous avez fait un lien. De plus, la couleur de ce cadre correspondra parfaitement aux couleurs des liens acceptées pour votre site (nous en avons parlé un peu plus haut dans le texte).

    Pour supprimer l'ajout d'une bordure à une image sur laquelle vous avez créé un lien hypertexte, vous devez ajouter un attribut Border avec une valeur de zéro à la balise Img :

    Il s'agit d'un moyen très simple de transformer une image en lien, mais il existe une option plus complexe appelée image cliquable. Dans ce cas, grâce à l'utilisation d'un assez grand nombre de balises et d'attributs HTML, vous pouvez réaliser à partir d'une image toute une carte de liens avec des zones actives (cliquables et ayant des formes différentes - rectangle, cercle, polygone).

    Par exemple, vous pouvez placer une grande photo sur votre page et faire en sorte que lorsque vous cliquez sur différentes parties de celle-ci, différentes pages s'ouvrent avec différents hyperliens. En fait, il faudrait beaucoup de temps pour décrire une image cliquable, et il est peu probable que quiconque l’utilise, donc je ne le ferai pas, car « le jeu n’en vaut pas la chandelle ».

    Bonne chance à toi! A bientôt sur les pages du site blog

    Vous pourriez être intéressé

    Select, Option, Textarea, Label, Fieldset, Legend - Balises HTML pour le formulaire de listes déroulantes et de champs de texte
    Comment insérer un lien et une image (photo) en HTML – Balises IMG et A
    Iframe et Frame - que sont-ils et comment utiliser au mieux les frames en HTML
    Caractères d'espacement et leur formatage du code en HTML, ainsi que les caractères d'espacement insécables spéciaux et autres mnémoniques
    MailTo - qu'est-ce que c'est et comment créer un lien en HTML pour envoyer un e-mail
    Comment les couleurs sont définies dans le code HTML et CSS, sélection des nuances RVB dans les tableaux, sortie Yandex et autres programmes
    Police (visage, taille et couleur), balises Blockquote et Pre - formatage de texte existant en HTML pur (aucun CSS utilisé)
    Img - Balise HTML pour insérer une image (Src), aligner et enrouler le texte autour d'elle (align), ainsi que définir l'arrière-plan (background)
    Listes en code Html - Balises UL, OL, LI et DL
    Balises et attributs des rubriques H1-H6, ligne horizontale Hr, saut de ligne Br et paragraphe P selon la norme Html 4.01

    target="_blank est utilisé pour créer le tag a ouvert le lien dans une nouvelle fenêtre. Mais qu’est-ce que le HTML cible ? Pourquoi devrait-il être vide ? Et la chose la plus intéressante est : pourquoi y a-t-il un trait de soulignement au début ? Examinons ce code de plus près et comprenons ce qu'il fait.

    valeurs cibles de l'attribut cible

    Les quatre valeurs les plus courantes pour l'attribut cible sont :

    _soi

    La seule situation dans laquelle cela peut se produire est si le code HTML utilise une balise qui définit une méthode d'ouverture spécifique pour tous les liens. Par exemple, si vous ajoutez le code suivant entre les balises, vous utiliserez target="_self" pour que le lien s'ouvre dans la même fenêtre.

    _vide

    Ouvre un lien dans un nouvel onglet ou une nouvelle fenêtre. Ceci est déterminé par les paramètres locaux de l'utilisateur. Dans la plupart des navigateurs, il s'agit d'une nouvelle page à onglet. Vous pourriez penser qu'en utilisant cette valeur, vous pouvez mettre en œuvre des blocs d'annonces pop-up. Mais ce n'est pas vrai. Le plus souvent, JavaScript est utilisé à cette fin plutôt que HTML.

    Cette valeur d'attribut HTML cible est mieux utilisée pour ouvrir des liens vers des sites externes ou des fichiers PDF dans un nouvel onglet. Grâce à cela, après avoir fermé ces onglets, l'utilisateur est renvoyé sur votre site. Mais il ne faut pas en abuser, car il sera assez difficile pour l'utilisateur de s'y retrouver si chaque lien s'ouvre dans un nouvel onglet.

    _parent

    La valeur _parent ouvre un lien dans le cadre parent pour le cadre dans lequel vous vous trouvez. Ce n'est pas une valeur populaire car les balises de cadrage ne sont pas prises en charge en HTML5. Cependant, cette valeur peut toujours être utilisée à l'intérieur de .

    _haut

    Comme _parent , la valeur de _top s'applique aux frames. Vous pouvez l'utiliser pour créer des cadres dans des cadres avec une hiérarchie à plusieurs niveaux. _top annule tous les cadres installés et charge la page dans une fenêtre de navigateur distincte.

    nom du cadre

    Ouvre un lien dans un cadre avec le nom spécifié dans la valeur de l'attribut cible HTML href. Par exemple, s'ouvre dans un cadre nommé frame1 , c'est-à-dire ajoutez ce style :

    Externe (
    remplissage : 0 10px 2px 0 ;
    arrière-plan : url(http://lh6.googleusercontent.com/_G92voTj-yF0/TcFG68RdfLI/AAAAAAAAABfA/QJM25G6lInk/externallink.gif) centre droit sans répétition ;
    }

    J'ai publié les valeurs de mon champ de remplissage. En fonction de la police que vous utilisez et des paramètres d'affichage du texte, vous devrez ajuster ces chiffres à votre convenance. Vous pouvez également télécharger une photo sur votre album ou en utiliser une autre.

    Je tiens à préciser que j'ai testé trois scripts différents, et celui proposé ci-dessus ne fonctionne pas partout. Si le script suggéré ci-dessus ne fonctionne pas pour vous, vous pouvez essayer les options suivantes :

    http://sites.google.com/site/seobiblioteka/extlinks.js
    http://sites.google.com/site/seobiblioteka/external.js

    Mais les deux derniers scripts ne prennent pas en charge le chargement automatique des styles, donc si vous souhaitez utiliser un style pour un lien externe différent de celui interne, alors n'oubliez pas d'attribuer la classe class="external" au lien.

    Il s'agit d'utiliser target="_blank" et d'ouvrir le lien dans un nouvel onglet. J'espère avoir répondu à la question du lecteur et que ces informations seront également utiles à tout le monde.

    Chers blogueurs, si votre question concerne Blogger, je vous recommande vivement de la poser sur le forum. Les réponses ne sont pas publiées sur le blog si souvent, ni assez régulièrement, et il faut attendre plusieurs semaines pour obtenir une réponse à une question assez basique. En posant une question sur le forum, vous recevrez une réponse de ma part ou d'autres utilisateurs dans quelques heures.
    Passe un bon week-end.



    Avez-vous aimé l'article? Partagez-le