Kako da napravite web sajt uz AI: veliki prompt korak po korak

Web sajt danas možete da napravite tako što ga opišete veštačkoj inteligenciji. Umesto da učite kod, alatu poput ChatGPT-a, Gemini-ja ili Claude-a date jedan detaljan zahtev, takozvani prompt, a ona vam vrati gotove stranice sa dizajnom, tekstom i kodom. Kvalitet rezultata skoro u potpunosti zavisi od toga koliko je prompt precizan. Kratak zahtev daje uopšten sajt kakav ima svako, a razrađen zahtev daje sajt koji izgleda kao da ga je radio profesionalac.

U ovom vodiču dobijate upravo takav, veliki prompt koji možete da kopirate i prilagodite svojoj firmi, plus jasno objašnjenje šta je hosting, šta je domen i kako da sajt na kraju bude živ na internetu. Pisano je za vlasnike malih i srednjih firmi i preduzetnike koji žele da sami naprave prvu verziju sajta, a da znaju i gde taj put ima granice.

Kako izrada web sajta uz AI zaista funkcioniše

Izrada sajta uz veštačku inteligenciju, koju mnogi zovu i vibe coding, svodi se na razgovor. Vi opisujete šta želite običnim rečima, a alat generiše HTML, CSS i po potrebi JavaScript, to jest kod od kog se sastoji svaka stranica. Ne morate da razumete taj kod da biste ga koristili, kao što ne morate da znate kako radi motor da biste vozili auto. Vaš posao je da jasno kažete šta firma radi, kome se obraća i kako želite da izgleda, a posao alata je da to pretvori u stranice.

Postoje tri načina da rezultat objavite. Prvi je da dobijete jedan HTML fajl koji sami okačite na hosting, i to je najbrži put za jednostavan sajt vizitkartu. Drugi je da AI napravi projekat koji se objavljuje preko servisa kao što su Cloudflare Pages ili Netlify, što je zgodno za nešto složeniji statični sajt. Treći je WordPress, koji ima smisla kada planirate blog, prodavnicu ili kada želite da sadržaj menjate sami kroz administraciju, bez ponovnog pisanja koda. Za većinu firmi koje žele da rastu, WordPress ostaje najfleksibilniji izbor, o čemu pišemo u vodiču za izradu sajta.

Šta da pripremite pre prvog prompta

Kvalitet sajta počinje pre nego što otvorite alat. Ako uđete nespremni, dobićete lep ali prazan okvir u koji tek treba da ubacite suštinu. Zato pre prvog prompta pripremite nekoliko stvari na papiru ili u dokumentu.

Prvo, jasno napišite čime se firma bavi u jednoj rečenici, tako da to razume neko ko vas prvi put čuje. Drugo, nabrojte tri do pet usluga ili proizvoda koje nudite, jer to postaju sekcije sajta. Treće, pripremite prave tekstove o firmi, jer AI ume da napiše pristojan tekst, ali samo vi znate zašto kupci biraju baš vas. Četvrto, odlučite koje boje i utisak želite, na primer ozbiljno i poslovno ili toplo i pristupačno. Peto, sakupite kontakt podatke, radno vreme i eventualne linkove ka društvenim mrežama. Kada sve to imate spremno, prompt prestaje da bude prazna forma i postaje precizna narudžbina.

Veliki prompt za izradu web sajta

Ovo je gotov prompt koji pokriva dizajn, strukturu, sadržaj, prilagođenost telefonu, pristupačnost, brzinu i osnovni SEO. Kopirajte ga u celini, a zatim zamenite delove u zagradama svojim podacima. Što tačnije popunite zagrade, to je sajt bliži onome što vam zaista treba.

Ti si iskusan veb dizajner i frontend programer. Napravi mi kompletan, moderan i profesionalan web sajt za moju firmu, u jednom HTML fajlu sa ugrađenim CSS-om i, ako je neophodno, malo JavaScript-a. Nemoj da koristiš spoljne biblioteke.

O FIRMI
Naziv: (naziv firme)
Delatnost: (čime se bavite, u jednoj rečenici)
Grad i tržište: (na primer Beograd i cela Srbija)
Kome se obraćate: (opišite tipičnog kupca)
Šta vas izdvaja: (dve do tri prave prednosti, ne fraze)
Ton: (na primer poslovno i smireno, ili toplo i direktno)

STRANICE I SEKCIJE (jedna stranica, sa glatkim skrolom kroz sekcije)
1. Zaglavlje sa logotipom (tekstualni logo je u redu) i menijem.
2. Hero sekcija: jasan naslov koji kaže šta radite i za koga, kratak podnaslov i dugme sa pozivom na akciju.
3. Usluge ili proizvodi: (nabrojte 3 do 5 stavki, za svaku kratak opis).
4. Zašto mi: tri do četiri konkretna razloga, bez praznih reči.
5. O nama: kratka priča o firmi.
6. Utisci klijenata: tri polja sa mestom za citat i ime (koristi placeholder tekst).
7. Kontakt: forma sa poljima ime, imejl, poruka, plus telefon, imejl i adresa.
8. Podnožje sa linkovima, kontaktom i godinom.

DIZAJN
Napravi usklađen sistem boja iz ove osnovne boje: (na primer topla žuta) na tamnoj ili svetloj podlozi, po tvom izboru za najbolji kontrast. Koristi najviše dva pisma, jedno za naslove, jedno za tekst. Ostavi vazduha između sekcija. Dugmad neka budu jasno vidljiva. Izbegavaj generički izgled koji se odmah prepozna kao šablon.

PRILAGOĐENOST TELEFONU
Sajt mora savršeno da radi na telefonu. Meni na malim ekranima neka bude hamburger dugme. Slova i razmaci neka se prilagode ekranu. Ništa ne sme da izlazi iz okvira i ne sme da postoji vodoravno skrolovanje.

PRISTUPAČNOST
Koristi ispravnu strukturu naslova (jedan H1, pa H2 i niže). Svaka slika ima alt opis. Kontrast teksta i podloge mora da bude čitljiv. Sva dugmad i linkovi imaju jasno ime. Forma ima povezane oznake polja.

BRZINA
Kod neka bude čist i lagan. Bez teških biblioteka i bez suvišnog koda. Slike koristi kao placeholdere sa tačnim dimenzijama da se stranica ne trza dok se učitava.

SEO OSNOVE
Postavi jasan title tag i meta description. Koristi smislene naslove. Dodaj kratke, opisne alt tekstove. Napravi da se struktura lako čita i čoveku i pretraživaču.

SADRŽAJ
Napiši prave, konkretne tekstove na srpskom jeziku (latinica), bez praznih fraza i bez preterivanja. Gde ti fali informacija, ostavi jasno obeležen placeholder u uglastim zagradama da ga ja dopunim.

REZULTAT
Vrati mi ceo kod u jednom bloku, spreman za kopiranje. Ispod koda ukratko objasni koje delove treba da zamenim svojim podacima i slikama.

Ovaj prompt namerno traži jedan fajl, jer je takav sajt najlakše objaviti i najteže pokvariti. Kada vam AI vrati kod, sačuvajte ga kao dokument sa nastavkom .html i otvorite ga u pregledaču da vidite kako izgleda.

Kako da pokrenete prompt u ChatGPT-u, Gemini-ju ili Claude-u

Sva tri alata rade po istom principu i sva tri imaju besplatan nivo koji je dovoljan za prvu verziju sajta. Otvorite nalog, nalepite prompt sa popunjenim podacima i pošaljite ga. Alat će vam vratiti kod, a vi ga sačuvajte i pogledajte u pregledaču.

U praksi svaki alat ima svoju notu. ChatGPT je snažan i najpoznatiji, pa oko njega ima najviše primera i saveta. Gemini je najdarežljiviji na besplatnom nivou i dobro se snalazi kada tražite više izmena zaredom. Claude je često najprecizniji kada je zadatak dugačak i detaljan, kao što je ovaj prompt, i ume lepo da drži strukturu koda. Ako imate vremena, isplati se da isti prompt probate u dva alata i uporedite rezultate, jer se ponekad razlikuju više nego što biste očekivali.

Kako da doterate sajt kroz razgovor

Prva verzija skoro nikada nije i poslednja, i to je sasvim u redu. Snaga ovog pristupa je u tome što izmene tražite običnim rečima, u istom razgovoru u kom ste dobili sajt. Budite konkretni i menjajte jednu po jednu stvar, jer tako lakše vidite šta je alat uradio.

Korisno je da izmene formulišete kao jasne komande. Na primer, zamolite da hero naslov bude kraći i direktniji, da se sekcija usluga prikaže u tri kolone na računaru i jednoj na telefonu, da se boja dugmadi pojača radi kontrasta, ili da se doda pojas sa pozivom na akciju pre podnožja. Ako nešto ne izgleda dobro, opišite problem svojim rečima i pitajte za rešenje. Kroz nekoliko krugova ovakvog doterivanja dođete do sajta koji zaista liči na vašu firmu.

Hosting i domen: kako sajt da bude živ

Kada ste zadovoljni izgledom, sajt sa vašeg računara treba da pređe na internet. Za to su potrebne dve stvari koje se često mešaju, a različite su. Domen je adresa sajta, na primer imefirme.rs, ono što ljudi kucaju u pregledač. Hosting je prostor na serveru gde stoje fajlovi sajta i odakle se isporučuju posetiocima. Domen bez hostinga je tabla bez kuće, a hosting bez domena je kuća bez adrese.

Domen sa nastavkom .rs registruje se preko ovlašćenih registara, a zvaničnu evidenciju vodi RNIDS, nacionalni registar. Godišnji zakup .rs domena je pristupačan i vredi ga uzeti čim ozbiljno krećete, jer domen gradi prepoznatljivost i poverenje. Kako tačno teče registracija objasnili smo u tekstu o zakupu .rs domena.

Za hosting izbor zavisi od toga kakav sajt imate. Ako ste dobili jedan HTML fajl, možete ga besplatno objaviti preko servisa kao što su Cloudflare Pages, Netlify ili GitHub Pages, koji jednostavan statični sajt drže brzim i sigurnim bez mesečnog troška. Ako idete na WordPress, treba vam pravi hosting kod domaćeg ili stranog provajdera, sa dovoljno prostora, sigurnosnim kopijama i podrškom. Kako da izaberete i po čemu se provajderi razlikuju, pišemo u vodiču kroz hosting i domen u Srbiji. Kada imate i domen i hosting, još samo povezujete adresu sa prostorom, i sajt je dostupan svima.

Kako da sajt napravljen uz AI bolje rangira

Sajt koji niko ne vidi ne donosi upite, pa vredi od prvog dana misliti na vidljivost. Veštačka inteligencija će vam napraviti pristojan okvir, ali rangiranje na Google-u zavisi od sadržaja i od toga koliko jasno govorite ko ste, šta radite i gde radite.

Pobrinite se da svaka stranica ima jedinstven i jasan naslov, da hero odmah kaže čime se bavite i za koje mesto, i da tekst sadrži reči koje vaši kupci zaista kucaju. Dodajte prave kontakt podatke i, ako radite za određeni grad, napišite ga otvoreno. Slikama dajte opisne alt tekstove. Ako želite da vas preporuče i alati poput ChatGPT-a i Google pregleda uz veštačku inteligenciju, pišite tako da odmah date odgovor na pitanje, pa tek onda kontekst, i budite dosledni u podacima o firmi na svim mestima. Više o tome imate u vodiču kroz SEO optimizaciju i u tekstu o optimizaciji za veštačku inteligenciju.

Gde besplatan put dostiže granicu

Izrada sajta uz AI je odličan način da brzo i bez troška dođete do prve verzije, isprobate ideju i naučite kako sajt funkcioniše. Za ličnu stranicu, jednostavan sajt vizitkartu ili probu tržišta, to je sasvim dovoljno i iskreno ga preporučujemo.

Granica se pokaže čim posao poraste. Kada vam zatreba internet prodavnica sa plaćanjem i dostavom, povezivanje sa drugim sistemima, ozbiljan i redovan SEO, usklađenost sa propisima o zaštiti podataka ili dizajn koji zaista izdvaja brend, tada se isplati profesionalni rad. Nije stvar u tome što besplatno nije dobro, nego u tome što posao od kog živite zaslužuje temelj koji izdržava rast. Mi u agenciji Reload gradimo premium WordPress sajtove i uz to automatizujemo procese primenom veštačke inteligencije, pa ako želite sajt koji radi kao alat, a ne samo kao izlog, javite nam se i predlažemo konkretno rešenje. Ako vas zanima čisto besplatan put i njegove granice, pogledajte i tekst o besplatnoj izradi sajta.

Česta pitanja