Kurs Web Essentials with HTML & CSS
Ovaj kurs pruža polaznicima temeljno razumevanje osnovnih tehnologija koje čine osnovu svakog sajta – HTML i CSS. Polaznici uče kako da pravilno strukturišu web stranice pomoću HTML-a, dodaju multimedijalni sadržaj, linkove i forme, kao i da stilizuju stranice korišćenjem CSS-a. Kurs pokriva osnovne i napredne CSS koncepte, uključujući boje, tipografiju, grupisanje elemenata, box model i Flexbox, čime se razvijaju veštine izrade vizuelno uređenih i funkcionalnih statičkih web stranica.
Zanima vas ovaj kurs? | Možete ga pohađati u okviru ovih ITAcademy programa: Web Design with AI. |
Cilj kursa je da polaznici steknu praktične veštine izrade statičkih web stranica kombinovanjem HTML-a i CSS-a, razumeju osnovne principe rada weba, uključujući domene, HTTP protokol, funkcije browsera i web servera, i nauče kako da koriste alate poput Notepad++ i Chrome DevTools. Nakon kursa, polaznici će biti sposobni da kreiraju estetski i funkcionalno kvalitetne stranice, uključujući jednostavne e-commerce sajtove sa navigacijom, slikama, tekstom, dugmadima i kontakt formama.
Kurs Web Essentials with HTML & CSS će vam odgovoriti na pitanja:
1. Šta je HTML i zašto je on temelj svakog sajta?
Ako zamislite web stranicu kao kuću, HTML je njen skelet – zidovi, podovi i krov. On daje osnovnu strukturu svemu što vidimo na internetu. Bilo da pravite blog, online novine ili e-commerce prodavnicu, HTML – HyperText Markup Language – jeste prvi jezik koji određuje šta će se prikazati korisniku: naslovi, pasusi, slike, linkovi i forme.
Pojam HyperText označava način na koji su stranice povezane linkovima, dok Markup Language znači da se sadržaj označava posebnim tagovima koji objašnjavaju browseru kako da ga prikaže. Kada kliknete na dugme Dodaj u korpu na sajtu, HTML je taj koji određuje da to dugme uopšte postoji. Na kursu Web Essentials with HTML & CSS naučićete kako HTML gradi temelje svake stranice i zašto je njegovo razumevanje prvi korak ka ozbiljnom bavljenju web razvojem.
2. Šta su HTML elementi i zašto su oni važni za interakciju sa korisnikom?
HTML se sastoji od elemenata – to su gradivni blokovi kojima definišemo šta se gde nalazi na stranici. Postoje elementi za prikaz teksta, za umetanje slika i video-sadržaja, za pravljenje lista i tabela, kao i posebni elementi za kreiranje formi.
Zašto su forme važne? Zato što su one mesto gde korisnik komunicira sa sajtom. Kada kupac unese svoju adresu ili broj kartice, on zapravo koristi HTML formu. Kada vrši pretragu proizvoda ili ostavlja komentar – opet je reč o formi.
Na kursu ćete proći kroz sve osnovne HTML elemente, od najjednostavnijih do složenih, i videćete kako se oni kombinuju u jednu funkcionalnu celinu. Biće reči i o tome kako forme čine osnovu svake online prodavnice i kako se pomoću njih omogućava komunikacija sa korisnikom.
3. Šta je CSS i kako on donosi život web stranici?
Ako je HTML skelet stranice, CSS je ono što joj daje stil, boju i karakter. CSS (Cascading Style Sheets) određuje vizuelni identitet sajta – od izbora fontova i boja, do rasporeda elemenata i efekata pri prelasku mišem.
Zamislite da otvorite e-commerce sajt na kojem je sve samo crni tekst na beloj pozadini. Stranica funkcioniše, ali nije privlačna. Upravo CSS transformiše tu osnovu u profesionalnu prodavnicu: proizvodi dobijaju pregledne kartice, navigacija je jasno istaknuta, dugmad za kupovinu imaju boju koja poziva na akciju.
Na kursu ćete naučiti kako da razdvojite sadržaj (HTML) i prezentaciju (CSS), što olakšava održavanje sajta i omogućava da isti sadržaj dobije potpuno različit izgled uz samo par linija koda.

4. Kako funkcionišu CSS selektori i šta oni omogućavaju?
Selektori su srce CSS-a. Oni određuju na koga se pravila primenjuju. Možete odabrati sve naslove, samo određene linkove ili konkretan deo stranice, i za njih postaviti boje, fontove ili dimenzije. U praksi to znači da lako možete napraviti pravilo kojim se određuje da će svi naslovi proizvoda biti iste veličine, a dugmad Dodaj u korpu uvek imati istu boju i oblik. Što preciznije koristite selektore, to ćete brže i efikasnije kontrolisati izgled sajta.
Na kursu ćete upoznati osnovne i naprednije tipove selektora – od onih koji biraju elemente po imenu, do onih koji targetiraju elemente u odnosu na njihov položaj ili klasu. Vežbaćete na realnim primerima, gde ćete naučiti da upravljate složenim stranicama sa mnoštvom elemenata.
5. Šta je CSS box model i zašto ga mora poznavati svaki web developer?
Svaki element na stranici – bilo da je to dugme, slika ili blok teksta – ponaša se kao kutija. Ta kutija ima unutrašnji prostor (padding), ivicu (border), spoljašnji razmak (margin) i dimenzije (width i height). To je čuveni box model.
Razumevanje ovog modela ključno je za pravljenje urednih rasporeda. Na primer, želite da kartice proizvoda na stranici imaju isti razmak i da izgledaju simetrično. Ako ne znate kako padding i margin funkcionišu, rezultat vašeg truda može biti neuredan, neusklađen izgled. Na kursu ćete detaljno savladati box model i naučiti kako da ga koristite kako bi stranica izgledala i funkcionisala profesionalno, pregledno i optimizovano za korisnike.
6. Kako se gradi raspored (layout) stranice?
Dobro organizovan raspored elemenata čini razliku između amaterskog i profesionalnog sajta. Nije dovoljno da sadržaj postoji – on mora biti raspoređen na način koji korisniku olakšava navigaciju i kupovinu.
CSS nudi različite tehnike za kreiranje layouta: od jednostavnog pozicioniranja i float svojstva, do savremenih metoda koje se koriste u modernom razvoju. Kada kombinujete ove pristupe sa HTML elementima za grupisanje (div, span), dobijate potpunu kontrolu nad izgledom stranice. Na kursu ćete, korak po korak, učiti kako da napravite prvi funkcionalni layout – od raspoređivanja osnovnih sekcija sajta, do finalizovanja stranice proizvoda koja izgleda jasno i privlačno.
7. Kako se stilizuju osnovni elementi sajta?
Naslovi, tabele, liste, linkovi, forme – svi oni čine osnovne delove jedne web stranice. Njihova stilizacija čini da sajt izgleda dosledno, profesionalno i vizuelno privlačno. Na kursu ćete vežbati kako da stilizujete tekst tako da bude čitljiv i uočljiv, kako da liste kategorija izgledaju pregledno, kako da forme za unos podataka budu jasne i jednostavne za korišćenje i kako da slike i multimedija budu lepo uklopljeni u dizajn.
Kroz praktične primere iz e-commerce konteksta naučićete da kreirate stranicu proizvoda koja kombinuje sve ove elemente: naslov, sliku, cenu, tabelu sa karakteristikama i dugme za kupovinu – sve u stilu koji motiviše korisnika da ostane i kupi.
Plan i program kursa Web Essentials with HTML & CSS
Modul 1 – Osnove HTML-a: Struktura, sadržaj i multimedija
- Uvod u HTML
- HTML elementi
- Osnovna struktura HTML dokumenta
- HTML elementi za formatiranje teksta
- Redovi i razmaci
- Entiteti i jezici u HTML-u
- Liste
- Tabele
- Linkovi
- Slike
- Multimedija
Modul 2 – Interakcija sa korisnikom: Forme u HTML-u
- Forme
- HTML input elementi: Vrata interakcije sa korisnikom
- Input elementi: Više od teksta i lozinke
- Non-input elementi forme
Modul 3 – Temelji CSS-a: Stil, prostor i struktura
- Čarolija stilova: Kako CSS oblikuje web stranice
- Osnovni CSS selektori: Kako precizno stilizovati elemente
- Selektori zasnovani na relacijama
- CSS box model – width i height
- CSS box model – borders
- CSS box model – padding
- CSS box model – margin
Modul 4 – Osnove web dizajna: Od rasporeda do stila
- Osnove raspoređivanja HTML elemenata
- Elementi za grupisanje
- Kreiranje prvog layouta
- Pozicioniranje elemenata – svojstvo position
- Pozicioniranje elemenata – svojstva float i clear
- Dodatna CSS svojstva koja utiču na tok HTML elemenata
- Boje na webu
- Stilizovanje teksta
- Stilizovanje slika
- Stilizovanje lista
- Stilizovanje tabela
- Kompetencije
Modul 1 – Osnove HTML-a: Struktura, sadržaj i multimedija
Polaznici razumeju osnovne koncepte HTML-a i svrhu ovog jezika u kreiranju web stranica. Prepoznaju osnovne komponente web okruženja i razumeju osnovne pojmove u vezi sa internetom, uključujući razliku između web sajtova i web aplikacija.
Polaznici umeju da kreiraju validan HTML dokument sa osnovnom strukturom i koriste naslove, paragrafe, liste i tabele za organizaciju sadržaja.
Polaznici znaju da formatiraju tekst u HTML-u i upravljaju razmacima, redovima i specijalnim karakterima koristeći odgovarajuće HTML elemente i entitete.
Polaznici znaju da dodaju i koriste linkove, slike i multimedijalni sadržaj (audio i video) na stranicama.
Modul 2 – Interakcija sa korisnikom: Forme u HTML-u
Polaznici razumeju ulogu HTML formi u interakciji sa korisnikom i koriste osnovne i napredne input elemente (tekst, lozinku, checkbox, radio, select, textarea) za prikupljanje podataka.
Polaznici primenjuju non-input elemente forme, uključujući
Polaznici kreiraju funkcionalne stranice za registraciju i kontakt forme sa pravilno strukturiranim poljima i dugmadima za slanje.
Polaznici kombinuju naučene elemente kako bi pravili pregledne i interaktivne web forme.
Modul 3 – Temelji CSS-a: Stil, prostor i struktura
Polaznici razumeju kako CSS oblikuje web stranice i primenjuju osnovne i relacione selektore za ciljanje elemenata.
Polaznici koriste CSS box model za definisanje širine i visine elemenata.
Polaznici primenjuju border, padding i margin kako bi kontrolisali prostor i izgled elemenata.
Modul 4 – Osnove web dizajna: Od rasporeda do stila
Polaznici razumeju osnovne metode raspoređivanja HTML elemenata i primenjuju različita CSS svojstva za kontrolu toka elemenata, uključujući position, float i clear.
Polaznici koriste HTML elemente za grupisanje i kreiraju osnovne layoute stranica, kombinujući blokove sadržaja u pregledne sekcije.
Polaznici primenjuju boje, fontove, stilove teksta; stilizuju slike, liste i tabele kako bi postigli vizuelnu hijerarhiju i estetiku stranice.
Polaznici kombinuju raspored i stilizaciju da bi kreirali konzistentne i funkcionalne e-commerce stranice, uključujući home, prikaz više proizvoda, stranicu jednog proizvoda, login formu i korpu.
Potrebno predznanje
Za razumevanje ovog kursa nije potrebno nikakvo predznanje.
Potreban softver i tehnički uslovi
Za ovaj kurs nije potreban nikakav softver osim platforme za učenje koju DL polaznici imaju na raspolaganju i mogu joj pristupiti putem različitih uređaja.
3 načina da dobijete odlično plaćen posao
Spremili smo dokument koji otkriva tri pouzdana načina za dolazak na dobro plaćenu poziciju za stručan rad sa računarima. Preuzmite izveštaj ovde.
Da li ima mesta? Upisni rok 2025/26. je otvoren.
Da saznate sve o upisu, kliknite ovde.
Prijavite se