Oman verkkosivuston luominen alkaa aina luonnoksen ja tulevan suunnittelun kehittämisestä, ja olennainen osa tätä kehitystä on sivustosuunnittelun visualisointi Photoshopissa ja valmiin suunnittelun leikkaaminen lohkoiksi myöhempää asettelua varten. Kyky leikata oikein sivuston suunnittelukuva vaikuttaa suoraan asettelun onnistumiseen ja graafisten tiedostojen oikeaan sijoittamiseen palvelimelle.
Ohjeet
Vaihe 1
Avaa luotu ulkoasu Photoshopissa, joka on kiinteä kuva halutusta tarkkuudesta. Valitse Photoshopin työkalupalkista Slice-työkalu. Sammuta kaikkien tekstitasojen, syöttökenttien, kuvakkeiden ja vastaavien elementtien näkyvyys väliaikaisesti.
Vaihe 2
Piirrä valitulla työkalulla ohjeviivat, joita pitkin leikkaat sivuston - nämä kuvan viivat ovat vihreitä. Jaa yksiosainen asettelu huolellisesti halutun kokoisiksi ja määrällisiksi rakenneosiksi.
Vaihe 3
Ajattele, kuinka leikkaat kuvan - siinä ei pitäisi olla liikaa yksittäisiä elementtejä. Luo opasviivat asettamalla kohdistin ylemmän viivaimen päälle kuvan päälle, napsauttamalla hiiren vasemmalla painikkeella ja vetämällä ohjainta alas. Vapauta hiiren painike.
Vaihe 4
Kun kaikki ohjaimet on asetettu (sekä pysty- että vaakasuuntaiset), jatka asettelun viipalointia.
Vaihe 5
Leikkaa asettelua yllä valitulla leikkaustyökalulla napsauttamalla hiiren vasemmalla painikkeella kunkin ohjeen alkua ja venyttämällä ilmestynyt kenttä haluamasi objektin kokoon. Vapauta hiiren vasen painike niin, että sarjanumero näkyy leikatun palan vasemmassa kulmassa.
Vaihe 6
Säädä fragmenttien reunat venyttämällä niitä manuaalisesti. Jos haluat tallentaa viipaloidut osiot kokonaiskuvasta, napsauta Tiedosto-valikon Tallenna verkkosivustoille -vaihtoehtoa ja valitse JPEG-muoto. Valitse tallennusikkunassa "Kaikki fragmentit".
Vaihe 7
Tallennettuasi leikatut kuvafragmentit erikseen, tallenna kaikki sivusuunnittelun visuaaliset elementit - tekstilohkot, painikkeet, viivat ja niin edelleen.
