Ako vytvoriť odkaz v dokumente HTML. Tag A - jeho syntax a atribúty
- URL alebo "adresa" stránky na internete
- <A> tag a jeho základná syntax
- Absolútna a relatívna referencia
- Relatívny odkaz na adresár vyšší ako aktuálny
- Atribúty značky <A>. Ako otvoriť dokument podľa odkazu v novom okne
- Nadpis odkazu. Atribút title pre značku <A>
- Hypertextový odkaz atribútu nofollow. Zákaz prenosu "dôvery" stránky odkazom
- Vnútorný odkaz alebo kotva vo vnútri dokumentu
- Link Anchor - Obrázok
- predĺženie
Odkazy (alebo hypertextové odkazy) prenikajú cez internet ako krvné cievy. Ak by neexistovali žiadne odkazy, neexistoval by žiadny internet.
Ako vytvoriť odkaz v dokumente HTML a správne zaregistrovať jeho atribúty, čo je adresa URL a ako sa vyhľadávacie nástroje týkajú prepojení - v tejto ďalšej lekcii pre začiatočníkov, ktorí sa chcú naučiť HTML.
URL alebo "adresa" stránky na internete
Každý HTML dokument na webe má svoju vlastnú „presnú adresu“. Nazýva sa „URL“, z angličtiny. URL - Uniform Resource Locator
Štruktúra adresy URL je často viditeľná v paneli s adresou prehliadača. Zahŕňa:
- Názov protokolu je http: // alebo https: //
- Doména domény
- priečinok alebo cestu k priečinku, kde sa tento dokument nachádza,
- Názov súboru (nemusí byť vždy).
Vďaka tejto „presnej adrese“ bolo možné odkazovať na tento dokument z textu iného dokumentu.
<A> tag a jeho základná syntax
Dúfam, že slovo „syntax“ vás už nebude desiť 🙂
<a href="http://domen-saita.ru/papka-na-servere/dokument.html"> text odkazu </a>
Ako vidíte, po štarte značky <A> musí existovať atribút povinný href, ktorý určuje adresu dokumentu, ku ktorému chcete ísť.
Vo vnútri tagu <A> je samotný text (hoci môže existovať obrázok), čo je text odkazu. Nazýva sa tiež " Kotva " alebo jednoducho - Kotva.
Absolútna a relatívna referencia
V príkladoch uvedených vyššie boli použité absolútne odkazy. Tie, ktoré obsahujú úplnú adresu URL dokumentu.
V niektorých prípadoch atribút href neobsahuje úplnú adresu URL s názvom protokolu a doménou lokality. Ak je dokument, na ktorý odkaz vedie, na tej istej lokalite - môžete použiť relatívny odkaz vedený z miesta, kde sa dokument nachádza.
Schéma, keď sa použije relatívna referencia
Príklad: odkaz z dokumentu first.html vedie k súboru second.html, ktorý sa nachádza v priečinku správ.
Relatívny odkaz na adresár vyšší ako aktuálny
kód:
<a href="../first.html"> Toto je relatívny odkaz na súbor v úrovni adresára </a>
Tento odkaz vedie k súboru first.html v "materskom" adresári, tzn. o jednu úroveň vyššie .
Kombinácia ../ označuje priečinok o jednu úroveň vyššie od danej pozície súboru, z ktorého sa prepojenie vytvára.
Atribúty značky <A>. Ako otvoriť dokument podľa odkazu v novom okne
Ak chcete, aby sa dokument otvoril na novej karte prehliadača, musíte použiť atribút target = "_ blank"
Odkaz na atribút target = "_ blank"
Nezneužívajte ho. Nie je potrebné vytvárať interné odkazy na stránku s týmto atribútom. Užívatelia budú naštvaní „iskrivým oknom“.
Všeobecne platí, že s týmto cieľom atribút - celý príbeh. Stále existuje niekoľko jeho významov, ale všetky sa dnes používajú len zriedka.
Je to preto, že sú navrhnuté tak, aby pracovali s webom na rámoch , ktoré už nie sú populárne a s príchodom HTML5 sa stávajú minulosťou.
Nadpis odkazu. Atribút title pre značku <A>
Ďalší užitočný atribút je title = "Text vysvetľujúci, kde tento odkaz vedie"
syntax:
<a href="http://domen-saita.ru/papka-na-servere/dokument.html" title="the pop-up tip"> toto je odkaz na odkaz </a>
Ako vidíte, prehliadač ho zobrazí ako tip nástroja. A napriek tomu berie do úvahy vyhľadávače.
Pomôcka atribútu pre názov odkazu
Hypertextový odkaz atribútu nofollow. Zákaz prenosu "dôvery" stránky odkazom
Pre odkazy rel = "nofollow" existuje ešte jeden nejednoznačný atribút
Povie vyhľadávačom, že odkazový dokument nemusí byť dôveryhodný. Zároveň sa na webovú lokalitu nesprístupňujú indikátory dôvery („trust“) zo stránky Source.
Téma "dôvera" a odkaz rebríčku je stále dopredu, ale ak je to krátke, "osud" stránok vo vyhľadávačoch bude tiež závisieť na počte odkazov vedúcich na túto stránku. Čím viac z nich, viac autoritatívne stránky odkaz - väčšiu dôveryhodnosť stránky odkazom.
V niektorých prípadoch stojí za to „skríning“ prepojení s týmto atribútom. Napríklad, ak napíšete negatívny prehľad o akejkoľvek službe.
<a href="http://bad-sait.ru/dokument.html" rel="nofollow"> zlá stránka </a>
Vnútorný odkaz alebo kotva vo vnútri dokumentu
Vo veľkých textoch sa často vyžaduje inštalácia tzv. „Kotiev“ v logických častiach dokumentu. Potom je to na tomto mieste, môžete odkazovať.
Najjednoduchším spôsobom je vytvoriť lokálny obsah z hypertextových odkazov vedúcich k týmto kotvám. Takéto obsahy sú zvyčajne umiestnené na začiatku článku.
Pri vytváraní takejto kotvy sa namiesto atribútu href používa atribút name.
Syntax pre vytvorenie kotvy je:
<a name="top"> </a>
Pri vytváraní odkazu na konci adresy URL pridajte znak # - názov "kotvy":
<p> <a href="#top"> Top </a> </ p>
Prechod bude presne na toto miesto, t. Prehliadač umiestni toto miesto do hornej viditeľnej časti.
Často, v dlhých dokumentoch, na samom spodnom konci kladú takýto odkaz „Top“.
... ktorí cestovali po svete voňavých zŕn, našli najvyššiu kvalitu tých, pre ktoré sú Afrika, Ázia, Stredná a Južná Amerika známe. Preto dnes v kaviarňach značky Zrnková káva Nájdete tu najlepšie odrody kávy od uznávaných výrobcov.
? Na vrchol ?
Z iného dokumentu môžete tiež prejsť na toto miesto, ak na koniec adresy URL pridáte znak # name_accord
<a href="http://domen-saita.ru/dokument.html#top"> text odkazu v tomto dokumente vedie k zakotveniu v hornej časti dokumentu </a>
Link Anchor - Obrázok
Akýkoľvek obrázok môže byť odkaz.
kód:
<a href="http://sait.ru/dokument.html"> <img src = kartinka.jpg "width =" 100 "height =" 131 "/> </a>
V predvolenom nastavení sú prepojenia podčiarknuté prehliadačom s plnou modrou čiarou a prepojovacie obrázky získajú modrý rám.
Odkazy-obrázky si modrý rám
Ak sa ho chcete zbaviť, do súboru CSS pre lokalitu sa pridá jednoduché pravidlo:
a {hranica: 0px;}
Toto je inštrukcia na vytvorenie nuly pre všetky prepojenia obrázkov.
predĺženie
V nasledujúcom príspevku budem hovoriť o e-mailových odkazoch, ich atribútoch a metódach „ochrany“ pred zlými spamermi