Při vytváření webu je velmi důležitá fáze vykreslení designu stránky, která bude následně sázena a publikována v síti. V tomto článku se naučíte, jak pomocí aplikace Adobe Photoshop nakreslit vhodné rozvržení pro web, na jehož základě můžete později vytvořit složitější rozvržení.
Je to nutné
program Adobe Photoshop
Instrukce
Krok 1
Vytvořte nový soubor ve Photoshopu (Ctrl + N) s rozměry 1040x1400, kde 1400 je výška. Zapněte zobrazení pravítek (Ctrl + R) a v nastavení pravítka nastavte pixely jako jednotky měření.
Krok 2
Začněte roztahovat vodítka tak, aby odpovídala ohraničení polí rozvržení. Roztáhněte boční ohraničení tak, aby k okrajům zbylo 40 pixelů. Horní a dolní ohraničení by také mělo ponechat 40 pixelů na každé straně až k ohraničení pozadí.
Krok 3
Pak vyberte průvodce, který je 200 pixelů dolů od horní části pozadí pro horní záhlaví.
Krok 4
Chcete-li vytvořit postranní lišty vlevo a vpravo od rozvržení, nastavte vodítka 240 pixelů od ohraničení pozadí doleva a 800 doprava.
Krok 5
5px dovnitř z levého a pravého postranního panelu a nakreslete další dvě svislá vodítka. Poté přetáhněte další dva vodítka 245 px doleva a 795 px doprava.
Krok 6
Nyní změřte od okraje záhlaví 30px a nakreslete vodorovného vodítka pro vodorovnou nabídku.
Krok 7
Vyberte úzkou oblast vodorovné nabídky, kterou jste právě označili obdélníkovým výběrem pomocí klávesy M. Vyberte nástroj výplně a vyplňte oblast neutrální světle šedou barvou.
Krok 8
Vyberte nástroj výplně a vyplňte oblast neutrální světle šedou barvou. Klikněte na nabídku „Select-Modify-Compress“, vyberte možnost 1 pixel a klikněte na „OK“. Vyplňte oblast světlejším odstínem šedé - budete mít rámeček nabídky.
Krok 9
Vytvořte novou vrstvu, vyberte vhodný obrázek pro ikonu nebo logo webu a poté jej otevřete.
Krok 10
Vložte obrázek do nové vrstvy v záhlaví a umístěte jej na levý okraj. Napravo od obrázku napište textový název webu libovolným písmem.
Krok 11
Navrhněte bloky svého webu ve stejném barevném schématu jako nově vytvořená hlavička. Vyberte oblast levého postranního panelu a proveďte na ní stejné dvoubarevné operace výplně jako u bloku nabídky.
Krok 12
To samé udělejte se středovým širokým blokem obsahu. Zkopírujte vrstvu levého postranního panelu a umístěte ji jako pravý postranní panel.
Krok 13
Přidejte do svého rozvržení text - vyberte neutrální písmo a vyplňte v nabídce názvy, příklady zpráv, fotografie, značky a odkazy.
Krok 14
Dokončete rozvržení vytvořením „zápatí“nebo zápatí - zapište si tam autorská práva a kontakty.
