ChatGPT izrada web stranice dio1

ChatGPT izrada web stranice Dio 1

Nakon što sam u prvom dijelu uz pomoć ChatGPT-a složio osnovnu strukturu demo web stranice za frizerski salon HAIR, vrijeme je za idući korak – malo vizualnog identiteta i dodatnog sadržaja. U ovom nastavku sam se fokusirao na:

🎨 Izrada loga i uređivanje slika

Za početak, izradio sam jednostavan logo koji odgovara stilu stranice. Nisam išao prekomplicirano – ideja je bila da logo bude čist, čitljiv i prepoznatljiv.

Sljedeći korak bio je odabir slika. Koristio sam Pixabay kao izvor jer nudi velik broj besplatnih i kvalitetnih fotografija. Nakon preuzimanja, malo sam ih doradio u GIMP-u – podešavanje kontrasta, lagani color grading čisto da sve ima sličan vizualni ton, spremio sam ih u webp format.

📄 Dodavanje nove stranice – “Usluge”

Uz početnu stranicu, odlučio sam dodati još jednu – stranicu za usluge. U VSCode sam napravio HTML stranicu s pregledom usluga.

Dodao sam sljedeće elemente:

• Hero s naslovom i slikom

• Naslove i kratke opise usluga

• Slike koje ih vizualno predstavljaju

• Prilagodio izgled da bude konzistentan s početnom stranicom

🖼️ Postavljanje slika i pozadina

Postavio sam:

• Hero pozadinsku sliku za bolji prvi dojam

• Logo na vrh stranice

• Slike unutar sekcije galerija

Cilj mi je bio da stranica vizualno “diše”, da slike imaju funkciju i nisu samo ukras.

🧭 Navigacija

Dodao sam navigacijski meni koji se nalazi na obje stranice (meni ima Početna, Usluge i Kontakt). Poveznice rade kako treba, a struktura stranice je sad jasnija korisnicima.

🔍 Povratne informacije i plan za dalje

Nakon prvog pregleda, uočio sam nekoliko stvari koje treba poboljšati:

• Naslovi su ispali premali, što otežava čitanje.

• Na hero slici nedostaje overlay, pa je tekst iznad nje teško čitljiv.

Ove ispravke ću odraditi u sljedećem videu.

Kako je ispalo pogledaj u videu

Možda te zanima