Profesionální weboví designéři vyvíjejí webové šablony, obvykle ve výkonných grafických editorech, jako je Adobe Photoshop. Výsledkem práce je soubor s obrázkem, který je v této podobě poskytnut zákazníkovi. Chcete-li použít hotový design, tj. Rozložit webovou stránku, musíte šablonu vystřihnout.
Nezbytné
rastrový grafický editor Adobe Photoshop -
Instrukce
Krok 1
Otevřete soubor šablony v grafickém editoru Adobe Photoshop. V nabídce vyberte Soubor a Otevřít nebo stiskněte kombinaci kláves Ctrl + O. V dialogu, který se poté zobrazí, přejděte do adresáře se souborem, vyberte jej v seznamu a klikněte na tlačítko „Otevřít“.
Krok 2
Zvolte vhodné měřítko pro prohlížení obrázku šablony. Použijte nástroj Lupa nebo položky místní nabídky. Vyberte měřítko, které vám umožní umístit kurzor s přesností na pixely. To je nezbytné pro přesné nastavení referenčních čar.
Krok 3
Vytvořte sadu referenčních čar nad obrázkem šablony. Zapněte zobrazení pravítek v oknech dokumentu, pokud již není zapnuto. Chcete-li to provést, stiskněte Ctrl + R nebo z nabídky vyberte Zobrazit a Pravítka.
Krok 4
Přesunutím kurzoru myši nad horní pravítko přidáte vodorovnou referenční čáru. Stiskněte a podržte levé tlačítko. Přesuňte kurzor myši dolů do oblasti obrázku. Stejně tak můžete pomocí pravítka přidat vodorovné čáry.
Krok 5
Přidejte požadovaný počet referenčních čar a umístěte je podél hranic rozdělení oblastí šablony. Čáry by měly procházet všemi místy, kde chcete šablonu vystřihnout. Měly by omezit všechny obrázky a logické oblasti (logo, záhlaví webu, horizontální a vertikální nabídky atd.), Které budou prezentovány na webové stránce.
Krok 6
Aktivujte nástroj Slice. Jeho tlačítko je na svislém panelu nástrojů.
Krok 7
Vytvořte požadovaný počet řezných ploch pomocí nástroje Slice Tool. Zvolte vhodné měřítko pro zobrazení šablony. Pomocí myši nastavte hranice oblastí. Pokyny přidané ve třetím kroku zajistí přesné umístění hranic objektů, které vytvoříte. V případě potřeby upravte stávající oblasti pomocí nástroje pro výběr řezu.
Krok 8
Podle potřeby změňte vlastnosti řezných oblastí. Aktivujte nástroj pro výběr řezu. Klepněte pravým tlačítkem na požadovanou oblast. V místní nabídce vyberte položku Upravit možnosti řezu. V zobrazeném dialogovém okně Možnosti řezu vyberte typ oblasti (obrázek, prázdná oblast, tabulka), režim vyplnění pozadí, v případě potřeby zadejte název, cílovou adresu URL, obsah atributu alt="Obrázek" a další hodnoty. Klikněte na OK.
Krok 9
Vystřihněte šablonu. V nabídce vyberte Soubor a Uložit pro web a zařízení nebo stiskněte Shift + Ctrl + Alt + S. V dialogu Uložit pro web a zařízení zadejte parametry formátu a komprese obrazu, do kterých bude šablona vyříznuta. Klikněte na tlačítko Uložit. Zobrazí se dialogové okno Uložit optimalizované jako.
Krok 10
V rozevíracím seznamu Typ souboru vyberte HTML a obrázky (*.html) a do pole Název souboru zadejte název souboru, do kterého bude umístěna značka HTML šablony. V seznamu Řezy vyberte Všechny řezy. Zadejte adresář pro výstup a klikněte na tlačítko „Uložit“.
Krok 11
Soubor HTML bude umístěn do cílového adresáře, což je ve skutečnosti hotová šablona webové stránky. Podadresář images bude obsahovat sadu obrázků, do kterých byla původní šablona vyříznuta.
