Proiectanții web profesioniști dezvoltă șabloane de site-uri web, de obicei în editori grafici puternici precum Adobe Photoshop. Rezultatul muncii este un fișier cu o imagine, care în acest formular este furnizat clientului. Pentru a utiliza designul gata făcut, adică pentru a întinde o pagină web, trebuie să tăiați șablonul.
Necesar
editor grafic raster Adobe Photoshop
Instrucțiuni
Pasul 1
Deschideți fișierul șablon în editorul grafic Adobe Photoshop. Selectați Fișier și Deschideți din meniu sau apăsați combinația de taste Ctrl + O. În dialogul care apare după aceea, accesați directorul cu fișierul, selectați-l în listă și faceți clic pe butonul „Deschidere”.
Pasul 2
Alegeți o scară convenabilă pentru vizualizarea imaginii șablonului. Utilizați instrumentul Zoom sau elementele din meniul contextual. Selectați o scală care vă permite să poziționați cursorul cu precizie de pixeli. Acest lucru este necesar pentru a seta cu precizie liniile de referință.
Pasul 3
Formați un set de linii de referință deasupra imaginii șablonului. Porniți afișarea riglelor în ferestrele documentului dacă nu este deja activată. Pentru aceasta, apăsați Ctrl + R sau selectați View and Rulers din meniu.
Pasul 4
Deplasați cursorul mouse-ului peste rigla de sus pentru a adăuga o linie de referință orizontală. Țineți apăsată tasta stângă. Deplasați cursorul mouse-ului în jos în zona imaginii. La fel, folosind rigla dreaptă, puteți adăuga linii orizontale.
Pasul 5
Adăugați numărul necesar de linii de referință și poziționați-le de-a lungul limitelor împărțirii regiunilor șablonului. Liniile ar trebui să treacă prin toate locurile în care doriți să tăiați șablonul. Acestea ar trebui să restricționeze toate imaginile și zonele logice (sigla, antetul site-ului, meniurile orizontale și verticale etc.) care vor fi prezentate pe o pagină web.
Pasul 6
Activați instrumentul Slice. Butonul său se află pe bara de instrumente verticală.
Pasul 7
Creați numărul necesar de zone de tăiere folosind instrumentul Slice Tool. Alegeți o scară convenabilă pentru afișarea șablonului. Folosiți mouse-ul pentru a seta limitele zonelor. Liniile directoare adăugate în al treilea pas vor oferi o poziționare precisă a limitelor obiectelor pe care le creați. Ajustați zonele existente, dacă este necesar, utilizând Instrumentul de selectare a feliei.
Pasul 8
Modificați proprietățile regiunilor de tăiere, după cum este necesar. Activați instrumentul de selectare a feliei. Faceți clic dreapta pe zona dorită. În meniul contextual, selectați elementul Editare opțiuni felie. În dialogul Opțiuni Slice care apare, selectați tipul de zonă (imagine, zonă goală, tabel), modul de completare a fundalului, specificați, dacă este necesar, numele, adresa URL țintă, conținutul atributului alt="Imagine" și alte valori. Faceți clic pe OK.
Pasul 9
Tăiați șablonul. Selectați Fișier și Salvați pentru Web și dispozitive din meniu sau apăsați Shift + Ctrl + Alt + S. În dialogul Salvare pentru web și dispozitive specificați formatul și parametrii de compresie a imaginii în care va fi tăiat șablonul. Faceți clic pe butonul Salvare. Va fi afișat dialogul Salvare optimizată ca.
Pasul 10
Selectați HTML și imagini (*.html) în lista derulantă Tip fișier, iar în câmpul Nume fișier introduceți numele fișierului în care va fi plasat marcajul HTML șablon. În lista Slices, selectați All Slices. Specificați directorul pentru ieșire și faceți clic pe butonul „Salvare”.
Pasul 11
Un fișier HTML va fi plasat în directorul țintă, care este, de fapt, un șablon de pagină web gata pregătit. Subdirectorul de imagini va conține setul de imagini în care a fost tăiat șablonul original.
