Kako ustvariti povezavo v dokumentu HTML. Oznaka A - njena skladnja in atributi

  1. URL ali "naslov" strani na internetu
  2. <A> oznaka in njena osnovna sintaksa
  3. Absolutna in relativna referenca
  4. Relativna povezava do imenika je višja od trenutne
  5. Atributi oznake <A>. Kako odpreti dokument z referenco v novem oknu
  6. Povezava naslova. Atribut naslova za oznako <A>
  7. Dodeli hiperpovezavo nofollow. Prepoved prenosa "zaupanja" mesta z referenco
  8. Notranja povezava ali sidro v dokumentu
  9. Link Anchor - Slika
  10. Nadaljevanje

Reference (ali hiperpovezave) prežemajo internet kot krvne žile. Če ni bilo nobenih povezav, ne bi bilo interneta.

Kako ustvariti povezavo v dokumentu HTML in pravilno registrirati njene atribute, kaj je URL in kako se iskalniki nanašajo na povezave - v tej naslednji lekciji za začetnike, da se naučijo HTML.

URL ali "naslov" strani na internetu

Vsak HTML dokument na spletu ima svoj »točen naslov«. Imenuje se "URL" iz angleščine. URL - Uniform Resource Locator

Struktura URL-ja je pogosto vidna v naslovni vrstici brskalnika. Vključuje:

  1. Ime protokola je http: // ali https: //
  2. Domena spletnega mesta
  3. mapo ali pot do mape, v kateri je ta dokument,
  4. Ime datoteke (morda ni vedno).

Zahvaljujoč temu »natančnemu naslovu« se je mogoče sklicevati na ta dokument iz besedila drugega dokumenta.

<A> oznaka in njena osnovna sintaksa

Upam, da vas beseda »sintaksa« ne bo več prestrašila

<a href="http://domen-saita.ru/papka-na-servere/dokument.html"> besedilo povezave </a>

Kot lahko vidite, mora biti po začetku oznake <A> obvezen atribut href, ki podaja naslov dokumenta, v katerega želite iti.

V sami oznaki <A> je vsebina besedilo (čeprav lahko obstaja slika), ki je besedilo povezave. Imenuje se tudi " Sidro " ali preprosto - Sidro.

Absolutna in relativna referenca

V zgornjih primerih smo uporabili absolutne reference. Tisti, ki vsebujejo celoten URL dokumenta.

V nekaterih primerih atribut href ne vsebuje celotnega naslova URL z imenom protokola in domene mesta. Če je dokument, na katerega vodi povezava, na istem mestu - lahko uporabite relativno povezavo, ki vodi od mesta, kjer se nahaja dokument.

Shema, ko se uporabi relativna referenca

Primer: povezava iz prvega dokumenta vodi do datoteke second.html, ki se nahaja v mapi z novicami.

Relativna povezava do imenika je višja od trenutne

Koda:

<a href="../first.html"> To je relativna povezava do datoteke v ravni imenika </a>

Ta povezava vodi do datoteke first.html v imeniku »nadrejeni«, tj. en nivo višje .

Kombinacija ../ označuje mapo eno raven višje od danega položaja datoteke, iz katere se povezava izvaja.

Atributi oznake <A>. Kako odpreti dokument z referenco v novem oknu

Če želite, da se dokument odpre v novem zavihku brskalnika, morate uporabiti atribut target = "_ blank"

Če želite, da se dokument odpre v novem zavihku brskalnika, morate uporabiti atribut target = _ blank

Povezava z atributom target = "_ blank"

Ne zlorabljajte ga. S tem atributom ni treba izdelati notranjih povezav do spletnega mesta. Uporabniki bodo motili »iskreno okno«.

Na splošno s tem atributom cilja - celotno zgodbo. Še vedno obstajajo številni njeni pomeni, vendar se vsi danes le redko uporabljajo.

Razlog za to je, da so oblikovani tako, da delujejo s spletnim mestom na okvirjih, ki niso več priljubljeni, in s prihodom HTML5 postajajo stvar preteklosti.

Povezava naslova. Atribut naslova za oznako <A>

Še en uporaben atribut je title = "Besedilo, ki pojasnjuje, kje vodi ta povezava"

Sintaksa:

<a href="http://domen-saita.ru/papka-na-servere/dokument.html" title=" the pop-up hint"> to je namigna povezava </a>

Kot lahko vidite, ga brskalnik prikaže kot orodje. In vendar, upošteva iskalnike.

Namig atributa za naslov povezave

Dodeli hiperpovezavo nofollow. Prepoved prenosa "zaupanja" mesta z referenco

Obstaja še en dvoumen atribut za povezave rel = "nofollow"

Iskalcem pove, da povezovalni dokument morda ni vreden zaupanja. Istočasno se kazalniki zaupanja (»zaupanje«) iz mesta vira ne prenesejo na spletno mesto z referenco.

Tema »zaupanja« in uvrstitve povezav je še pred nami, če pa je kratek, bo »usoda« spletnih mest v iskalnikih odvisna tudi od števila povezav, ki vodijo do te strani. Več od njih, bolj verodostojna mesta povezava - več verodostojnost mesta s sklicevanjem.

V nekaterih primerih je vredno pregledati povezave s tem atributom. Na primer, če napišete negativno oceno o kateri koli storitvi.

<a href="http://bad-sait.ru/dokument.html" rel="nofollow"> slabo spletno mesto </a>

Notranja povezava ali sidro v dokumentu

V velikih besedilih je pogosto potrebna namestitev tako imenovanih „sidri“ v logičnih delih dokumenta. Potem se lahko na tem mestu sklicujete.

Najlažji način je, da ustvarite lokalno tabelo vsebine iz hiperpovezav, ki vodijo do teh sidrišč. Takšne vsebine so običajno postavljene na samem začetku članka.

Pri izdelavi takšnega sidra se namesto atributa href uporablja atribut name.

Skladnja za ustvarjanje sidra je:

<a name="top"> </a>

Ko ustvarjate povezavo, na koncu URL-ja dodajte preko znaka # - ime "sidro":

<p> <a href="#top"> Na vrh </a> </ p>

Prehod bo točno do tega kraja, tj. Brskalnik bo to mesto postavil v zgornji vidni del.

Pogosto so v dolgih dokumentih na dnu postavili takšno povezavo »Top«.

... ko so potovali po svetu dišečih zrn, so našli najvišjo kakovost tistih, za katere so znane Afrika, Azija, Srednja in Južna Amerika. Zato je danes v kavarnah blagovne znamke Kavna zrna Najboljše sorte kave boste našli pri priznanih proizvajalcih.

? Na vrh ?

V drugem dokumentu lahko obiščete tudi ta kraj, če na koncu URL-ja dodate znak # name_accord

<a href="http://domen-saita.ru/dokument.html#top"> besedilo povezave vodi do sidra "top" v tem dokumentu </a>

Link Anchor - Slika

Vsaka slika je lahko povezava.

Koda:

<a href="http://sait.ru/dokument.html"> <img src = kartinka.jpg "width =" 100 "height =" 131 "/> </a>

Povezave so privzeto podčrtane v brskalniku s trdno modro črto, slike povezave pa dobijo modri okvir.

Povezave-slike dobijo modri okvir

Če se želite znebiti, se v datoteko CSS za spletno mesto doda preprosto pravilo:

a {border: 0px;}

To je navodilo, da je meja debeline nič za vse povezave slik.

Nadaljevanje

V naslednjem postu bom govoril o e-poštnih povezavah, njihovih atributih in metodah "zaščite" pred zlobnimi pošiljatelji neželene pošte