Photoshop lecții de diapozitive - tăiere grafică pentru web design

1. Prima condiție - aveți deja o dispunere pregătită pentru tăiere, să spunem asta -

2. Acum, luați instrumentul Slice - cu asta ne vom tăia dispunerea







3. Acum să facem prima "incizie" - trebuie doar să faceți clic pe butonul din stânga al mouse-ului și să faceți clic pe mouse până când veți vedea zona dorită. Am început cu capacul, principalul lucru nu este să cerc meniul, îl vom tăia mai târziu.

4. Acum tăiați meniul. Prima felie se termină chiar înainte de butonul "Acasă". Apoi tăiați toate butoanele așa cum se arată în imagine. Apoi faceți clic dreapta pe "Acasă" felie, selectați Editare Slice Opțiuni și umple această casetă ca a mea.

5. Acum taie partea de continut a layout-ului nostru. Mai întâi selectați partea din partea de sus a blocului central -

Apoi selectați alte trei părți, după cum se arată în imagine -

Acum, selectați unitatea centrală -

O altă evidențiere este partea de jos a unității centrale, lăsând în același timp un mic decalaj în partea de jos a planului







Și, în sfârșit, să alegem această diferență -

6. Salvați aspectul feliat pentru codarea html ulterioară
Fișier> Salvare pentru Web, în ​​această fereastră putem specifica formatul grafic final și gradul de blocare.

Apoi, faceți clic pe Salvați, în această casetă de dialog specificați numele fișierului (index.html), tipul de fișier este HTML și imaginile, iar în rândul Slices setați Toate secțiunile. Apăsăm OK!

Acum mergem să lucrăm cu codul. Cunoașterea HTML în acest caz este absolut necesară!

7. Primele linii ale codului nostru sunt -

Le schimbăm la acest cod. (dacă ați făcut fundalul layout-ului într-o altă culoare, atunci, respectiv, schimbați atributul bgcolor

8. Acum, chiar mai jos găsiți astfel de linii de cod -

Și schimbați-le

9. Apoi găsiți și ștergeți

Totul! Avem codul gata pentru pagina noastră, acum arată așa -

De fapt, este totul - o modalitate simplă, dar foarte eficientă de a economisi timp și de a transforma aspectul într-o html-pagină gata de rulare. Desigur, există încă o problemă foarte importantă ca optimizarea graficii, dar acest subiect va fi discutat într-o altă lecție

PS. Motorul forumului sparge inadecvat html-code.
Desigur, citatele duble nu trebuie să fie scăpate; Înainte de ei nu ar trebui să fie o slash - \

corect - alt = "", etc.
greșit - alt = "", etc.







Trimiteți-le prietenilor: