Profesionāli tīmekļa dizaineri izstrādā vietņu veidnes, parasti tādos jaudīgos grafiskajos redaktoros kā Adobe Photoshop. Darba rezultāts ir fails ar attēlu, kas šajā formā tiek sniegts klientam. Lai izmantotu gatavo dizainu, tas ir, lai izveidotu tīmekļa lapu, jums ir jāsamazina veidne.
Nepieciešams
rastra grafikas redaktors Adobe Photoshop
Instrukcijas
1. solis
Atveriet veidnes failu grafikas redaktorā Adobe Photoshop. Izvēlnē atlasiet Fails un Atveriet vai nospiediet taustiņu kombināciju Ctrl + O. Pēc tam parādītajā dialoglodziņā dodieties uz direktoriju ar failu, atlasiet to sarakstā un noklikšķiniet uz pogas "Atvērt".
2. solis
Veidnes attēla apskatei izvēlieties ērtu skalu. Izmantojiet tālummaiņas rīku vai konteksta izvēlnes vienumus. Atlasiet mērogu, kas ļauj novietot kursoru ar pikseļu precizitāti. Tas ir nepieciešams, lai precīzi iestatītu atskaites līnijas.
3. solis
Veidojiet atsauces līniju kopu virs veidnes attēla. Ieslēdziet lineālu parādīšanu dokumentu logos, ja tas vēl nav ieslēgts. Lai to izdarītu, nospiediet Ctrl + R vai izvēlnē atlasiet Skatīt un Lineāli.
4. solis
Pārvietojiet peles kursoru virs augšējā lineāla, lai pievienotu horizontālu atskaites līniju. Nospiediet un turiet kreiso taustiņu. Pārvietojiet peles kursoru uz leju līdz attēla apgabalam. Tāpat, izmantojot pareizo lineālu, varat pievienot horizontālas līnijas.
5. solis
Pievienojiet nepieciešamo atsauces līniju skaitu un novietojiet tos pa veidnes reģionu sadalījuma robežām. Līnijām jāiet cauri visām vietām, kur vēlaties izgriezt veidni. Tiem jāierobežo visi attēli un loģiskās zonas (logotips, vietnes galvene, horizontālās un vertikālās izvēlnes utt.), Kas tiks rādīti tīmekļa lapā.
6. solis
Aktivizējiet rīku Šķēle. Tās poga atrodas vertikālajā rīkjoslā.
7. solis
Izmantojot Slice Tool, izveidojiet nepieciešamo griešanas laukumu skaitu. Izvēlieties ērtu skalu veidnes parādīšanai. Izmantojiet peli, lai iestatītu apgabalu robežas. Trešajā solī pievienotās vadlīnijas nodrošinās precīzu izveidoto objektu robežu izvietojumu. Pielāgojiet esošos apgabalus, ja nepieciešams, izmantojot rīku Slice Select.
8. solis
Pēc nepieciešamības mainiet griešanas apgabalu īpašības. Aktivizējiet šķēles izvēles rīku. Ar peles labo pogu noklikšķiniet uz vajadzīgā apgabala. Konteksta izvēlnē atlasiet vienumu Rediģēt šķēles opcijas. Parādītajā dialoglodziņā Šķēles opcijas atlasiet apgabala veidu (attēls, tukšs laukums, tabula), fona aizpildīšanas režīmu, vajadzības gadījumā norādiet nosaukumu, mērķa URL, atribūta alt="Attēls" saturu un citas vērtības. Noklikšķiniet uz Labi.
9. solis
Izgrieziet veidni. Izvēlnē atlasiet Fails un Saglabāt tīmeklim un ierīcēm vai nospiediet Shift + Ctrl + Alt + S. Dialoglodziņā Saglabāt tīmeklim un ierīcēm norādiet formātu un attēlu saspiešanas parametrus, kuros veidne tiks sagriezta. Noklikšķiniet uz pogas Saglabāt. Tiks parādīts dialoglodziņš Saglabāt optimizēto kā.
10. solis
Nolaižamajā sarakstā Faila tips atlasiet HTML un Attēli (*.html) un laukā Faila nosaukums ievadiet faila nosaukumu, kurā tiks ievietota veidnes HTML iezīme. Sarakstā Šķēles atlasiet Visas šķēles. Norādiet izvades direktoriju un noklikšķiniet uz pogas "Saglabāt".
11. solis
Mērķa direktorijā tiks ievietots HTML fails, kas faktiski ir gatava tīmekļa lapas veidne. Attēlu apakšdirektorijā būs attēlu kopa, kurā tika sagriezta sākotnējā veidne.