Bonjour, aujourd'hui, nous allons parler de liens hypertexte, ou de liens,
comme ils sont plus communément appelés.
Et comment vous pouvez les utiliser pour lier votre document à d'autres personnes.
Maintenant, les liens sont vraiment ce qui fait du web un web.
C' est toute cette idée que différents liens construits ensemble créent ce genre de
connaissances que les moteurs de recherche ou vous
pouvez gagner vous-même en allant d'une page à l'autre, et avec du matériel connexe, espérons-le.
Donc, nous allons directement dans la façon dont vous créez un lien sur votre page.
Les liens sont appelés liens d'ancrage et c'est là que nous obtenons le a pour dans la balise a.
Lorsque vous utilisez une balise d'ancrage,
la balise a dont vous aurez besoin pour vous assurer que vous avez deux parties différentes.
Vous avez besoin d'une hyperréférence et vous avez besoin de contenu.
Donc, l'hyper référence est juste la référence à l'emplacement
du nouveau contenu.
Donc, dans ce cas, j'ai utilisé http://www.umich.edu.
Cela indique à un navigateur,
si quelqu'un clique sur ce lien, c'est de l'endroit où je veux demander la nouvelle page.
Nous avons également besoin d'avoir du contenu.
Le contenu est ce que nous appelons la partie cliquable.
Dans ce cas, c'est du texte.
Je voudrais en fait cliquer sur un texte souligné qui dit, Université du Michigan.
Mais dans certains cas, il peut s'agir d'une image à la place.
Quels types de liens pouvons-nous avoir ?
Certains des plus communs sont appelés liens absolus.
Nous avons également des liens relatifs.
Liens internes et
liens graphiques et je vais vous montrer des exemples de chacun d'entre eux.
Avec une référence absolue dans la section a href, nous devons mettre une url entièrement formée.
Vous devez avoir le http ou https l'adresse et
tout type de nom de document supplémentaire que vous voulez.
Donc, si vous vous souvenez qu'il y a trois parties à l'URL,
vous avez le protocole, l'hôte et le document.
Vous devez inclure tous ceux si vous avez une référence absolue, n'est-ce pas ?
Tout le reste est encore à peu près le même.
Pour une référence relative, nous modifions légèrement ce qui va dans le href.
Au lieu de lier à une
page Web externe ou même interne, nous allons seulement mettre, dans ce cas, le nom du fichier.
Donc, dans ce cas, nous allons lier à page2.html.
Vous pouvez obtenir un peu plus en profondeur que cela,
où vous pouvez également inclure une sorte de nom de dossier.
Donc, dans ce cas, nous allons au fichier appelé page2.html mais
c'est dans un dossier différent appelé docs la troisième
façon dont nous pouvons utiliser une référence relative est ce que nous appelons utiliser la balise ID.
Donc, quand vous avez href est égal à la livre de hachage ou de l'histoire, nous
disons qu'il y a un autre emplacement dans le même fichier et qu'il s'appelle l'historique.
Donc, des liens absolus par rapport aux liens relatifs.
Quand utiliseriez-vous des liens absolus ou quand utiliseriez-vous des liens relatifs ?
Avec des liens absolus, vous dites essentiellement, je ne suis pas en charge de cette page,
quelqu'un d'autre l'est.
Donc, si vous liez à la page de quelqu'un d'autre,
utilisez absolument le lien absolu avec la référence complète dedans.
Pour relatif est lorsque vous développez votre propre site.
Et il est vraiment utile d'utiliser des liens relatifs au lieu d'absolu, de
sorte que si vous déplacez votre page vers un autre serveur,
ou si vous la déplacez dans un dossier différent, vous n'avez pas besoin de tout renommer.
Et donc ce sont quelques-uns des avantages à l'utilisation de liens locaux,
est juste l'idée que vous n'avez pas besoin de mettre à jour autant.
Maintenant, l'une des choses que vous devez vous assurer que vous ne le faites jamais
est d'avoir un lien qui inclut une sorte de structure de fichier, nous l'appellerons.
Alors vérifiez vos liens.
Assurez-vous qu'il ne dit jamais, C:Page ou MyDocumentsPage ou
tout ce qui est très spécifique à votre ordinateur.
La raison pour laquelle tu ne veux pas faire ça, c'est.
Si vous mettez votre page sur le web.
Si vous avez terminé, vous l'avez installé sur un serveur ou un hébergement et
vous voulez que d'autres personnes cliquent.
Eh bien, cela n'a pas de sens qu'ils puissent accéder aux pages qui sont sur
votre ordinateur.
Donc jamais avoir une référence qui inclut quelque chose de local à votre machine.
D' accord ? Une des autres choses que vous pouvez faire est que
vous pouvez utiliser des images comme lien.
Donc, le composant cliquable n'a pas besoin d'être du texte.
Vous avez beaucoup vu ça.
Il peut s'agir d'icônes, d'images.
des choses différentes en ce sens.
Dans ce cas, je suis entré et j'utilise la référence H régulière et
ce que nous changeons maintenant, n'est pas la référence h, mais le
contenu qui va entre la balise d'ouverture et de fermeture.
et je suis allé de l'avant et j'ai mis dans une image à la place.
Assurez-vous d'utiliser le texte alt pour accompagner cette image.
Et un autre cas, j'ai fait quelque chose de très similaire,
la seule différence est, au lieu d'utiliser une référence locale juste ici pour
l'image, j'ai utilisé une référence absolue.
J' ai mis l'URL entière.
Parlons donc des problèmes de convivialité et d'accessibilité.
Si vous voulez utiliser un composant cliquable,
vous voulez vous assurer qu'il a un nom informatif.
Il y a un logiciel qui peut répertorier tous les liens d'une page pour
les personnes qui recherchent des choses, qui ne peuvent pas utiliser typique.
moyens typiques d'accéder à la page.
Il ne leur est pas du tout utile si tous les liens sont étiquetés, cliquez ici,
cliquez ici, cliquez ici, n'est-ce pas ?
Vous voulez lui donner une sorte de nom informatif.
Vous voulez également vous assurer que si vous utilisez une image pour
la partie cliquable de votre lien.
Cette image doit avoir une sorte de texte alt ou
d'autres informations disponibles pour ceux qui ne peuvent pas voir l'image.
Donc, laissez-moi vous montrer un exemple codé de ces types de liens.
D' accord ?
Comme vous pouvez le voir ici, j'ai une référence à des références absolues, des
références relatives, des images en tant que liens, puis quelques liens intégrés, aussi bien.
Donc, si je devais cliquer sur Washtenaw Dairy ou Rosie's Coffee Bar and Bakery, ou
Dexter's Bakery, etc., cela me conduirait à leurs pages.
En arrière.
Une des astuces que je veux souligner pendant que je fais ceci est,
comme je passe la souris sur chacun de ces liens, si vous regardez tout, tout en
bas de mon navigateur, et je ne peux pas vraiment montrer en même temps, mais
comme vous le mettez en surbrillance, il vous montre quelle URL vous allez.
Et je pense que c'est très utile
pour les gens de savoir, parce que si jamais vous survolez un lien, et que
l'information que vous voyez en bas de la page ne correspond pas à ce que vous avez dit.
Ainsi, les références absolues vous éloignent de votre site.
Les références relatives peuvent vous amener à quelque chose qui se trouve dans votre dossier.
Donc ici, j'ai une image de beignets, et j'ai continué et
ils sont dans mon dossier dans mon dossier.
J' ai donc pu les lier en utilisant simplement le nom de l'image.
D' accord ?
Nous pouvons également utiliser des images comme liens.
Au lieu d'écrire des beignets de la boutique Squire, je suis allé de l'avant et je l'ai
fait pour que vous puissiez cliquer sur l'image pour obtenir la vue agrandie.
Cette dernière idée de liens intégrés est un peu intéressante.
Laisse-moi t'amener au code une seconde et te montrer.
Écrivez ici,
j'ai quelque chose appelé références relatives avec un ID égal à relatif.
J' ai des liens intégrés avec un ID qui dit intégré et
ici, au tout début, vous pouvez voir que j'ai div id = « absolu ».
Avec des liens intégrés, je peux cliquer sur l'un de ces liens et naviguer dans la même page.
Donc je ne vais pas aller sur une autre page.
Je ne vais pas ouvrir un nouvel onglet.
Au lieu de cela, je vais sauter à différents endroits dans la page.
Donc je suis allé à l'absolu.
Je suis allé à relatif maintenant si j'essaie de faire des références intégrées,
il ne semble pas qu'il ait été déplacé, mais il l'a vraiment fait.
C' est juste qu'on y est déjà.
D' accord, donc c'est comme ça que fonctionnent ces types de liens intégrés ou internes, non ?
Maintenant, si à tout moment vous êtes confus sur le fonctionnement du code.
Je veux juste te rappeler qu'ils peuvent toujours aller voir.
Développeur et source de vue pour vraiment avoir une meilleure idée
de la façon dont les gens créent leurs pages et leurs liens.
Ensuite, parlons de cibles, d'accord ?
Les ancres peuvent également prendre un attribut cible différent.
Nous avons la source, ajoutons de l'ancre.
Donc nous sommes ciblés.
Donc, vous pourriez avoir la cible égale moi.
Il s'agit du type d'action par défaut.
Ça va arriver si tu ne mets rien du tout.
Si vous n'incluez même pas la cible, et que cela signifie lorsque vous cliquez sur un lien,
ouvrez dans le même onglet ou la même fenêtre que vous regardez en ce moment.
Si vous mettez la cible égale à vide.
Vous allez quitter la page en cours dans laquelle vous êtes exactement la même, et
ouvrir un nouvel onglet ou une nouvelle fenêtre où vous voulez ouvrir la nouvelle page.
Maintenant, cela a son avantage et son inconvénient.
L' avantage est que votre site est toujours ouvert dans la fenêtre de quelqu'un.
L' inconvénient est que beaucoup de gens ne l'aiment pas quand il continue d'ajouter et d'
ajouter, et à
mesure qu'ils progressent à travers votre page, vous les faites ouvrir de plus en plus d'onglets.
Il y a deux autres options dont nous ne parlerons pas vraiment ici, mais
vous pouvez les voir dans la lecture, et ce sont top et parent, et
cela traite si vous avez vraiment l'idée d'avoir plusieurs fenêtres
, cadres, etc. ouverts.
Alors, allons de l'avant et passons en revue, parce que s'assurer que vous comprenez les liens est d'une
importance vitale pour votre succès dans ce cours ou même pour simplement comprendre HTML.
Donc, la première chose que vous devez savoir est une page sans liens est extrêmement rare.
Et pour être honnête, ce n'est presque même pas une page web.
C' est juste un document.
Les liens peuvent être absolus, relatifs et internes.
Et interne, encore une fois, était le genre où il avait la marque de hachage dedans.
Je pense que je les ai appelés parents, mais
je veux m'assurer que je suis clair que la marque de hachage le rend interne.
Vous souhaitez faire preuve de prudence lorsque vous utilisez des images dans des liens.
Ce n'est pas qu'ils ne soient pas une bonne chose à faire, et je ne dis pas que tu devrais le faire.
Je dis juste assurez-vous de le faire avec soin pour que tous ceux qui
visionnent votre page puissent obtenir le même contenu et la même expérience que tout le monde.