Návod , ako vytvoriť webovú stránku v aplikácii Adobe Photoshop

Kým Photoshop je určený predovšetkým na úpravu a vylepšovať fotografie a vytvárať grafiku , môžete využiť program " Slice Tool " a " Uložiť pre web a zariadenia " možností, ako vytvoriť webové stránky z vášho PSD súbory obrázkov . Pomocou Slice Tool znížiť ( alebo " plátok " ) PSD do sekcií . Každý plátok sa stáva samostatné webové prvok , napríklad tlačidlo alebo textové pole . Photoshop umiestni každý rez v jeho vlastnej tabuľke HTML . Potom môžete pridať hypertextové odkazy alebo iné HTML tagy na rôzne rezy a exportovať PSD do HTML webovej stránky . Veci , ktoré budete potrebovať
Adobe Photoshop CS3 alebo novší
Zobraziť ďalšie inštrukcie
Vytvorenie webovej stránky vo Photoshope
1

Spustenie nového PSD obrázok vo Photoshope s rozmermi chcete pre vaše webové stránky , ako je tento : Kliknite na " File " v lište menu a vyberte " Nový " sa zobrazí dialógové okno Nový . Zadajte šírku stránky ( v pixeloch ) v poli " width " a výšku ( v pixeloch ) v poli " Výška " .
2

Typ " 96 " v poli " Riešenie " a kliknite na tlačidlo " OK . " Tým sa vytvorí prázdne plátno pre vaše webové stránky .
3

Vytvorte banner grafiku a tlačidlá v hornej časti stránky . Môžete importovať existujúce obrázky a umiestniť ich tam , kde ich chcete mať , alebo použiť grafiku a textové nástroje Photoshopu na vytvorenie a usporiadanie banner .
4

Vyberte " Slice Tool " ( tlačidlo piate zhora toolbox ) . Ak nie je práve zobrazená Slice Tool , kliknite a podržte tlačidlo a zvoľte " Slice Tool " z fly - out .
5

Presuňte kurzor myši okolo prvé tlačidlo alebo oblasti v banneru , kde Ak chcete vytvoriť odkaz . Photoshop vytvorí pole , alebo " plátok " , okolo objektu a umiestni ju do tabuľky . Pri exporte stránky , vaše plátky sa zobrazí ako samostatné objekty v jednotlivých tabuľkách vo formáte HTML .
6

Pravým tlačidlom myši na rez a vyberte " Možnosti Upraviť Slice " z menu fly - out otvoriť Voľby rezu dialógové okno . Toto dialógové okno použite na definovanie vlastností vášho tlačidlom . Napríklad zadajte URL odkaz v poli " URL " . Zadajte cieľovú stránku prehliadača , alternatívne tagy , a tak ďalej . Kliknite na tlačidlo " OK " .
7

Opakujte tieto kroky pre vytváranie tlačidiel a možností úpravy rezov pre každú oblasť , ktorú chcete urobiť klikacie .
8

Pomocou Slice Tool definovať oblasť na stránke , kam chcete umiestniť textové pole . Kliknite pravým tlačidlom myši na rez a vyberte " Možnosti Upraviť Slice " z menu fly - out .
9

Kliknite na " Slice typu " drop - down a zvoľte " žiadny obraz . " Na displeji sa zobrazí " Text Zobrazené v Cell " oblasti . Môžete buď zadať text v tejto oblasti , alebo skopírovať a vložiť z textového procesora . Keď skončíte , kliknite na tlačidlo " OK " .
10

Kliknite na " Slice typ " drop - down a zvoľte " žiadny obraz . Zobrazí sa " " Text Zobrazené v oblasti bunkovej " . Môžete buď typ .. Váš text v tejto oblasti , alebo skopírovať a vložiť z textového procesora Keď skončíte , kliknite na tlačidlo " OK "

Poznámka : Toto pole podporuje väčšinu HTML tagy . Napríklad , aby sa niektoré z textu kurzívou , jednoducho umiestniť text medzi " váš text < /i > " tagy. Použite "

" vytvoriť rozdeľovanie odsekov , a tak ďalej .

Všimnite si tiež , že text v tejto tabuľke sa nezobrazí v Photoshope --- nemôžete vidieť , kým exportu na stránku .
11

Pokračujte v pridávaní a definovanie rezov pre text , obrázky , grafika , a tak ďalej , až kým sa dokončiť rozvrhnutie .
12

Kliknite na " File " na paneli ponúk a zvoľte " Uložiť pre web a zariadenia . " Tým sa otvorí dialógové okno Uložiť pre web a zariadenia . Toto dialógové okno slúži na ovládanie farbu pozadia , kompresiu a kvalitu obrazu , a tak ďalej .
13

Kliknite na tlačidlo " Uložiť " , aby meno a exportovať webovú stránku .

• Predchádzajúca strana: Ako si vyrobiť Logá Používanie aplikácie Photoshop 
• Ďalšia strana: Fotografické triky Bez Photoshope