Pri izradi web mjesta vrlo je važna faza prikazivanja dizajna stranice koja će se naknadno otkucati i objaviti na mreži. U ovom ćete članku naučiti kako koristiti Adobe Photoshop za crtanje kompetentnog izgleda web stranice na temelju kojeg kasnije možete oblikovati složenije izglede.
Nužno je
program Adobe Photoshop
Upute
Korak 1
Stvorite novu datoteku u Photoshopu (Ctrl + N) dimenzija 1040x1400, gdje je 1400 visina. Uključite prikaz ravnala (Ctrl + R) i u postavkama ravnala postavite piksele kao mjerne jedinice.
Korak 2
Počnite rastezati vodilice tako da odgovaraju obodima okvira za raspored. Ispružite bočne obrube tako da 40 piksela ostane do rubova. Gornja i donja granica također trebaju ostavljati po 40 piksela sa svake strane do granica pozadine.
3. korak
Zatim za gornje zaglavlje odaberite vodič koji je 200 piksela niže od vrha pozadine.
4. korak
Da biste oblikovali bočne trake na lijevoj i desnoj strani izgleda, postavite vodilice 240 piksela od pozadinske granice lijevo i 800 desno.
Korak 5
5px prema unutra s lijeve i desne bočne trake i nacrtajte još dvije okomite vodilice. Zatim povucite još dvije vodilice 245 px ulijevo i 795 px udesno.
Korak 6
Sada izmjerite od granice zaglavlja 30 piksela i nacrtajte vodoravnu vodilicu za vodoravni izbornik.
Korak 7
Pomoću tipke M odaberite usko područje vodoravnog izbornika koje ste upravo označili pravokutnim odabirom. Odaberite alat za ispunu i ispunite područje neutralnom svijetlosivom bojom.
Korak 8
Odaberite alat za ispunu i ispunite područje neutralnom svijetlosivom bojom. Kliknite izbornik "Select-Modify-Compress", odredite opciju od 1 piksela i kliknite "OK". Ispunite područje svjetlijom nijansom sive - imat ćete okvir izbornika.
Korak 9
Stvorite novi sloj i odaberite prikladnu sliku za ikonu ili logotip web lokacije, a zatim je otvorite.
Korak 10
Umetnite sliku na novi sloj u zaglavlje, postavljajući je na lijevi rub. Desno od slike napišite naslov teksta web stranice bilo kojim fontom.
11. korak
Dizajnirajte blokove svoje web stranice u istoj shemi boja kao novostvoreno zaglavlje. Odaberite područje lijeve bočne trake i na njoj izvodite iste operacije popunjavanja u dvije boje kao i kod bloka izbornika.
Korak 12
Učinite isto sa središnjim blokom sadržaja. Kopirajte sloj lijeve bočne trake i postavite ga kao desnu bočnu traku.
Korak 13
Dodajte tekst u svoj izgled - odaberite neutralni font i popunite naslove izbornika, primjere vijesti, fotografije, oznake i veze.
14. korak
Završite izgled stvaranjem "podnožja" ili podnožja - tamo zapišite svoja autorska prava i svoje kontakte.