Kako ubaciti hipervezu u HTML? Izrada i upotreba hiperveze u HTML-u

računala

Hypertext je tekst koji sadrživeze na drugi tekst. Primjer su bilješke autora o složenim definicijama ili fusnotama prevoditelja na dnu stranice knjige, ako sadrži tekst na stranom jeziku. Internetske stranice su složeni sustav hipertekstualnih prijelaza s jedne stranice na drugu, unutar same stranice, kao i između neovisnih jedinstvenih tema resursa. Takva je struktura praktična, štedi puno vremena, omogućava posjetitelju da brzo pronađe potrebne informacije i da se ne izgubi u velikom broju prijelaza.

Umetanje hiperveze

U HTML-u se koristi umetnuti hipervezudeskriptor (tag) <a>, koji je umetnut na pravo mjesto. Obično se stavlja u tekst, jer je hiperveza sama po sebi tekstna struktura. Ali veze su i dalje grafičke (ikone, gumbi, slike); o njima će se reći dalje. Njihovo mjesto na web stranici nije ograničeno na tekst, već ovisi o odlukama dizajera autora stranice.

<a href={https://google.com/"> Google početnu stranicu </a>

Ovo je primjer kako ubaciti hipervezuHTML dokument koji se provodi pomoću <a> oznake. Posjetitelj stranice vidjet će podcrtani tekst, različit od boje okolnog teksta (boja HTML veze može biti bilo koja), "Google početna stranica", klikom na koju će se ići na glavnu stranicu sustava za pretraživanje "Google". Valja napomenuti da tekst hiperveze treba sadržavati informacije o tome gdje će se tranzicija odvijati. Ovo načelo treba slijediti i prihvatiti u pravilu!

Struktura oznake <a> ... </a>

Možete primijetiti da je <a> oznaka uparena: trebate oznaku za zatvaranje </a>.

href - atribut označava svrhu veze.

https://google.com/ - vrijednost atributa, koja uključuje URL resursa na koji će se izvršiti prijelaz. Sastoji se od dvostrukih ili jednokratnih citata. To ovisi o strukturi gniježđenja oznaka prema HTML pravilima.

<a href={https://google.com/_1> google početnu stranicu </a>

poziva se cijela građevina element web dokument.

kako umetnuti hipervezu u html

Prema HTML pravilima, neki elementi mogu sadržavatiostali elementi. <a> oznaka nije iznimka. Ako programer treba naglasiti riječ Google, tada se to radi pomoću oznake <b> </ b> za opće pravilo oblikovanja teksta, promatrajući niz oznaka za gniježđenje. Webmaster bi trebao znati kako stvoriti hipervezu u HTML-u bez pogrešaka, inače neće raditi. Slomljene veze na računalnom slangu nazivaju se "slomljene".

<a href="http://google.com/"> početnu stranicu <b> Google </ b> </a>

Ovdje: stavka

<a href="http://google.com/"> početnu stranicu <b> Google </ b> </a>

sadrži ugniježđeni element

<b> Google </ b>

Sada će posjetitelj stranice vidjeti hipervezu s podebljanim tekstom istaknutom riječju "Google".

Apsolutne hiperveze

Pozvani su hiperveze pomoću apsolutnih URL-ova web stranica s nazivima domena (.ru, .com, .org, .gov) apsolutan i imaju sljedeću sintaksu:

protokol: // naziv domene / put do datoteke

Primjer adrese popularne tražilice u Americi: https://aol.com - apsolutno, jer sadrži naziv domene .com.

Apsolutne hiperveze koriste se za konverzijena stranice drugih mjesta ili za pristup resursima koji se nalaze na drugom poslužitelju. Prijelaz se provodi putem Internet protokola. Protokoli nisu predmet ovog članka, no budući da sudjeluju u stvaranju hiperveze, potrebno ih je barem kratko spomenuti:

  • http i https - najčešći; na njima postoji prijelaz između internetskih stranica različitih mjesta;
  • ftp - protokol za prijenos datoteka na poslužitelj ili preuzimanje od strane korisnika s web stranice;
  • mailto - mail protokolom, koji šalje e-poštu izravno s web stranice, a ne ulazeći u vašu osobnu poštu.

Postoji nekoliko drugih protokolaimenovanja (gopher, telnet), koje su prilično rijetke, čije korištenje zahtijeva posebna znanja u programiranju ili administraciji sustava.

Relativne hiperveze

Uz relativno adresiranje, korištenjeHiperlinkovi u HTML služe za prijelaze unutar resursa i ne vode dalje od toga. Ako je stranica toliko velika da vertikalna traka za pomicanje funkcionira, ponekad vrlo dugo, kao u rječnicima, vrlo je prikladno i prikladno koristiti relativne veze kako bi se brzo skočio na željeno slovo.

Stvaranje internetskog rječnika, programer na početku stranice ima abecedu, a ako ne i za primjenu veza, korisnik bi trebao dugo vremena okretati kotačić miša da bi došao do slova "I".

kako umetnuti hipervezu u html na drugu stranicu

Da biste stvorili relativnu referencu, upotrijebite atribut ime <a> oznaka:

<a name=<ya"> Idi na pismo  </a>

gdje ya se zove sidro, i Idite na pismo  - odredišno sidro. Za pravilno prikazivanje sidara preporučuje se korištenje latiničnih slova i brojeva, stoga nemojte pisati "ja", iako bi bilo razumljivije.

Sada, da biste prijelaz iz abecede na početku stranice do slova "ja", trebate sidriti sidro u mjestu HTML dokumenta, u kojem riječi počinju slovom "I":

<a href={#ya"> pismo I </a>

prije nego što sidro bude znak rešetke, bez kojeg prijelaz na pismo neće funkcionirati.

Relativno adresiranje prilikom izrade web mjesta

Prikladan i najčešći algoritam za izradu web stranice od strane programera:

  • stvoriti mapu na računalu i smjestiti je na mjesto za brzo pristupanje radi lakšeg korištenja;
  • stvoriti u ovoj mapi glavnu stranicu stranice index.html;
  • stvaranje sekundarnih web stranica (index.html / page2);
  • stvaranje mape i stavljanje grafičkih datoteka u njega;
  • stvaranje mape i postavljanje drugih objekata (primjerice, datoteke za preuzimanje);
  • popunjavanje stranice sa sadržajem;
  • postavljanje datoteka web mjesta na hosting.

Svakako koristite veze zaveza između elemenata web lokacije i vrlo prilika će znati kako umetnuti hipervezu u HTML na drugoj stranici istog web mjesta. Ako se datoteke web mjesta nalaze u istom direktoriju, na istom poslužitelju, nema potrebe za apsolutnim adresiranjem. Prilikom prijenosa datoteka web mjesta na hosting, veza između objekata bit će sačuvana, jer će se također nalaziti u istom direktoriju na hostingu.

Pretpostavimo da je programer izradio glavnu stranicusite index.html, koji ima vezu na drugu stranicu page2.html, ukrašenu slikom img.png. Zatim će relativni put do ove slike izgledati ovako:

<a href={/page2.html/img.png"> Slika </a>

Vijeće: kada proučavate ovu temu, najbolje je koristiti jednostavan urednik teksta jer morate kupiti vještinu u ispravnom pravopisu adresa i naučiti razumjeti kôd drugih ljudi. U ovoj fazi, hiperveza u bilježnici će biti dobar rezultat bez pogrešaka, HTML im ne oprostiti i stvara pogreške.

Načini kretanja kroz hiperveze

Prema zadanim postavkama, u trenutnoj se stranici otvara nova stranicaProzor preglednika kada korisnik klikne na hipervezu. No web programer može promijeniti zadanu vrijednost i prisiliti stranicu da se otvori, na primjer, u novom prozoru. Zbog toga postoji atribut meta s određenom vrijednošću. To se najjasnije izražava u tablici.

Vrijednosti atributa meta
_blankOtvara stranicu u novom prozoru preglednika
_selfotvara stranicu u trenutnom prozoru (zadana vrijednost)
_parentotvara stranicu u roditeljskom okviru
_topkada koristite okvire, sve ih poništi i otvara stranicu u trenutnom prozoru preglednika

Sintaksa za primjenu atributa cilj:

<a href={https://google.com/> target = "_ blank"> google početna stranica </a>

Početna stranica "Google" otvorit će se u novom prozoru.

Napomena: za otvaranje stranica na novoj kartici nema vrijednosti za ovaj atribut, ali ih postavlja korisnik u postavkama preglednika.

Boja hiperveza

Iskusni korisnik Interneta trebao biPrimijetio sam da su hiperveze različite boje u okolnom tekstu, a obično su plave. Veze, kojima je prošao, a zatim se vratio na prethodnu stranicu, postali su junaci. Korištenje hiperveze u HTML-u u nekonvencionalnoj shemi boja nije mnogo, ali ističe mjesto među ostalima.

html boja

Boje veza u <body> tagu postavljene su pomoćuatribute i njihove vrijednosti u kojima se pojavljuje HTML boja u rgb sustavu (# 00FF00) ili s izravnim imenom boje ("zelena"). Postoje tri vrste atributa za veze:

  • veza - postavlja boju neprikazane veze;
  • vlink - određuje boju veze kojom je korisnik već prebacio;
  • alink - postavlja boju veze u trenutku prebacivanja na drugu stranicu. To se događa brzo, tako da ne možete uvijek uhvatiti taj efekt.

Primjer označavanja:

<body link = "# 330099" alink = "# FF0000" vlink = "# 990066">

Ako primijenite te atribute u oznaku <body>, veze ovog web dokumenta bit će tamno plave, posjećene - lila i aktivne - narančasto-crvene.

Grafičke hiperveze

Napredak i razvoj web dizajna obvezuju se znati,kako umetnuti hipervezu u HTML kao sliku. Jasno je da slika mora odgovarati sadržaju odredišne ​​stranice. Na primjer, glavna stranica stranice o ljekovitim biljkama može se prikazati u obliku fotografija biljaka, klikom na koji će korisnik otići na stranicu koja opisuje ljekovita svojstva postrojenja.

Naširoko koristi metode zamjene statičnih gumba (<ulaz tip = "gumb">) na prekrasnoj grafici, koju je izradio web dizajner u grafičkim urednicima (GIMP, Photoshop).

korištenje hiperveze u htmlu

Da biste umetnuli grafiku kao hiperveze na stranice web mjesta, upotrebljava se ista sintaksa, no umjesto teksta koristi se oznaka umetanja slike prema HTML pravilima:

<a href=]page2.html"> <img src = "/ images / img1" alt = "majka i maćeha" width = "50" height = "46"> </a>

Na oznaku <img> primjenjuju se atributi za određivanje alternativnog teksta, širine, visine i drugih na isti način.

Pozivi s web mjesta

Standard html5 proširio je funkcionalnostmogućnosti korištenja Interneta, a sada možete upućivati ​​pozive ne samo putem telefona, već izravno s web mjesta. U tu svrhu možete koristiti i hiperveze u HTML dokumentu i oni imaju ovu sintaksu:

<a href="tel:+79xxxxxxxxx"> ...pretplatnik...</a>

Umjesto riječi "pretplatnik", propisan je kontakt s pozivateljem, kao u telefonskom imeniku. Također možete postaviti grafičku datoteku (sliku pretplatnika).

koje vrste hiperveza postoje u HTML-u

Da biste uputili pozive s web stranice, trebatePrisutnost ne samo referenca na telefonski broj pretplatnika, već i slušalice (mikrofon, slušalice) instalirane na računalu VoIP program, brzina Interneta bi trebala prelaziti 0,5 Mb / s. Plaćanje poziva provodi se trošak prometa. Stoga, ako je internet neograničen, tada su pozivi besplatni.

Etika stvaranja hiperveze

Postavljanjem web stranice na Internet, webmaster bi trebao znati koje vrste hiperveza postoje u HTML-u, a ne samo ispravno, profesionalno ih primjenjuju, ali i pridržavati se sljedećih odredbi:

  • Hiperlink mora biti jasno vidljiv, različit od okolnog teksta. Korisnik bi trebao znati da je to hiperveza.
  • Korisnik treba razumjeti, gdje će dobiti klikom na vezu. U tu svrhu preporučljivo je koristiti drugi atribut naslov, koji sažeto opisuje prijelaznu stranicu. Sintaksa za primjenu atributa je:

<a href={http://yandex.ru/> title = prese internet portal "> Yandex </a>

  • Korisnik bi trebao dobiti prave informacije o datoteci koja će se preuzeti kada kliknete na vezu.

koje vrste hiperveza postoje u HTML-u

Nakon što nije padao na očekivane stranice ili preuzimanje pogrešne datoteke, korisnik će odmah napustiti web stranicu u 99% web mjesta i ubuduće nikada neće ići na njega.

Anti-Seo prilikom stvaranja hiperveza

Uz tehničku stranu pitanja kakoumetnete hipervezu u HTML, također biste trebali istaknuti moralni aspekt. Postoje mnoge web stranice, kojima su korisnici blokirani sigurnosni programi (antivirusni programi) ili čak i država. To su web-lokacije koje su stvorili nečisti web-programeri.

kako umetnuti hipervezu u html na drugu stranicu

Jedan od trikova kojima se odmarajuumetanjem "nevidljivih" hiperveza na web stranicu. Zahvalitelji znaju stvoriti hipervezu u HTML-u i upotrebljavati atribute kako bi uklonili podcrtinu veze i dodijelili mu boju okolnog teksta tako da ga prosječni korisnik ne vidi. Pomoću drugih alata za web tehnologije (CSS, JavaScript, PHP) možete programirati njihovo ponašanje. Na primjer, JavaScript OnMouseOver događaj aktivira akciju elementa web stranice. Kada korisnik pomiče pokazivač preko nevidljive veze, on zauzima oglasnu stranicu druge web lokacije. Ili još gore, kada postoji nevidljiva veza na datoteku i na računalu počinje preuzimati i instalirati nepotrebne programe. Obično se radi o virusima koji mijenjaju početnu stranicu preglednika, ometaju tvrdi disk s puno programa i sadržaja.

Uskoro takva mjesta spadaju u "crni popis"virusnih baza podataka, sigurnosnih sustava i samih korisnika Interneta. Takva mjesta ne žive dugo, i moraju promijeniti svoje ime, beskrajno migrirati preko Interneta, mijenjati pružatelje domaćina. To ne promiče promociju web-lokacije koju uvijek traži njezin autor, nikada neće učiniti ga megaportalom, kao što je, na primjer, društvene mreže. Između ostalog, takvi trikovi uzrokuju mnogo negativnih emocija kod ljudi koji su pogođeni tim radnjama.