Kako narediti povezavo v HTML-ju?

Kazalo:

Kako narediti povezavo v HTML-ju?
Kako narediti povezavo v HTML-ju?
Anonim

Spletne strani, blogi, spletne strani - že poznani koncepti v našem času. Z razvojem interneta so spletna mesta za gostovanje spletnih strani postala neverjetno priljubljena in to ni presenetljivo: za nekatere je imeti lastno spletno stran nuja, za druge pa prijetna zabava. V prvem primeru običajno govorimo o podjetjih, korporacijah, zasebnih podjetnikih, ko oglašujejo kateri koli izdelek ali storitev po povpraševanju. Drugi je o blogerjih.

Poleg tega obstajajo uporabniki interneta, ki preprosto iščejo informacije, berejo bloge, gledajo videoposnetke in tako naprej.

Za ustvarjanje kakovostnega spletnega mesta obstaja veliko možnosti. Osredotočili se bomo na spletno programiranje prek HTML.

Kaj je HTML

HTML pomeni Hyper Text Mark-Up Language. Prevedeno iz angleščine to pomeni "jezik za označevanje hiperteksta".

Z drugimi besedami, HTML je niz kod, s katerimi lahko ustvarite glavne elemente spletnega mesta, njegov okvir, npr.kako so besede sestavljene iz stavkov.

Kode HTML so zapisane izključno z latiničnimi črkami in se imenujejo oznake, vsaka koda pa je zaprta v kotnih oklepajih. Nekatere oznake so seznanjene, nekatere ne seznanjene.

Seznanjeno pomeni, da jih je treba nujno uporabljati v parih. Na primer, začetna oznaka označuje, kje se začne na spletni strani, zaključna oznaka pa označuje, kje se ustavi. Slednji se od prvega razlikuje po prisotnosti poševnice za oklepajem kota odpiranja. Na primer, je začetna oznaka,je zaključna oznaka.

Neparjene oznake ne potrebujejo partnerja.

Veliko oznak ima lahko atribute - dodatne elemente, ki jim dajejo bolj specifičen pomen. Na primer oznaka.

oblikovanje spletnih strani
oblikovanje spletnih strani

Kje se uporablja HTML

Klasično razumevanje, kje je HTML potreben, je izdelava spletnih mest.

V praksi je to morda dovolj, saj HTML omogoča ustvarjanje glavnih elementov spletnega mesta, menijev (vključno z večstopenjskimi), nastavitev ozadja, vstavljanje besedila, slik, zvoka, videa, urejanje pisav in še veliko več.

Vendar pa obstajajo drugi jeziki, ki vam omogočajo, da spletni strani dodate bolj zanimive in pogosto potrebne elemente:

  • CSS nastavi sloge za celotno spletno mesto, ne da bi bilo treba nenehno predpisovati slogovne značilnosti posameznih elementov z uporabo oznak – na primer barve in pisave besedila.
  • Skriptni jezik vam omogoča razvoj in vdelavo mini-programov (skriptov) na spletno mesto, odbanalne estetske stvari (spreminjanje barve povezave ob premikanju miške) in končajo s funkcionalnimi (zbiranje e-poštnih naslovov strank, telefonskih številk).
  • S PHP lahko razvijete svojo knjigo gostov ali sistem komentarjev.

Prav tako se HTML uporablja pri ustvarjanju e-poštnih sporočil za distribucijo.

internetni poštni seznam
internetni poštni seznam

Kaj je povezava

Omogočajo vam navigacijo na drugo spletno stran, tako znotraj spletnega mesta kot zunaj njega.

HTML povezave se običajno uporabljajo:

  • Če želite odpreti zunanji spletni vir.
  • Za premikanje po straneh na spletnem mestu.
  • Če želite odpreti Googlove obrazce.

Pogosto je navedena tudi povezava do vira v HTML, še posebej, ker morate pri kopiranju gradiva z drugega spletnega mesta navesti avtorja. V nasprotnem primeru lahko kopiranje brez navedbe avtorstva spada pod definicije kršitve avtorskih pravic, kraje vsebine in negativnega učinka. Poleg tega uporaba izposojenih, neunikatnih materialov zmanjša učinkovitost SEO, navedba povezave do vira pa zmanjša tveganja.

Vrste povezav

V klasičnem smislu je povezava naslov spletnega vira, na katerega lahko obiščete s klikom nanj.

vrste povezav
vrste povezav

Poleg tega obstajajo hiperpovezave: besedilo in slike. V teh primerih je povezava HTML "skrita" pod nekim stavkom (besedo) ali sliko, in da ji sledite, morate klikniti besedilo ali sliko.

Druge vrste povezav:

  • Neobiskano - povezava, na katero med določeno sejo še niste kliknili. Na primer, če ste včeraj sledili tej povezavi, nato izklopili računalnik in ga danes znova vklopili, zdaj povezava ni več obiskana, saj se je začela nova seja.
  • Aktivno - v tem stanju je povezava shranjena za zelo kratek čas: interval med klikom na povezavo in njenim sledenjem.
  • Obiskano - povezava, ki je bila že obiskana vsaj enkrat med eno sejo.

Pri običajnih besedilnih povezavah obiskane ponavadi spremenijo barvo, razen če ni drugače določeno.

Slika s hiperpovezavo ne spremeni svojega videza, ne glede na to, ali je obiskana ali ne.

Kako vstaviti običajno povezavo

Številni spletni viri zaznajo naslov spletnega mesta kot povezavo, ga takoj naredijo klikljivega in ga poudarijo z barvo. Na primer, če je naslov poslan v messengerju ali po e-pošti, s klikom nanj lahko odprete spletno mesto.

V primeru, da sami ustvarite spletno mesto z uporabo HTML-ja, morate vstaviti povezavo s posebno oznako. Videti bo takole: naslov spletnega mesta. Besedilo povezave v HTML-ju mora biti navedeno v celoti, s protokolom.

Kako vstaviti besedilno hiperpovezavo

Prej je bilo rečeno, da besedilna hiperpovezava opravlja enako funkcijo kot običajna povezava, vendar je videti bolj estetsko prijetna: namesto naslova spletnega mesta, ki je pogosto nepotrebno dolg, je navedena beseda ali fraza. Na primer, v stavku "Poiščite informacije tukaj" lahko skrijete povezavobeseda "tukaj". Označena bo in s klikom nanjo bo uporabnik preusmerjen na želeno spletno mesto.

vstavljanje hiperpovezave
vstavljanje hiperpovezave

Kako narediti povezavo HTML, smo že razpravljali prej. Z isto oznako lahko vstavite besedilno hiperpovezavo. Edina razlika je v tem, da morate med oznakami določiti besedilo, pod katerim bo povezava skrita: vidno besedilo.

Kako vstaviti hiperpovezavo slike

Tu je malo bolj zapleteno. Uporabljamo isto oznako, vendar morate namesto besedila določiti pot do slike.

Pot je lokacija slike. Če se slika (fotografija) nahaja v storitvi za skupno rabo datotek, morate skozi poševnico določiti vse mape na poti do slike. Če je mogoče, lahko vključite tudi povezavo do slike.

Za označitev

Poleg src so uporabni tudi drugi atributi, ki vam omogočajo prilagajanje višine, širine in lokacije slike in še veliko več. Nekateri izmed njih:

  • Src - določa pot do slike.
  • Lowsrc - identično prejšnjemu atributu, vendar je določeno za slike nizke kakovosti.
  • Višina - višina slike.
  • Širina - njegova širina.
  • Alt - opis slike. Ko premaknete miškin kazalec nad fotografijo ali sliko, se prikaže besedilo, določeno v tem atributu.
  • Border - določa debelino obrobe okoli slike.

Atributi so navedeni za oznako in so vključeninjegovo sestavo. Atributu mora slediti njegova vrednost. Na primer, za atributa "višina" ali "širina" (višina, širina) določa višino slike na spletni strani. Merska enota so piksli, razen če je določeno drugače.

Izgledalo bo takole: <a href="naslov spletne strani"

. Ti atributi bodo pomagali nastaviti ustrezno velikost slike. Obroba pomaga ustvariti nevidno obrobo okoli slike.

po povezavi
po povezavi

Zgornji atributi veljajo ločeno za oznako za vstavljanje slike. Na primer:.

Kaj so sidrne povezave

Ustvarjanje sidrnih povezav je zelo uporabna veščina. Pogosto je treba na eni strani postaviti spletno stran z dolgim besedilnim blokom ali z več pododdelki. V tem primeru lahko takoj začnete s seznamom povezav do pododdelkov besedila ali spletne strani, in ko kliknete nanje, bo uporabnik šel neposredno na zahtevani razdelek.

Ustvarjanje sidrnih povezav bo zahtevalo več uporabe oznak atributov kot druge vrste povezav.

sidro povezave
sidro povezave

Najprej morate nastaviti skupno vrednost za vsak blok informacij ali pododsek besedila z uporabo zgornjega atributa in ga nato povezati z ustrezno povezavo.

Njihove lastnosti so obsežnejše, zato je priporočljivo, da najprej obvladate ustvarjanje enostavnejših povezav, nato pa preidete na oblikovanje sidrnih povezav.

Nasveti

Postavitev različnih blokov informacij na spletno stran
Postavitev različnih blokov informacij na spletno stran

Pomoč izkušenihprogramerji:

  • Lahko naredite tako, da se informacije o povezavi prikažejo ob lebdenju v HTML. Za to nam lahko pride prav atribut alt, ki ga uporabljamo tudi za grafične elemente.
  • Možno je narediti seznam povezav z uporabo HTML-ja. To je lahko uporabno predvsem za sidrne povezave, pa tudi, ko morate narediti seznam spletnih virov, ki jim lahko sledi povezava neposredno s trenutne spletne strani.
  • S pomočjo CSS in JavaScript ter nekaterih funkcij HTML lahko ustvarite drugačno obliko besedilnih povezav in hiperpovezav kot običajno. Na primer, ko premaknete miškin kazalec nad povezavo, lahko spremeni svojo barvo in se vrne na prejšnjo, ko je kazalec stran od nje. To lahko storite s skriptom JavaScript po meri. Poleg tega lahko barvo povezave nastavite na nekaj drugega kot modro za neobiskane ali vijolično za obiskane. To je naloga CSS.
  • Ne zlorabljajte povezav. Spletna stran s številnimi neprimernimi povezavami je videti površno in površno.
  • Prepričajte se, da uporabnik razume, da je hiperpovezava s sliko res slika in ne samo slika.

Sklep

Povezovanje na stran v HTML-ju je zelo enostavno. Pomembno je upoštevati vse glavne točke tega jezika, saj lahko že majhna napaka privede do dejstva, da ne bo rezultata in koda ne bo delovala.

Priporočena: