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

Hypertext je tekst koji sadrži veze s drugim tekstom. 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 koristite deskriptor (oznaku) da biste umetnuli hipervezu. , koji je umetnut na pravo mjesto. Obično se stavlja u tekst, jer je hiperveza sama po sebi tekstna struktura. No, veze su i dalje grafičke (ikone, gumbi, slike) - o njima će se dalje raspravljati. Njihovo mjesto na web stranici nije ograničeno na tekst, već ovisi o odlukama dizajera autora stranice.

Google početnu stranicu

Ovo je primjer kako umetnuti hipervezu u HTML dokument, koji se obavlja putem oznake . Site posjetitelji će vidjeti podcrtani tekst koji se razlikuje od boje okolnog teksta (boja HTML-linkovi mogu biti bilo što), „Google početna stranica”, kliknite na to, on će doći na početnu stranicu, „Google” tražilici. 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 ...

Možete vidjeti oznaku - upareni: zatvaranje oznake je obavezna .

atribut href označava svrhu veze.

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

home google

poziva se cijela građevina element web dokument.

kako umetnuti hipervezu u html

Prema HTML pravilima, neki elementi mogu sadržavati i druge elemente. oznaka ne iznimka. Ako programer treba naglasiti riječ Google, onda se to radi pomoću oznake na općim pravilima za oblikovanje 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".

početnu stranicu Google

Ovdje: stavka

početnu stranicu Google

sadrži ugniježđeni element

Google

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 kretanje stranicama drugih web mjesta ili za pristup resursima 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 su 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 protokola posebne namjene (gopher, telnet), koji su vrlo rijetki, čija upotreba zahtjeva posebna znanja u programiranju ili administraciji sustava.

Relativne hiperveze

Uz relativno adresiranje, upotreba hiperveze u HTML služi za prijelaze unutar resursa i ne vodi dalje od toga. Ako je stranica toliko velik da radi vertikalni klizač, ponekad jako dugo, kao što je u rječniku, to je vrlo zgodan i prikladan za korištenje u odnosu linkove za skok na željeno slovo.

Izrada online rječnik, programer na početku stranice ima abecedu, a ako ne za korištenje linkova, korisnik bi imao jako dugo vremena da se kotač miša doći do slova „I”.

kako umetnuti hipervezu u html na drugu stranicu

Da biste stvorili relativnu referencu, upotrijebite atribut ime oznaka :

Idite na pismo Â

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 kada je na prijelazu iz abecede na početku stranice na slovo „I”, potrebno je da se sidro klin u HTML-dokument, koji počinje slovom „I”:

slovo I

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.

Potrebno je koristiti veze za komunikaciju između elemenata web-lokacije i vrlo prilicno znati kako umetnuti hipervezu u HTML na drugu stranicu na istom mjestu. 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.



Na primjer, programer je izradio glavnu stranicu stranice index.html, na kojoj postoji veza na drugu stranicu page2.html, ukrašenu slikom img.jpg. Zatim će relativni put do ove slike izgledati ovako:

slika

Savjet: prilikom proučavanja ove teme najbolje je upotrijebiti jednostavan urednik teksta jer morate stjecati vještine za pravilno pisanje adresa i naučiti kako se nositi s kodom 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 trenutnom prozoru preglednika otvara se nova stranica 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:

home google

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 internetski korisnik s vremenom trebao je primijetiti da se hiperveze razlikuju u boji od okolnog teksta, 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

Navedite boju veza u oznaci uz pomoć atributa i njihovih vrijednosti, u kojima se boja HTML pojavljuje u sustavu rgb (# 00FF00) ili izravnom naznakom naziva 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:

Ako primijenite te atribute u oznaku , veze ovog web dokumenta bit će tamnoplave, posjećene - ljubičaste i aktivne - narančasto-crvene.

Grafičke hiperveze

Napredak i razvoj web dizajna je potrebno 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čkih gumba () 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:

K oznaka Na isti način primjenjuju se atributi određivanja alternativnog teksta, širine, visine i drugih.

Pozivi s web mjesta

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

...pretplatnik...

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

To pozivi su napravljene na licu mjesta, morate imati ne samo referencu na broj telefona pretplatnika, ali i slušalice (mikrofon, slušalice) instaliran na vašem računalu VoIP-program, internet brzina bi trebala prelaziti 0,5 MB / sec. 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:

Yandex

  • 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 o tome kako umetnuti hipervezu u HTML, trebali biste također 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

Jedna od trikova za koje se pozivaju jest umetanje "nevidljivih" hiperveza u 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, jаvascript, PHP) možete programirati njihovo ponašanje. Na primjer, jаvascript 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 među samim korisnicima 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.

Dijelite na društvenim mrežama:

Povezan
Likbez: kako napraviti vezu u `Kontakte` na zidu?Likbez: kako napraviti vezu u `Kontakte` na zidu?
Kako napraviti hipervezu u prezentaciji na različite načine?Kako napraviti hipervezu u prezentaciji na različite načine?
Kako napraviti hipervezu u Riječi? Kako stvoriti hipervezu u programu Word 2007-2010Kako napraviti hipervezu u Riječi? Kako stvoriti hipervezu u programu Word 2007-2010
Odaberite tekst. Hrabar tip. HTML priručnik za početnikeOdaberite tekst. Hrabar tip. HTML priručnik za početnike
Popis glavnih HTML oznakaPopis glavnih HTML oznaka
HTML oznake: izgled, programiranje, dizajnHTML oznake: izgled, programiranje, dizajn
Kako u "Word" nametnuti tekst na tekst bez slike?Kako u "Word" nametnuti tekst na tekst bez slike?
Kako ukloniti podcrtavanje na vezu HTML stranice?Kako ukloniti podcrtavanje na vezu HTML stranice?
Upute o tome kako izbrisati sve hiperveze u programu WordUpute o tome kako izbrisati sve hiperveze u programu Word
Kako ukloniti hiperveze u cijelom dokumentu u "Word" i "Excel": uputeKako ukloniti hiperveze u cijelom dokumentu u "Word" i "Excel": upute
» » Kako ubaciti hipervezu u HTML? Izrada i upotreba hiperveze u HTML-u
LiveInternet