Kaip sukurti nuorodą HTML?

Turinys:

Kaip sukurti nuorodą HTML?
Kaip sukurti nuorodą HTML?
Anonim

Svetainės, tinklaraščiai, tinklalapiai – mūsų laikais jau žinomos sąvokos. Tobulėjant internetui, interneto puslapių talpinimo svetainės tapo neįtikėtinai populiarios, ir tai nenuostabu: vieniems turėti savo svetainę yra būtinybė, kitiems – maloni pramoga. Pirmuoju atveju dažniausiai kalbame apie firmas, korporacijas, privačius verslininkus, kai jie reklamuoja kokį nors paklausų produktą ar paslaugą. Antrasis yra apie tinklaraštininkus.

Be to, yra interneto vartotojų, kurie tiesiog ieško informacijos, skaito tinklaraščius, žiūri vaizdo įrašus ir pan.

Norėdami sukurti kokybišką svetainę, yra daug galimybių. Daugiausia dėmesio skirsime žiniatinklio programavimui naudojant HTML.

Kas yra HTML

HTML reiškia hiperteksto žymėjimo kalbą. Išvertus iš anglų kalbos, tai reiškia „hiperteksto žymėjimo kalba“.

Kitaip tariant, HTML yra kodų rinkinys, su kuriuo galite sukurti pagrindinius svetainės elementus, jos rėmelį, pvz.kaip žodžiai susideda iš sakinių.

HTML kodai rašomi tik lotyniškomis raidėmis ir vadinami žymomis, o kiekvienas kodas yra kampiniuose skliaustuose. Kai kurios žymos susietos, kai kurios nesusietos.

Suporuotas reiškia, kad jie turi būti naudojami poromis. Pavyzdžiui, pradžios žyma nurodo, kur ji prasideda tinklalapyje, o baigiamoji žyma nurodo, kur ji sustoja. Pastarasis nuo pirmojo skiriasi tuo, kad po atidarymo kampinio skliausto yra pasvirasis brūkšnys. Pavyzdžiui, yra pradžios žyma,yra baigiamoji žyma.

Nesusietoms žymoms partnerio nereikia.

Daugelis žymų gali turėti atributų – papildomų elementų, suteikiančių konkretesnę reikšmę. Pavyzdžiui, žyma.

interneto svetainės dizainas
interneto svetainės dizainas

Kur naudojamas HTML

Klasikinis supratimas, kur reikia HTML, yra svetainių kūrimas.

Praktiškai to gali pakakti, nes HTML leidžia kurti pagrindinius svetainės elementus, meniu (įskaitant kelių lygių), nustatyti foną, įterpti tekstą, vaizdus, garsą, vaizdo įrašą, redaguoti šriftus ir daug daugiau.

Tačiau yra ir kitų kalbų, kurios leidžia į tinklalapį įtraukti įdomesnių ir dažnai reikalingų elementų:

  • CSS nustato stilius visai svetainei, nereikia nuolat nurodyti atskirų elementų stiliaus ypatybių naudojant žymas – pavyzdžiui, teksto spalvą ir šriftą.
  • Scenarijų kalba leidžia kurti ir svetainėje įterpti mini programas (scenarijus), pradedant nuobanalių estetinių dalykų (nuorodos spalvos keitimas užvedus pelę) ir baigiant funkciniais (klientų el. pašto adresų, telefono numerių rinkimas).
  • Naudodami PHP galite sukurti savo svečių knygą arba komentavimo sistemą.

Be to, HTML naudojamas kuriant platinimo el. laiškus.

Interneto adresų sąrašas
Interneto adresų sąrašas

Kas yra nuoroda

Jie leidžia pereiti į kitą tinklalapį tiek svetainėje, tiek išorėje.

Dažnai naudojamos HTML nuorodos:

  • Norėdami pereiti prie išorinio žiniatinklio š altinio.
  • Norėdami pereiti per svetainės puslapius.
  • Norėdami eiti į „Google“formas.

Taip pat dažnai nurodoma nuoroda į š altinį HTML, ypač todėl, kad kopijuodami medžiagą iš kitos svetainės turite nurodyti autorių. Priešingu atveju kopijavimas be priskyrimo gali patekti į autorių teisių pažeidimo, turinio vagystės ir neigiamo poveikio apibrėžimus. Be to, naudojant skolintą, neunikalią medžiagą sumažėja SEO našumas, o nurodant nuorodą į š altinį sumažėja rizika.

Nuorodų tipai

Klasikine prasme nuoroda yra žiniatinklio š altinio, kurį galite pasiekti spustelėję, adresas.

nuorodų tipai
nuorodų tipai

Be to, yra hipersaitų: tekstas ir vaizdai. Tokiais atvejais HTML nuoroda yra „paslėpta“po kokiu nors sakiniu (žodžiu) ar vaizdu, o norint ja sekti, reikia spustelėti tekstą ar paveikslėlį.

Kiti nuorodų tipai:

  • Nelankyta – nuoroda, kuri dar nebuvo paspausta tam tikro seanso metu. Pavyzdžiui, jei vakar naudojote šią nuorodą, tada išjungėte kompiuterį ir šiandien vėl įjungėte, dabar nuoroda vėl nelankyta, nes prasidėjo nauja sesija.
  • Aktyvus – šioje būsenoje nuoroda išsaugoma labai trumpą laiką: intervalą nuo nuorodos spustelėjimo iki jos sekimo.
  • Aplankyta – nuoroda, kuri jau buvo aplankyta bent kartą per vieną seansą.

Naudojant įprastas teksto nuorodas, aplankytų nuorodų spalva paprastai keičiasi, jei nenurodyta kitaip.

Hipersaito vaizdas nepakeičia jo išvaizdos, nesvarbu, ar jis lankomas, ar ne.

Kaip įterpti įprastą nuorodą

Daugelis žiniatinklio išteklių suvokia svetainės adresą kaip nuorodą, iš karto paverčia jį spustelėti ir paryškina spalva. Pavyzdžiui, jei adresas išsiųstas per „messenger“arba el. paštu, jį spustelėję galite patekti į svetainę.

Jei patys kuriate svetainę naudodami HTML, turite įterpti nuorodą naudodami specialią žymą. Tai atrodys taip: svetainės adresas. Nuorodos tekstas HTML turi būti nurodytas visas su protokolu.

Kaip įterpti teksto hipersaitą

Anksčiau buvo pasakyta, kad tekstinė hipersaitas atlieka tą pačią funkciją kaip ir įprasta nuoroda, tačiau atrodo estetiškiau: vietoje svetainės adreso, kuris dažnai būna be reikalo ilgas, nurodomas žodis ar frazė. Pavyzdžiui, sakinyje „Ieškokite informacijos čia“galite paslėpti nuorodąžodis „čia“. Jis bus paryškintas ir jį spustelėjus vartotojas nukreipiamas į norimą svetainę.

įterpiant hipersaitą
įterpiant hipersaitą

Kaip sukurti HTML nuorodą, jau buvo aptarta anksčiau. Galite įterpti teksto hipersaitą naudodami tą pačią žymą. Vienintelis skirtumas yra tas, kad tarp žymų turite nurodyti tekstą, po kuriuo nuoroda bus paslėpta: matomas tekstas.

Kaip įterpti vaizdo hipersaitą

Čia šiek tiek sudėtingiau. Naudojame tą pačią žymą, bet vietoj teksto turite nurodyti kelią į vaizdą.

Kelias yra vaizdo vieta. Jei paveikslėlis (nuotrauka) yra failų dalijimosi paslaugoje, tada pasviruoju brūkšniu turite nurodyti visus aplankus, esančius kelyje į vaizdą. Jei įmanoma, taip pat galite įtraukti nuorodą į vaizdą.

Pažymėti

be src, galioja ir kiti atributai, leidžiantys reguliuoti vaizdo aukštį, plotį, vietą ir dar daugiau. Kai kurie iš jų:

  • Src – nurodo kelią į vaizdą.
  • Lowsrc – identiškas ankstesniam atributui, bet nurodytas žemos kokybės vaizdams.
  • Aukštis – nuotraukos aukštis.
  • Plotis – jo plotis.
  • Alt – vaizdo aprašymas. Užvedus pelės žymeklį ant nuotraukos ar paveikslėlio, iššoks šiame atribute nurodytas tekstas.
  • Border – nustato kraštinės aplink vaizdą storį.

Atributai nurodomi po žymos ir yra įtrauktijo sudėtis. Po atributo turi būti nurodyta jo reikšmė. Pavyzdžiui, atributams „aukštis“arba „plotis“(aukštis, plotis) nurodomas vaizdo tinklalapyje aukštis. Matavimo vienetas yra pikseliai, jei nenurodyta kitaip.

Atrodys taip: <a href="tinklalapio adresas"

. Šie atributai padės nustatyti tinkamą vaizdo dydį. Kraštinė padeda sukurti nematomą kraštelį aplink vaizdą.

sekant nuorodą
sekant nuorodą

Aukščiau pateikti atributai taikomi atskirai vaizdo įterpimo žymai. Pavyzdžiui:.

Kas yra inkaro nuorodos

Inkaro nuorodų kūrimas yra labai naudingas įgūdis. Dažnai viename puslapyje reikia išdėstyti tinklalapį su ilgu teksto bloku arba keliais poskyriais. Tokiu atveju galite iš karto pradėti nuo nuorodų į teksto ar tinklalapio poskyrius sąrašo, o jas spustelėjus vartotojas pateks tiesiai į pageidaujamą skyrių.

Kuriant inkarines nuorodas reikės naudoti daugiau atributų žymų nei kuriant kitų tipų nuorodas.

nuorodos inkaras
nuorodos inkaras

Pirma, turite nustatyti bendrą kiekvieno informacijos bloko ar teksto poskyrio vertę naudodami atributą top, o tada susieti jį su atitinkama nuoroda.

Jų funkcijos yra platesnės, todėl patartina iš pradžių įsisavinti paprastesnių nuorodų kūrimą, o tada pereiti prie inkarinių nuorodų formavimo.

Patarimai

Įvairių informacijos blokų talpinimas tinklalapyje
Įvairių informacijos blokų talpinimas tinklalapyje

Patyrusių pagalbaprogramuotojai:

  • Galite padaryti taip, kad informacija apie nuorodą būtų rodoma užvedus pelės žymeklį HTML. Tam gali praversti alt atributas, kurį taip pat naudojame grafiniams elementams.
  • Galima sudaryti nuorodų sąrašą naudojant HTML. Visų pirma tai gali būti naudinga surišant nuorodas, taip pat kai reikia sudaryti žiniatinklio išteklių sąrašą, po kurio gali būti nuoroda tiesiai iš dabartinio tinklalapio.
  • Naudodami CSS ir JavaScript, taip pat kai kurias HTML funkcijas, galite sukurti kitokį tekstinių nuorodų ir hipersaitų dizainą nei įprastai. Pavyzdžiui, užvedus pelės žymeklį virš nuorodos, ji gali pakeisti spalvą ir grįžti į ankstesnę, kai žymeklis yra toli nuo jos. Tai galima padaryti naudojant pasirinktinį JavaScript scenarijų. Be to, nuorodos spalvą galima nustatyti į kitą, o ne mėlyną (nelankytam) arba violetinę (lankytam). Tai CSS darbas.
  • Nepiktnaudžiaukite nuorodomis. Tinklalapis, kuriame yra daug netinkamų nuorodų, atrodo netvarkingai ir aplamai.
  • Įsitikinkite, kad naudotojas supranta, kad hipersaitas su vaizdu tikrai yra vaizdas, o ne tik vaizdas.

Išvada

Labai lengva susieti puslapį su HTML. Svarbu laikytis visų pagrindinių šios kalbos punktų, nes net ir nedidelė klaida gali lemti tai, kad rezultato nebus ir kodas neveiks.

Rekomenduojamas: