Ako Nakresliť šablónu Pre Webovú Stránku

Obsah:

Ako Nakresliť šablónu Pre Webovú Stránku
Ako Nakresliť šablónu Pre Webovú Stránku

Video: Ako Nakresliť šablónu Pre Webovú Stránku

Video: Ako Nakresliť šablónu Pre Webovú Stránku
Video: Ako vytvoriť web stránku ľahko a rýchlo 2024, Smieť
Anonim

Na webe je obrovské množstvo šablón webových stránok, majú však jednu nevýhodu - nie sú jedinečné. Ak vlastník stránok nechce, aby sa dizajn jeho stránok opakoval inde, môže si objednať šablónu od profesionálneho dizajnéra alebo sa ju pokúsiť vytvoriť svojpomocne.

Ako nakresliť šablónu pre webovú stránku
Ako nakresliť šablónu pre webovú stránku

Je to nevyhnutné

program Adobe Photoshop

Inštrukcie

Krok 1

Vytvorenie vlastnej šablóny nie je taká náročná úloha, ako by sa na prvý pohľad mohlo zdať. Na prácu potrebujete program Adobe Photoshop - samozrejme, musíte mať aspoň základné vedomosti o práci s ním. Ale skôr ako spustíte program a začnete vytvárať, musíte si vopred premyslieť budúci dizajn. Najpohodlnejším spôsobom, ako to urobiť, je najskôr sa zoznámiť s najmenej stovkou hotových šablón, vyhodnotiť ich výhody a nevýhody. Venujte pozornosť úspešným riešeniam určitých dizajnových prvkov. To neznamená, že ich budete kopírovať, ale je celkom rozumné brať ako základ niektoré krásne a pohodlné riešenia.

Krok 2

Na základe analýzy šablón iných ľudí a vašej vlastnej tvorivosti by ste mali získať predstavu o tom, ako bude váš web vyzerať. Najlepšie je urobiť hrubé náčrty budúceho dizajnu farebnými ceruzkami na obyčajných listoch A4. S Photoshopom by ste mali začať pracovať až potom, keď budete mať jasnú predstavu o tom, čo presne budete kresliť.

Krok 3

Spustite Photoshop, vytvorte nový projekt 1 200 x 1 600, nastavte priehľadné pozadie. Zapnite nástroj Pravítko, ak ešte nie je zapnutý, stlačte kombináciu klávesov Ctrl + R. Povoliť prichytenie: Zobraziť - prichytenie.

Krok 4

Teraz musíme šablónu rozdeliť pomocou vodítok, ktoré zobrazia hranice jej prvkov - boky, stĺpce atď. Napríklad chcete rozdeliť šablónu tak, aby bol vľavo úzky stĺpec, vpravo od šablóny široký stĺp a vpravo hore bol priestor na hlavičku. To znamená, že potrebujete tri zvislé čiary (ľavý okraj šablóny, pravý a riadok medzi nimi) a vodorovnú čiaru zobrazujúcu spodný okraj hlavičky. Ak chcete nastaviť zvislú čiaru, posuňte kurzor na ľavé pravítko na ľavej strane, stlačte kláves V a podržte stlačený kláves a ťahajte čiaru na požadované miesto. To isté urobte s ďalšími dvoma zvislými čiarami. Horizontálne sú postavené rovnako, používa sa iba horné pravítko.

Krok 5

Nájdite pozadie pre svoju šablónu, mala by to byť malá, opakujúca sa vzorka. Otvorte ho vo Photoshope, vyberte, skopírujte. Potom vložte do šablóny toľkokrát, koľkokrát je potrebné vyplniť pozadie. Prilepiť sa deje takto: „Upraviť“- „Prilepiť“a potom potiahnuť oblasť pozadia na požadované miesto. Je ešte rýchlejšie vložiť obrázok pomocou príkazu Ctrl + V. Rovnakým spôsobom pridajte pozadie pre hlavičku webu. Na vytvorenie pozadia môžete použiť rôzne prechodové výplne.

Krok 6

Pomocou nástroja Ceruzka nakreslite hranice šablóny so zameraním na už nakreslené čiary (to znamená nad nimi). Dostali ste základ najjednoduchšej šablóny, teraz ju musíte doplniť o potrebné podrobnosti - navigačné tlačidlá, riadky ponuky, rôzne prvky zdobenia atď. Ak sa chcete dozvedieť viac informácií o tom, ako vytvárať tlačidlá a ďalšie prvky, prečítajte si príslušné články o práci s programom Adobe Photoshop.

Krok 7

Šablóna je vytvorená, teraz ju musíte rozrezať na kúsky, aby ste ich mohli vložiť do stránky html. Na rezanie použite nástroj Slice. Vyhľadáte ho tak, že kliknete pravým tlačidlom myši na nástroj Rám a v ponuke, ktorá sa otvorí, vyberiete Výrez. Teraz môžete šablónu vnoriť podľa želania a potom uložiť: „Súbor“- „Uložiť na web“. V okne, ktoré sa otvorí, vyberte typ súboru: HTML a obrázky, zadajte názov súboru: index.htm a uložte ho. Budete mať súbor index.htm a priečinok s obrázkami s nakrájanými obrázkami.

Odporúča: