W Photoshopie można zrobić layout strony, według którego jest już stworzona w html. Ten proces jest stosunkowo prosty.
Niezbędny
Program Adobe Photoshop
Instrukcje
Krok 1
Otwórz Photoshopa i utwórz w nim dokument o wymiarach 1020 x 1200. Ustaw kolor tła na # a8a995. Jeśli strona jest dedykowana firmie, możesz umieścić jej logo w lewym górnym rogu paska nawigacyjnego. Zostaw trochę miejsca po prawej stronie na linki do nawigacji w witrynie.
Krok 2
Weź narzędzie Prostokąt i utwórz prostokąt o wymiarach 80 na 54 na pasku nawigacyjnym witryny. Wskazuje aktywny element menu w nawigacji witryny.
Krok 3
Przejdź do menu Layer-Layer Style, zaznacz pole wyboru Color Overlay, kolor # ADAE9E, Krycie - 100%, oraz pole wyboru Obrys, Rozmiar - 1 px, Pozycja - Na zewnątrz, Krycie - 100%, kolor # CED0BB.
Krok 4
Na wierzchu prostokąta, który już masz, dodaj kolejne zdjęcie 71x50, pomaluj je #cfbe28. Przejdź do menu Layer-Layer Style, ustaw następujące parametry dla tego prostokąta: Drope Shadow: Blend Mode - Multiply, color # 000000, Krycie - 27%, Angle - 90, Distance - 1, Spread - 0, Size - 5; Cień wewnętrzny: Tryb mieszania - Mnożenie, kolor # 000000, Krycie - 27%, Kąt - 90, Odległość - 1, Choke - 0, Rozmiar - 18; Obrys: rozmiar - 1, pozycja - na zewnątrz, krycie - 100, typ wypełnienia - kolor, kolor # D6C72C.
Krok 5
Dodaj cień dla linków znajdujących się na pasku nawigacyjnym. Aby to zrobić, wybierz warstwę z tekstem tych linków, przejdź do menu Layer-Layer Style i ustaw następujące parametry: Drope Shadow: Blend Mode - Multiply, color # 000000, Krycie - 75%, Angle - 90, Distance - 1, Spread - 0, Size - 1. Powtórz te kroki dla każdej warstwy, która będzie zawierać tekst linków.
Krok 6
Teraz musisz zrobić wstępną część szablonu. Wybierz narzędzie Prostokąt i wykonaj prostokąt pod logo, wypełnij go kolorem białym, zmniejsz krycie do 20%.
Krok 7
Wybierz narzędzie Elipsa i wykonaj owal pod tym prostokątem. Przejdź do Filter> Blur> Gaussian Blur i ustaw promień na 7, 8.
Krok 8
Weź Rectangular Marque Tool i wybierz dolną część prostokąta oraz rozmyty owal. Usuń to.
Krok 9
Następnie wprowadź tekst w przycisku prostokąta. Utwórz linię bezpośrednio nad nią z następującymi parametrami: 866 na 1 pic.
