Web stranice, blogovi, web stranice - već poznati koncepti u naše vrijeme. S razvojem interneta, stranice za hosting web stranica postale su nevjerojatno popularne, a to nije iznenađujuće: za neke je posjedovanje vlastite web stranice nužnost, za druge ugodna zabava. U prvom slučaju obično govorimo o tvrtkama, korporacijama, privatnim poduzetnicima, kada oglašavaju bilo koji proizvod ili uslugu traženi. Drugi je o blogerima.
Osim ovoga, postoje korisnici interneta koji jednostavno traže informacije, čitaju blogove, gledaju videozapise i tako dalje.
Za izradu kvalitetne web stranice postoji mnogo opcija. Usredotočit ćemo se na web programiranje putem HTML-a.
Što je HTML
HTML je kratica za Hyper Text Mark-Up Language. Prevedeno s 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 napisani su isključivo latiničnim slovima i nazivaju se oznakama, a svaki kod je zatvoren u kutnim zagradama. Neke su oznake uparene, neke neuparene.
Upareno znači da se moraju koristiti u parovima 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 iza kutne zagrade otvaranja. 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.
Gdje se koristi HTML
Klasično razumijevanje gdje je HTML potreban je izrada web stranice.
U praksi bi to moglo biti dovoljno, budući da HTML omogućuje stvaranje glavnih elemenata stranice, izbornika (uključujući i one na više razina), postavljanje pozadine, umetanje teksta, slika, audio, video, uređivanje fontova i još mnogo toga.
Međutim, postoje i drugi jezici koji vam omogućuju dodavanje zanimljivijih i često potrebnih elemenata na web stranicu:
- CSS postavlja stilove za cijelu web-lokaciju bez potrebe za stalnim propisivanjem stilskih značajki pojedinačnih elemenata koristeći oznake - boju i font teksta, na primjer.
- Jezik skripte omogućuje vam da razvijete i ugradite mini-programe (skripte) na web-mjesto, u rasponu odbanalne estetske stvari (promjena boje linka pri prelasku miša) i završavaju s funkcionalnim (prikupljanje adresa e-pošte korisnika, telefonskih brojeva).
- S PHP-om možete razviti vlastitu knjigu gostiju ili sustav komentiranja.
Također se HTML koristi u kreiranju e-pošte za distribuciju.
Što je veza
Omogućuju vam navigaciju do druge web stranice, unutar stranice i vanjske.
HTML veze se obično koriste:
- Za odlazak na vanjski web resurs.
- Za kretanje kroz stranice unutar stranice.
- Da biste otišli na google obrasce.
Također je često naznačena poveznica na izvor u HTML-u, pogotovo zato što pri kopiranju materijala s druge stranice morate navesti autora. Inače, kopiranje bez navođenja atribucije 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 veza
U klasičnom smislu, veza je adresa web-resursa na koji možete otići klikom na nju.
Osim ovoga, postoje hiperveze: tekst i slike. U tim slučajevima, HTML poveznica je "skrivena" ispod neke rečenice (riječi) ili slike, a da biste je pratili potrebno je kliknuti na tekst ili sliku.
Druge vrste veza:
- Neposjećeno - veza na koju još niste kliknuli tijekom određene sesije. Na primjer, ako ste jučer slijedili ovu vezu, a zatim isključili svoje računalo i ponovo ga uključili danas, sada je veza ponovno neposjećena jer je započela nova sesija.
- Aktivan - u ovom stanju, veza se sprema vrlo kratko vrijeme: interval između klikanja na vezu i njenog praćenja.
- Posjećeno - veza koja je već posjećena barem jednom tijekom jedne sesije.
Za obične tekstualne veze, posjećene obično mijenjaju boju osim ako nije drugačije navedeno.
Slika s hipervezom ne mijenja svoj izgled, bez obzira da li je posjećena ili ne.
Kako umetnuti običnu vezu
Mnogi web-resursi percipiraju adresu web-mjesta kao vezu, odmah je čine klikabilnom i naglašavaju je bojom. Na primjer, ako je adresa poslana u messengeru ili e-mailom, klikom na nju možete otići na stranicu.
U slučaju da sami kreirate web stranicu pomoću HTML-a, morate umetnuti vezu pomoću posebne oznake. To će izgledati ovako: adresa web stranice. Tekst veze u HTML-u mora biti naveden u cijelosti, s protokolom.
Kako umetnuti tekstualnu hipervezu
Ranije je rečeno da tekstualna hiperveza ima istu funkciju kao i obična poveznica, ali izgleda estetski ugodnije: umjesto adrese stranice, koja je često nepotrebno duga, navedena je riječ ili fraza. Na primjer, u rečenici "Potražite informacije ovdje" možete sakriti vezuriječ "ovdje". Bit će istaknut i klikom na nju korisnik će odvesti na željenu stranicu.
Kako napraviti HTML vezu već smo raspravljali ranije. Pomoću iste oznake možete umetnuti tekstualnu hipervezu. Jedina razlika je u tome što između oznaka trebate navesti tekst ispod kojeg će veza biti skrivena: vidljivi tekst.
Kako umetnuti hipervezu slike
Ovdje je malo kompliciranije. Koristimo istu oznaku, ali umjesto teksta morate navesti put do slike.
Putanja je mjesto slike. Ako se slika (fotografija) nalazi na servisu za dijeljenje datoteka, tada morate navesti sve mape duž puta do slike kroz kosu crtu. Također možete uključiti vezu na sliku ako je moguće.
Za označavanje
osim src-a, primjenjivi su i drugi atributi koji vam omogućuju podešavanje visine, širine i položaja slike i još mnogo toga. Neki od njih:
- Src - određuje put do slike.
- Lowsrc - identično prethodnom atributu, ali određeno za slike niske kvalitete.
- Visina - visina slike.
- Širina - njegova širina.
- Alt - opis slike. Kada zadržite pokazivač iznad fotografije ili slike, pojavit će se tekst naveden u ovom atributu.
- Border - određuje debljinu obruba oko slike.
Atributi su navedeni nakon oznake i uključeni su unjegov 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. Mjerna jedinica su pikseli, osim ako nije drugačije navedeno.
Izgledat će ovako: <a href="adresa web stranice"
. Ovi će atributi pomoći u postavljanju odgovarajuće veličine za sliku. Obrub pomaže u stvaranju nevidljivog obruba oko slike.
Navedeni atributi se primjenjuju zasebno na oznaku za umetanje slike. Na primjer:.
Što su sidrene veze
Stvaranje sidrenih veza vrlo je korisna vještina. Često postoji potreba za postavljanjem web stranice s dugim blokom teksta ili s nekoliko pododjeljaka na jednoj stranici. U tom slučaju možete odmah početi s popisom poveznica na pododjeljke teksta ili web stranice, a kada kliknete na njih, korisnik će ići izravno na traženi odjeljak.
Izrada sidrenih veza zahtijevat će više korištenja oznaka atributa nego druge vrste veza.
Prvo, trebate postaviti ukupnu vrijednost za svaki blok informacija ili pododjeljak teksta pomoću atributa top, a zatim ga povezati s odgovarajućom vezom.
Njihove značajke su opsežnije, stoga je preporučljivo prvo savladati stvaranje jednostavnijih poveznica, a zatim prijeći na formiranje sidrenih veza.
Savjeti
Pomoć iskusnihprogrameri:
- Možete napraviti tako da se informacije o poveznici prikazuju pri lebdenju u HTML-u. Za to nam može dobro doći atribut alt, koji također koristimo za grafičke elemente.
- Moguće je napraviti popis linkova koristeći HTML. Konkretno, ovo može biti korisno za sidrene veze, kao i kada trebate napraviti popis web resursa koji može biti praćen vezom izravno s trenutne web stranice.
- Uz pomoć CSS-a i JavaScripta, kao i nekih HTML funkcija, možete stvoriti drugačiji dizajn tekstualnih veza i hiperveza 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. To se može učiniti pomoću prilagođene JavaScript skripte. 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 veze. Web stranica s mnogo neprikladnih veza izgleda nemarno i nemarno.
- Uvjerite se da korisnik razumije da je hiperveza sa slikom zapravo slika, a ne samo slika.
Zaključak
Vrlo je lako povezati se na stranicu u HTML-u. Važno je slijediti sve glavne točke ovog jezika, jer čak i mala pogreška može dovesti do činjenice da neće biti rezultata, a kod neće raditi.
