-
Apprenez toutes les spcificits de la balises HTML5 link. Les
liens sont une composanteessentielle sur les sites web ! Tout est
dans le cours vidos ci-dessous.
jQLeadBrite("#leadplayer_video_element_532425A95847B").leadplayer(false,
"eyJnYSI6dHJ1ZSwib3ZlcmxheSI6ZmFsc2UsInBvd2VyZWRfYnkiOmZhbHNlLCJwb3dlcmVkX2J5X2xpbmsiOiJodHRwOlwvXC93d3cucHJvZ3JhbW1hdGlvbi1mYWNpbGUuY29tXC8iLCJjb2xvcjEiOiIjRjVCQjBDIiwiY29sb3IyIjoiIzE3OThDRCIsImNvbG9yMyI6IiNGNUJCMEMiLCJ0eHRfc3VibWl0IjoiUkVDRVZPSVIgISIsInR4dF9wbGF5IjoiTGVjdHVyZSIsInR4dF9lbWwiOiJSZW5zZWlnbmV6IHZvdHJlIEVtYWlsLi4uIiwidHh0X25hbWUiOiJSZW5zZWlnbmV6IHZvdHJlIFByXHUwMGU5bm9tLi4uIiwidHh0X2ludmFsaWRfZW1sIjoiU1ZQLCByZW5zZWlnbmV6IHZvdHJlIEVtYWlsLi4uIiwidHh0X2ludmFsaWRfbmFtZSI6IlNWUCwgcmVuc2VpZ25leiB2b3RyZSBQclx1MDBlOW5vbS4uLiIsImxwX3NvdXJjZSI6IldQIFBsdWdpbiAxLjQuMi4xIFVubGltaXRlZCIsImlkIjoiNTMyNDI1QTk1ODQ3QiIsIndpZHRoIjo5NDAsImhlaWdodCI6NTI5LCJ0aHVtYm5haWwiOiIiLCJ0aXRsZSI6IkNvbW1lbnQgZFx1MDBlOWZpbmlyIHZvcyBsaWVucyBhdmVjIEhUTUw1IiwiZGVzY3JpcHRpb24iOiJDb21tZW50IGRcdTAwZTlmaW5pciB2b3MgbGllbnMgYXZlYyBIVE1MNSIsImF1dG9wbGF5IjpmYWxzZSwic2hvd190aW1lbGluZSI6dHJ1ZSwiZW5hYmxlX2hkIjp0cnVlLCJvcHQiOmZhbHNlLCJjdGEiOnsidGltZSI6ImVuZCIsImJ0ZXh0IjoiRGV2ZW5leiBQcm9mZXNzaW9ubmVsIEhUTUw1IFwvIENTUzMgZXQgQ3JcdTAwZTlleiBkZXMgQXBwbGljYXRpb25zIEluY3JveWFibGVzICEiLCJ1cmwiOiJodHRwOlwvXC93d3cucHJvZ3JhbW1hdGlvbi1mYWNpbGUuY29tXC9odG1sNWNzczMiLCJhdXRvX2ZvbGxvdyI6ZmFsc2UsIm5ld193aW5kb3ciOmZhbHNlfSwieW0iOiJJREZoSVgxMmluZyJ9");
Afficher le texte de la vidoComment dfinir vos liens avec HTML5
Bonjour tous et bienvenu sur DveloppementFacile. Encore un cours
consacr HTML 5 ne vous inquitez pas il y aura d'autres
coursconsacrs CS3, ils arrivent juste aprs, dans les prochaines
semaines. Donc l, vous allezapprendre utiliser les liens avec HTML
5.Lajout dun lien Donc les nouvelles possibilits entout cas, crer
des liens avec HTML 5. Pour dfinir un liens il suffit dutiliser la
balise a etaprs vous avez des attributs mettre dans cette balise,
vous avez lattribut href qui dfinitl'URL donc cible du liens donc
la page du site Internet que vous cible, ou le fichier que
vousciblez avec le lien, hreflang trs rarement utilis, mais vous
pouvez l'utiliser, il dfinit la languedu document cible, si celle-l
est diffrente du document de dpart c'est dire si vous avez
dfinitvotre document HTML 5 en franais, pas besoin d'utiliser la
balise hreflang si vous renvoyeztoujours sur des sites franais, par
comme si vous renvoyez du site sur un site avec un contenuen
anglais, vous utilisez cet attribut-l, hreflang pour spcifier En,
pour dire que cest lURL dedestination est en anglais. ping a
contient lURL spare par un espace qui reoive unenotification
lorsque l'utilisateur clique sur le lien, donc ping il savre que
les blogs de typeWordPress les utilises dans leurs liens, cest les
ping que vous voyez lorsque lorsque desinternautes font rfrence
votre article. Donc vous haver un exemple de cration de liens
hrefpage.htm, donc l on renvoi sur une page du site Internet, ping
par contre on informe un autresite Internet que l'utilisateur a
cliqu sur le lien Dev Facile, donc le navigateur justement
envoi
1 / 4
-
une requte POST lURL spcifie dans lattribut et cest trs utile,
comme je vous l'ai dit,pour les donnes analytiques dun site
internet, comme a vous savez quels sont les sitesInternet qui
pointent vers votre article, vers votre page HTML. Vous avez
galement lattributrel qui dfinit la relation entre le document de
dpart et le fichier ou le document, cibl par lesliens donc vous
avez diffrentes valeurs comme alternate, archives, author,
bookmark, contact,etc., je vous en ai list quelques-uns il y en a
dautres, et target vous allez lutiliser trssouvent, a dfini la faon
d'ouvrir la cible du liens, soit vous ouvrez lorsque l'utilisateur
il cliquesur le liens, soit a ouvre le liens dans une nouvelle
fentre, dans un nouvel onglet dunavigateur, ou soit a ouvre le lien
dans la mme fentre du navigateur, donc dans la mmefentre vous
utilisez target sell, vous mettez la valeur sell dans lattribut
target, dans unenouvelle fentre du navigateur, ou un nouvel onglet
vous mettez target blanck, la valeur_blanck, et type a va indiquer
au navigateur le type mime de la cible. Par exemple si ce nestpas
un document HTML 5, vous allez utiliser cet attribut type pour
dire, afficher son, afficherimage, afficher PDF, ou un autre type
de fichier, donc trs pratique galement.Lien vers unepage Pour faire
un lien vers une page situe dans le mme dossier dans href vous
mettezaccueil, vous avez votre arborescence avec un dossier avec
toutes les pages HTML, ou PHP ilsuffit de lappeler directement
accueil.htm, fermer la balise a, vous mettez accueil donc
l'intitulde votre liens que linternaute va voir et vous fermez la
balise a. Si vous faites un lien vers unepage situe dans un autre
dossier, donc vous avez votre dossier avec accueil, contact.htm,
etvous avez un autre dossier, dans lexemple cest un dossier
fichier, dans ce dossier fichiervous avez d'autres documents HTML,
voici un exemple fichier le dossier lintrieur du dossieret
HTML.htm.html comme vous voulez pour l'extension, avec lintitule
tlcharger, et pourremonter dans l'arborescence vous utilisez../,
vous avez votre rpertoire ici, accueil.htm, lerpertoire fichier
avec liste.htm et vous voulez remonter contact, sortir de ce
rpertoire, vousfaites ../ vous tes en dehors du rpertoire, dans le
rpertoire au-dessus et vous rcuprezcontact.html et donc vous
lintitul du liens cest nous contacter.Les liens dans une page
Vouspouvez mettre des liens dans une page, dclarer une ancre, vous
lavez srement vu dans dessites Internet, vous avez une icne avec
une flche qui remonte vers le haut et le lien cestremonter en haut,
a sa sappelle une ancre, donc vous pouvez dfinir des ancres dans
vosliens pour accder rapidement , par exemple tout en haut de votre
document HTML, ou aumilieu, un certain endroit de votre document
HTML. Voici un exemple dancre, par exempledans la balise body vous
avez, on a mis id = o, on dfini un identifiant o, vous
mettezplusieurs paragraphes, a fait une page trs longue que
l'utilisateur fait dfiler, et la fin vousmettez un lien href, vous
dfinissez une ancre donc gale #o, l'intitul remont en haut,
quandlutilisateur, linternaute va cliquer sur remonter en haut, a
remonte la page HTML jusqu' lido de la balise body donc
l'utilisateur va voir l'affichage du premier paragraphe avec
beaucoupde texte. Donc trs pratique les ancres en HTML. Les liens
dans une page vous pouvez dfinirun lien dans un lien vers une ancre
situe dans une autre page donc, soit vous ciblez une autrepage de
votre site Internet avec une ancre, soit vous pouvez cibler un
autre domaine, donc unepage dun autre domaine, dun autre site
internet toujours avec une ancre, cest trs simplevous mettez l'URL
de votre page, donc soit sur un autre domaine, soit sur le mme
domaine,donc page1.htm#ancre et automatiquement quand la page HTML
va safficher sur lenavigateur de votre internaute a va la faire
drouler jusqu' lancre que vous avez renseigne,il faut savoir que
les ancres cest trs utilise pour amener l'utilisateur directement
l'endroit oon le souhaite, ou il a demand lui, cest utilis dans les
forums, dans les blogs.Les liens versun autre site L je vous ai mis
un exemple de liens href qui pointe vers un autre site
Internet,
2 / 4
-
donc soit vous pouvez pointer sur l'adresse direct du site
internet, donc dev facile.com ouGoogle.fr, ou alors sur une page
spcifique, vous mettez le nom domaine devfacile.com/Contact.htm,
donc cest lutilisation des liens et vraiment simple.Les liens vers
uneadresse mail Vous pouvez mettre des liens qui pointent vers une
adresse mail galement,quest-ce a fait ? Dans href vous mettez le
lien mail to : l'adresse mail de l'utilisateur, et doncqu'est-ce
que a va faire ? Quand lutilisateur va cliquer sur ce lien, a va
ouvrir son client mail,a peut ouvrir Outlook Express, Thunderbird,
ou un autre logiciel, en tout cas a va ouvrir lelogiciel de mail
que l'utilisateur utilise sur son ordinateur. Donc vous pouvez
rajouter un objetautomatique aux mails, vous faites dans href mail
to l'adresse mail du destinataire ? subject =formation HTML 5,
quand lutilisateur va cliquer sur nous contacter a ouvrir
Thunderbird avecle mail, le destinataire dj rempli, renseign, et le
sujet du mail dj renseign, vous pouvezgalement dfinir une copie du
message, donc aprs l'adresse mail vous faites ! CC (copiecache) et
l'adresse mail en destination de la copie cache, et vous pouvez
combiner lespossibilits mail to, l'adresse mail du destinataire, ?
le sujet du mail, donc subject = sujet dumail, & CC avec
ladresse mail de la copie cache. Donc vous voyez vous avez une
multitudede possibilits avec les liens.Les liens vers un fichier
Vous pouvez bien videmment faire desliens vers un fichier donc il
suffit de renseigner si le fichier est dans le mme
rpertoireformation.pdf, donc les liens vers un fichier a fonctionne
exactement comme l'affichage d'unepage HTML, d'une page PHP, par
exemple, soit vous mettez le nom du fichier directement si ilest
dans le mme rpertoire, vous pouvez remonter le rpertoire, allez
dans un autre rpertoirepour rechercher le fichier, ou vous pouvez
pointer sur un fichier dans un autre domaine, vousmettez http le
nom de domaine, donc dev facile.com/formation.pdf quand
lutilisateur va cliquersur l'intitul tlcharger le PDF, donc a va
directement chercher le fichier PDF sur le siteInternet que vous
avez donn.Les diffrents types de liens Vous avez diffrents types
deliens, comme je vous l'ai dit, les pages cibles elles peuvent
s'ouvrir soit dans la mme page,soit dans une autre page, soit vous
avez target top, cest la page cible du lien est affiche dansla mme
fentre et occupe toute la fentre daffichage, blank le lien cibl
souvre dans unenouvelle fentre du navigateur ou un nouvel onglet,
le lien cibl souvre dans la mme fentre.Je vais trs vite parce que
cest trs simple assimil, tout en sachant que vous avez un
codesource sous cette vido, a ne posera pas de problme. Donc l je
vous ai mis un exemple decode source, a va ouvrir le lien
page2.htm, dans une nouvelle page ou un nouvel ongletsuivant le
navigateur que vous utilisez.Votre plan dactions ! Vous pouvez dj
utiliser toutesles possibilits des liens dans votre page web, je
vous ai mis le panel de fonctionnalits desliens avec les diffrents
attributs, plusieurs exemples de code source, comment les utiliser,
sousce cours vido vous pourrez tlcharger un exemple de code source,
si vous avez encore desquestions posez-les directement sous cette
vido. Je vous dis trs bientt sur DveloppementFacile.
Tlchargez le code source HTML5Voici un exemple de code source
HTML5 avec les liens.
3 / 4
-
Downloads
La balise link avec HTML5
Exemple d'utilisation des possibilits de la balise link avec
HTML5.
Quelles fonctionnalits link utilisez-vous le plus souvent
?Partagez, dans les commentaires, votre code avec les
fonctionnalits link que vous utilisezrgulirement.Comment dfinir vos
liens avec HTML5
Powered by TCPDF (www.tcpdf.org)
4 / 4
