Kā izveidot saiti HTML?

Satura rādītājs:

Kā izveidot saiti HTML?
Kā izveidot saiti HTML?
Anonim

Tīmekļa vietnes, emuāri, tīmekļa lapas - mūsu laikā jau pazīstami jēdzieni. Attīstoties internetam, tīmekļa lapu mitināšanas vietnes ir kļuvušas neticami populāras, un tas nav pārsteidzoši: dažiem cilvēkiem sava vietne ir nepieciešamība, citiem tā ir patīkama izklaide. Pirmajā gadījumā mēs parasti runājam par firmām, korporācijām, privātuzņēmējiem, kad tie reklamē jebkuru pieprasītu produktu vai pakalpojumu. Otrais ir par emuāru autoriem.

Papildus tam ir interneta lietotāji, kuri vienkārši meklē informāciju, lasa emuārus, skatās video un tā tālāk.

Lai izveidotu kvalitatīvu vietni, ir daudz iespēju. Mēs koncentrēsimies uz tīmekļa programmēšanu, izmantojot HTML.

Kas ir HTML

HTML apzīmē hiperteksta iezīmēšanas valodu. Tulkojumā no angļu valodas tas nozīmē "hiperteksta iezīmēšanas valoda".

Citiem vārdiem sakot, HTML ir kodu kopums, ar kuru palīdzību var izveidot vietnes galvenos elementus, tās rāmi, piemēram,kā vārdus veido teikumi.

HTML kodi ir rakstīti tikai ar latīņu burtiem un tiek saukti par tagiem, un katrs kods ir ievietots leņķiekavās. Dažas atzīmes ir savienotas pārī, dažas nav savienotas pārī.

Sapārots nozīmē, ka tie bez kļūmēm ir jāizmanto pa pāriem. Piemēram, sākuma tags norāda, kur tas sākas tīmekļa lapā, un beigu tags norāda, kur tas beidzas. Pēdējais no pirmā atšķiras ar slīpsvītras zīmi pēc atvēršanas leņķa kronšteina. Piemēram, ir sākuma atzīme,ir beigu atzīme.

Nepāra tagiem nav nepieciešams partneris.

Daudziem tagiem var būt atribūti - papildu elementi, kas piešķir tam specifiskāku nozīmi. Piemēram, tags.

Web dizains
Web dizains

Kur tiek izmantots HTML

Klasiskā izpratne par to, kur ir nepieciešams HTML, ir vietņu veidošana.

Praksē ar to var pietikt, jo HTML ļauj izveidot vietnes galvenos elementus, izvēlnes (tostarp daudzlīmeņu), iestatīt fonu, ievietot tekstu, attēlus, audio, video, rediģēt fontus un vēl daudz vairāk.

Tomēr ir arī citas valodas, kas ļauj tīmekļa lapai pievienot interesantākus un bieži vien nepieciešamos elementus:

  • CSS iestata stilus visai vietnei bez nepieciešamības pastāvīgi noteikt atsevišķu elementu stila iezīmes, izmantojot tagus, piemēram, teksta krāsu un fontu.
  • Skriptu valoda ļauj vietnē izstrādāt un iegult miniprogrammas (skriptus), sākot nobanālas estētiskas lietas (saites krāsas maiņa, virzot kursoru virsū) un beidzot ar funkcionālām (klientu e-pasta adrešu, tālruņu numuru ievākšana).
  • Ar PHP jūs varat izveidot savu viesu grāmatu vai komentēšanas sistēmu.

Arī HTML tiek izmantots, veidojot e-pastus izplatīšanai.

interneta adresātu saraksts
interneta adresātu saraksts

Kas ir saite

Tie ļauj jums pāriet uz citu tīmekļa lapu gan vietnē, gan ārpus tās.

Parasti tiek izmantotas HTML saites:

  • Lai pārietu uz ārēju tīmekļa resursu.
  • Lai pārvietotos pa vietnes lapām.
  • Lai atvērtu Google veidlapas.

Bieži tiek norādīta arī saite uz avotu HTML valodā, jo īpaši tāpēc, ka, kopējot materiālu no citas vietnes, ir jānorāda autors. Pretējā gadījumā uz kopēšanu bez attiecinājuma var attiekties autortiesību pārkāpuma, satura zādzības un pretēja rezultāta definīcijas. Turklāt aizņemtu, neunikālu materiālu izmantošana samazina SEO veiktspēju, un saites uz avotu norādīšana samazina riskus.

Saišu veidi

Klasiskā izpratnē saite ir tīmekļa resursa adrese, uz kuru varat doties, noklikšķinot uz tās.

saišu veidi
saišu veidi

Papildus tam ir hipersaites: teksts un attēli. Šādos gadījumos HTML saite tiek "paslēpta" zem kāda teikuma (vārda) vai attēla, un, lai tai sekotu, ir jānoklikšķina uz teksta vai attēla.

Cita veida saites:

  • Neapmeklēts - saite, uz kuras konkrētas sesijas laikā vēl nav noklikšķināts. Piemēram, ja vakar izmantojāt šo saiti, pēc tam izslēdzāt datoru un šodien atkal to ieslēdzāt, tagad saite atkal nav apmeklēta, jo ir sākusies jauna sesija.
  • Aktīvs - šajā stāvoklī saite tiek saglabāta ļoti īsu laiku: intervāls starp noklikšķināšanu uz saites un sekošanu tai.
  • Apmeklēts - saite, kas jau ir apmeklēta vismaz vienu reizi vienas sesijas laikā.

Parastām teksta saitēm apmeklētajām ir tendence mainīt krāsu, ja vien nav norādīts citādi.

Attēls ar hipersaiti nemaina tā izskatu neatkarīgi no tā, vai tas tiek apmeklēts vai nē.

Kā ievietot parastu saiti

Daudzi tīmekļa resursi vietnes adresi uztver kā saiti, nekavējoties padara to klikšķināmu un izceļ to ar krāsu. Piemēram, ja adrese ir nosūtīta messengerā vai pa e-pastu, noklikšķinot uz tās, varat doties uz vietni.

Ja vietni veidojat pats, izmantojot HTML, jums ir jāievieto saite, izmantojot īpašu tagu. Tas izskatīsies šādi: vietnes adrese. Saites teksts HTML ir jānorāda pilnībā, izmantojot protokolu.

Kā ievietot teksta hipersaiti

Iepriekš tika teikts, ka teksta hipersaite pilda to pašu funkciju kā parasta saite, taču izskatās estētiskāk: vietnes adreses vietā, kas bieži vien ir nevajadzīgi gara, tiek norādīts vārds vai frāze. Piemēram, teikumā "Meklējiet informāciju šeit" varat paslēpt saitivārdu "šeit". Tas tiks iezīmēts, un, noklikšķinot uz tā, lietotājs tiks novirzīts uz vajadzīgo vietni.

ievietojot hipersaiti
ievietojot hipersaiti

Kā izveidot HTML saiti, jau tika apspriests iepriekš. Varat ievietot teksta hipersaiti, izmantojot to pašu tagu. Vienīgā atšķirība ir tā, ka starp tagiem ir jānorāda teksts, zem kura saite tiks paslēpta: redzams teksts.

Kā ievietot attēla hipersaiti

Šeit ir nedaudz sarežģītāk. Mēs izmantojam to pašu tagu, taču teksta vietā ir jānorāda ceļš uz attēlu.

Ceļš ir attēla atrašanās vieta. Ja attēls (fotoattēls) atrodas failu koplietošanas pakalpojumā, tad visas mapes, kas atrodas ceļā uz attēlu, ir jānorāda ar slīpsvītru. Ja iespējams, varat iekļaut arī saiti uz attēlu.

Lai atzīmētu

Papildus src ir piemērojami arī citi atribūti, kas ļauj pielāgot attēla augstumu, platumu un atrašanās vietu un daudz ko citu. Daži no tiem:

  • Src - norāda ceļu uz attēlu.
  • Lowsrc - identisks iepriekšējam atribūtam, taču norādīts zemas kvalitātes attēliem.
  • Augstums - attēla augstums.
  • Platums - tā platums.
  • Alt - attēla apraksts. Novietojot kursoru virs fotoattēla vai attēla, tiks parādīts šajā atribūtā norādītais teksts.
  • Robeža - nosaka attēla apmales biezumu.

Atribūti tiek norādīti aiz taga un ir iekļautitā sastāvs. Atribūtam ir jāseko tā vērtībai. Piemēram, atribūtiem "height" vai "width" (augstums, platums) norāda attēla augstumu tīmekļa lapā. Mērvienība ir pikseļi, ja vien nav norādīts citādi.

Tas izskatīsies šādi: <a href="tīmekļa lapas adrese"

. Šie atribūti palīdzēs iestatīt attēlam atbilstošu izmēru. Apmale palīdz attēlam izveidot neredzamu apmali.

sekojot saitei
sekojot saitei

Iepriekš minētie atribūti attiecas atsevišķi uz attēla ievietošanas tagu. Piemēram:.

Kas ir enkura saites

Enkura saišu izveide ir ļoti noderīga prasme. Bieži vien ir nepieciešams izkārtot tīmekļa lapu ar garu teksta bloku vai ar vairākām apakšsadaļām vienā lapā. Šajā gadījumā jūs varat nekavējoties sākt ar saišu sarakstu uz teksta vai tīmekļa lapas apakšsadaļām, un, noklikšķinot uz tām, lietotājs pāriet tieši uz pieprasīto sadaļu.

Lai izveidotu enkura saites, būs vairāk jāizmanto atribūtu tagi nekā cita veida saitēm.

saites enkurs
saites enkurs

Vispirms ir jāiestata kopējā vērtība katram informācijas blokam vai teksta apakšsadaļām, izmantojot atribūtu top, un pēc tam jāsaista tas ar atbilstošo saiti.

To funkcijas ir plašākas, tāpēc ieteicams vispirms apgūt vienkāršāku saišu izveidi un pēc tam pāriet uz enkura saišu veidošanu.

Padomi

Dažādu informācijas bloku izvietošana tīmekļa lapā
Dažādu informācijas bloku izvietošana tīmekļa lapā

Pieredzējušu palīdzībaprogrammētāji:

  • Varat izveidot tā, lai informācija par saiti tiktu rādīta, novietojot kursoru HTML formātā. Šim nolūkam var noderēt alt atribūts, ko izmantojam arī grafiskajiem elementiem.
  • Ir iespējams izveidot saišu sarakstu, izmantojot HTML. Jo īpaši tas var būt noderīgi enkura saitēm, kā arī tad, kad ir jāizveido tīmekļa resursu saraksts, kam var sekot saite tieši no pašreizējās tīmekļa lapas.
  • Ar CSS un JavaScript, kā arī dažu HTML funkciju palīdzību jūs varat izveidot atšķirīgu teksta saišu un hipersaišu dizainu nekā parasti. Piemēram, virzot kursoru virs saites, tā var mainīt tās krāsu un atgriezties pie iepriekšējās, kad kursors atrodas prom no tās. To var izdarīt ar pielāgotu JavaScript skriptu. Turklāt saites krāsu var iestatīt uz kaut ko citu, nevis zilu neapmeklētajam vai violetu apmeklētajam. Tas ir CSS darbs.
  • Nelietojiet saites ļaunprātīgi. Tīmekļa lapa ar daudzām nepiemērotām saitēm izskatās aplieta un aplieta.
  • Pārliecinieties, vai lietotājs saprot, ka hipersaite ar attēlu patiešām ir attēls, nevis tikai attēls.

Secinājums

Ir ļoti vienkārši izveidot saiti uz lapu HTML formātā. Ir svarīgi ievērot visus šīs valodas galvenos punktus, jo pat neliela kļūda var novest pie tā, ka rezultāts nebūs un kods nedarbosies.

Ieteicams: