Kako napraviti link u HTML-u?

Sadržaj:

Kako napraviti link u HTML-u?
Kako napraviti link u HTML-u?
Anonim

Web stranice, blogovi, web stranice - već poznati koncepti u naše vrijeme. S razvojem interneta, stranice za hosting web stranica postale su nevjerovatno popularne, i to nije iznenađujuće: za neke je posjedovanje vlastite web stranice neophodna, za druge ugodna zabava. U prvom slučaju obično govorimo o firmama, korporacijama, privatnim poduzetnicima, kada reklamiraju bilo koji proizvod ili uslugu traženi. Drugi je o blogerima.

Osim ovoga, postoje korisnici interneta koji jednostavno traže informacije, čitaju blogove, gledaju video zapise i tako dalje.

Za kreiranje kvalitetne web stranice, postoji mnogo opcija. Fokusiraćemo se na web programiranje putem HTML-a.

Šta je HTML

HTML je skraćenica za Hyper Text Mark-Up Language. Prevedeno sa engleskog, ovo znači "jezik za označavanje hiperteksta".

Drugim riječima, HTML je skup kodova pomoću kojih možete kreirati glavne elemente stranice, njen okvir, npr.kako se riječi sastoje od rečenica.

HTML kodovi su napisani isključivo latiničnim slovima i nazivaju se tagovi, a svaki kod je zatvoren u uglastim zagradama. Neke oznake su uparene, neke neuparene.

Upareno znači da se moraju koristiti u paru bez greške. Na primjer, početna oznaka označava gdje počinje na web stranici, a završna označava gdje se zaustavlja. Potonji se razlikuje od prvog po prisutnosti znaka kose crte nakon ugla otvaranja zagrade. Na primjer, je početna oznaka,je završna oznaka.

Neuparene oznake ne trebaju partnera.

Mnoge oznake mogu imati atribute - dodatne elemente koji im daju neko specifičnije značenje. Na primjer, oznaka.

Web dizajn
Web dizajn

Gdje se koristi HTML

Klasično razumijevanje gdje je HTML potreban je izgradnja web stranice.

U praksi, ovo može biti dovoljno, jer HTML vam omogućava da kreirate glavne elemente sajta, menije (uključujući i one na više nivoa), postavite pozadinu, ubacite tekst, slike, audio, video, uredite fontove i još mnogo toga.

Međutim, postoje i drugi jezici koji vam omogućavaju dodavanje zanimljivijih i često potrebnih elemenata na web stranicu:

  • CSS postavlja stilove za cijelu stranicu bez potrebe za stalnim propisivanjem stilskih karakteristika pojedinačnih elemenata koristeći oznake - boju i font teksta, na primjer.
  • Skriptni jezik vam omogućava da razvijete i ugradite mini-programe (skripte) na sajt, u rasponu odbanalne estetske stvari (promjena boje linka pri prelasku miša) i završavaju sa funkcionalnim (prikupljanje adresa e-pošte kupaca, brojeva telefona).
  • Sa PHP-om možete razviti vlastitu knjigu gostiju ili sistem komentara.

Takođe HTML se koristi u kreiranju emailova za distribuciju.

internet mailing lista
internet mailing lista

Šta je link

Omogućuju vam navigaciju do druge web stranice, kako unutar web stranice tako i vanjske.

HTML veze se obično koriste:

  • Za odlazak na vanjski web resurs.
  • Za kretanje kroz stranice unutar stranice.
  • Za odlazak na google forme.

Veza ka izvoru u HTML-u je takođe često naznačena, posebno zato što kada kopirate materijal sa drugog sajta, morate navesti autora. U suprotnom, kopiranje bez pripisivanja može potpasti pod definicije kršenja autorskih prava, krađe sadržaja i povratnih posljedica. Osim toga, korištenje posuđenih, neunikatnih materijala smanjuje performanse SEO-a, a navođenje veze na izvor smanjuje rizike.

Vrste linkova

U klasičnom smislu, link je adresa web resursa na koji možete otići klikom na njega.

vrste veza
vrste veza

Osim ovoga, postoje hiperveze: tekst i slike. U ovim slučajevima, HTML link je "skriven" ispod neke rečenice (reči) ili slike, a da biste je pratili potrebno je da kliknete na tekst ili sliku.

Druge vrste linkova:

  • Neposjećeno - link na koji još niste kliknuli tokom određene sesije. Na primjer, ako ste jučer pratili ovu vezu, a zatim isključili računar i ponovo ga uključili danas, sada je link ponovo nepohodan, jer je nova sesija počela.
  • Aktivan - u ovom stanju, link se čuva vrlo kratko: interval između klika na link i praćenja.
  • Posjećeno - link koji je već posjećen barem jednom tokom jedne sesije.

Za obične tekstualne linkove, posjećeni imaju tendenciju da mijenjaju boju osim ako nije drugačije naznačeno.

Slika sa hiperlinkom ne mijenja svoj izgled, bez obzira da li je posjećena ili ne.

Kako umetnuti običan link

Mnogi web resursi percipiraju adresu stranice kao vezu, odmah je čine klikabilnom i naglašavaju je bojom. Na primjer, ako je adresa poslata u messengeru ili e-mailom, klikom na nju možete otići na stranicu.

U slučaju da sami kreirate web lokaciju koristeći HTML, morate umetnuti link koristeći poseban tag. To će izgledati ovako: adresa web stranice. Tekst linka u HTML-u mora biti naveden u potpunosti, sa protokolom.

Kako umetnuti tekstualnu hipervezu

Ranije je rečeno da tekstualna hiperveza obavlja istu funkciju kao i obična veza, ali izgleda estetski ugodnije: umjesto adrese stranice, koja je često nepotrebno duga, naznačena je riječ ili fraza. Na primjer, u rečenici "Potražite informacije ovdje", možete sakriti vezuriječ "ovdje". Biće označeno i klikom na njega će korisnik odvesti na željenu stranicu.

umetanje hiperveze
umetanje hiperveze

Kako napraviti HTML link je već diskutovano ranije. Možete umetnuti tekstualnu hipervezu koristeći istu oznaku. Jedina razlika je u tome što između tagova treba da navedete tekst ispod kojeg će link biti sakriven: vidljivi tekst.

Kako umetnuti hipervezu slike

Ovdje je malo komplikovanije. Koristimo istu oznaku, ali umjesto teksta potrebno je navesti putanju do slike.

Putanja je lokacija slike. Ako se slika (fotografija) nalazi na servisu za dijeljenje datoteka, tada morate navesti sve mape duž putanje do slike kroz kosu crtu. Također možete uključiti link do slike ako je moguće.

Da označite

pored src-a, primjenjivi su i drugi atributi koji vam omogućavaju podešavanje visine, širine i lokacije slike i još mnogo toga. Neki od njih:

  • Src - određuje putanju do slike.
  • Lowsrc - identično prethodnom atributu, ali specificirano za slike niskog kvaliteta.
  • Visina - visina slike.
  • Širina - njegova širina.
  • Alt - opis slike. Kada zadržite pokazivač miša iznad fotografije ili slike, tekst naveden u ovom atributu će se pojaviti.
  • Border - određuje debljinu ivice oko slike.

Atributi su navedeni nakon oznake i uključeni sunjegov sastav. Atribut mora biti praćen njegovom vrijednošću. Na primjer, za atribute "visina" ili "width" (visina, širina) određuje se visina slike na web stranici. Jedinica mjere je pikseli, osim ako nije drugačije navedeno.

Izgledat će ovako: <a href="adresa web stranice"

. Ovi atributi će pomoći u postavljanju odgovarajuće veličine za sliku. Ivica pomaže da se stvori nevidljivi okvir oko slike.

prateći link
prateći link

Gore navedeni atributi se posebno primjenjuju na oznaku za umetanje slike. Na primjer:.

Šta su sidrene veze

Kreiranje sidrenih linkova je vrlo korisna vještina. Često postoji potreba za postavljanjem web stranice s dugačkim blokom teksta ili s nekoliko pododjeljaka na jednoj stranici. U tom slučaju možete odmah početi sa listom linkova ka pododjeljcima teksta ili web stranice, a kada kliknete na njih, korisnik će ići direktno na traženi odjeljak.

Kreiranje sidrenih linkova zahtijevat će više korištenja oznaka atributa nego druge vrste veza.

link sidro
link sidro

Prvo, morate postaviti ukupnu vrijednost za svaki blok informacija ili pododjeljak teksta koristeći atribut top, a zatim ga povezati s odgovarajućom vezom.

Njihove karakteristike su opsežnije, stoga je preporučljivo prvo savladati kreiranje jednostavnijih linkova, a zatim preći na formiranje sidrenih veza.

Savjeti

Postavljanje različitih blokova informacija na web stranicu
Postavljanje različitih blokova informacija na web stranicu

Pomoć iskusnihprogrameri:

  • Možete napraviti tako da se informacije o linku prikazuju pri lebdenju u HTML-u. Za to nam može dobro doći atribut alt, koji koristimo i za grafičke elemente.
  • Moguće je napraviti listu linkova koristeći HTML. Ovo posebno može biti korisno za sidrene veze, kao i kada trebate napraviti listu web resursa koji može biti praćen linkom direktno sa trenutne web stranice.
  • Uz pomoć CSS-a i JavaScript-a, kao i nekih HTML funkcija, možete kreirati drugačiji dizajn tekstualnih veza i hiperlinkova nego inače. Na primjer, kada zadržite pokazivač iznad veze, ona može promijeniti svoju boju i vratiti se na prethodnu kada je kursor udaljen od nje. Ovo se može uraditi sa prilagođenom JavaScript skriptom. Osim toga, boja veze može se postaviti na nešto drugo osim plave za neposjećene ili ljubičaste za posjećene. Ovo je posao CSS-a.
  • Ne zloupotrebljavajte linkove. Web stranica sa mnogo neprikladnih linkova izgleda aljkavo i aljkavo.
  • Uvjerite se da korisnik razumije da je hiperveza sa slikom zaista slika, a ne samo slika.

Zaključak

Veoma je lako povezati stranicu u HTML-u. Važno je pratiti sve glavne tačke ovog jezika, jer čak i mala greška može dovesti do toga da neće biti rezultata, a kod neće raditi.

Preporučuje se: