Tīmeklī ir milzīgs skaits vietņu veidņu, taču tām ir viens trūkums - tās nav unikālas. Ja vietnes īpašnieks nevēlas, lai viņa vietnes dizains tiktu atkārtots citur, viņš var pasūtīt veidni no profesionāla dizainera vai mēģināt izveidot pats.
Tas ir nepieciešams
Adobe Photoshop programma
Instrukcijas
1. solis
Izveidot savu veidni nav tik grūts uzdevums, kā tas varētu šķist no pirmā acu uzmetiena. Lai strādātu, jums ir nepieciešams Adobe Photoshop - protams, jums ir jābūt vismaz pamata izpratnei par darbu ar to. Bet pirms palaižat programmu un sākat veidot, jums iepriekš jāpārdomā nākotnes dizains. Ērtākais veids, kā to izdarīt, ir vispirms iepazīties ar vismaz simts gatavām veidnēm, novērtēt to priekšrocības un trūkumus. Pievērsiet uzmanību dažu dizaina elementu veiksmīgajiem risinājumiem. Tas nenozīmē, ka jūs tos kopēsit, taču ir diezgan saprātīgi par pamatu ņemt dažus skaistus un ērtus risinājumus.
2. solis
Pamatojoties uz citu cilvēku veidņu analīzi un jūsu pašu radošumu, jums vajadzētu iegūt priekšstatu par jūsu vietnes izskatu. Vislabāk ir izdarīt aptuvenas nākotnes dizaina skices ar krāsainiem zīmuļiem uz parastajām A4 formāta lapām. Sāciet strādāt ar Photoshop tikai pēc tam, kad jums ir skaidra ideja par to, ko tieši jūs zīmēsiet.
3. solis
Sāciet Photoshop, izveidojiet jaunu 1200x1600 projektu, iestatiet caurspīdīgu fonu. Ieslēdziet Ruler rīku, ja tas vēl nav ieslēgts, lai to izdarītu, nospiediet taustiņu kombināciju Ctrl + R. Iespējot snapping: View - Snapping.
4. solis
Tagad mums ir jāsadala veidne ar ceļvežiem, kas parādīs tā elementu robežas - sānu malas, kolonnas utt. Piemēram, jūs vēlaties sadalīt veidni tā, lai kreisajā pusē būtu šaura kolonna, labajā pusē pa labi pa labi no veidnes un augšpusē būtu vieta galvenei. Tas nozīmē, ka jums ir nepieciešamas trīs vertikālas līnijas (veidnes kreisā robeža, labā un līnija starp tām) un horizontāla, parādot galvenes apakšējo robežu. Lai iestatītu vertikālu līniju, pārvietojiet kursoru uz kreiso lineālu kreisajā pusē, nospiediet V un, turot nospiestu taustiņu, velciet līniju vajadzīgajā vietā. Dariet to pašu ar pārējām divām vertikālajām līnijām. Horizontālie ir veidoti tādā pašā veidā, tiek izmantots tikai augšējais lineāls.
5. solis
Atrodiet veidnes fonu, tam vajadzētu būt mazam, atkārtotam paraugam. Atveriet to Photoshop, atlasiet, kopējiet. Pēc tam ielīmējiet veidnē tik reižu, cik nepieciešams, lai to aizpildītu ar fonu. Ielīmēšana tiek veikta šādi: "Rediģēt" - "Ielīmēt" un pēc tam velciet fona apgabalu vēlamajā vietā. Vēl ātrāk ir ievietot attēlu, izmantojot komandu Ctrl + V. Tādā pašā veidā pievienojiet vietnes galvenes fonu. Lai izveidotu fonu, varat izmantot dažādus gradienta aizpildījumus.
6. solis
Izmantojot rīku Zīmulis, uzzīmējiet veidnes robežas, koncentrējoties uz jau uzzīmētajām līnijām (tas ir, virs tām). Jūs esat saņēmis vienkāršākās veidnes pamatu, tagad tas jāpapildina ar nepieciešamajām detaļām - navigācijas pogām, izvēlņu rindām, dažādiem dekorēšanas elementiem utt. Lai iegūtu papildinformāciju par pogu un citu elementu izveidi, izlasiet atbilstošos rakstus par darbu ar Adobe Photoshop.
7. solis
Veidne ir izveidota, tagad jums tas jāsagriež gabalos, lai tos ievietotu html lapā. Lai grieztu, izmantojiet rīku Šķēle. Lai to atrastu, ar peles labo pogu noklikšķiniet uz rīka Rāmis un atvērtajā izvēlnē izvēlieties Izgriezt. Tagad jūs varat ievietot veidni pēc vēlēšanās, pēc tam saglabājiet: "File" - "Save for Web". Atvērtajā logā atlasiet faila tipu: HTML & images, norādiet faila nosaukumu: index.htm un saglabājiet to. Jums būs fails index.htm un attēlu mape ar sagrieztiem attēliem.
