Stykke opp websider

Stykker deler opp et bilde i mindre bilder som settes sammen igjen på en webside ved hjelp av en HTML-tabell eller CSS-lag. Ved å dele opp bildet kan du tilordne forskjellige URL-koblinger for å opprette sidenavigering, eller optimalisere hver del av bildet ved hjelp av separate optimaliseringsinnstillinger.

Du eksporterer og optimerer et skjøtede bilde med kommandoen Lagre for Web. Photoshop lagrer hvert stykke som en egen fil og genererer HTML- eller CSS-koden som trengs for å vise det oppstykkede bildet.

Når du arbeider med stykker, bør du være oppmerksom på følgende:

• Du kan opprette et stykke ved hjelp av stykkeverktøyet eller ved å opprette lagbaserte stykker.

• Når du har opprettet et stykke, kan du velge det med stykkemarkeringsverktøyet  og deretter flytte det, endre størrelse på det eller justere det etter andre stykker.

• Du kan angi alternativer for hvert stykke, for eksempel stykketype, navn eller URL-adresse, i dialogboksen Alternativer for stykke.

• Du kan optimalisere hver del via forskjellige optimaliseringinnstillinger i dialogboksen Lagre for Web.

Stykker kategoriseres etter innholdstype (Tabell, Bilde, Ikke noe bilde) og etter måten de opprettes på (bruker, lagbasert, automatisk).

Stykker som opprettes med stykkeverktøyet, kalles brukerstykker. Stykker som opprettes fra et lag, kalles lagbaserte stykker. Når du oppretter et nytt brukerstykke eller lagbasert stykke, genereres flere autostykker for å ta høyde for de gjenværende områdene av bildet. Autostykker fyller med andre ord områder av bildet som ikke er definert av brukerstykker eller lagbaserte stykker. Autostykker genereres på nytt hver gang du legger til eller redigerer brukerstykker eller lagbaserte stykker. Automatiske stykker kan konverteres til brukerstykker.

Brukerstykker, lagbaserte stykker og automatiske stykker har ulikt utseende. Brukerstykker og lagbaserte stykker defineres av en heltrukket linje, mens automatiske stykker defineres av en prikkete linje. Brukerstykker og lagbaserte stykker viser i tillegg et eget ikon. Du kan velge å vise eller skjule automatiske stykker, noe som kan gjøre det enklere å se arbeidet med brukerstykker og lagbaserte stykker.

Et delstykke er en type automatisk stykke som genereres når du oppretter overlappende stykker. Delstykker indikerer hvordan bildet deles inn når du lagrer den optimaliserte filen. Selv om delstykker er nummererte og det vises et stykkesymbol, kan du ikke merke eller redigere dem separat fra det underliggende stykket. Delstykker genereres på nytt hver gang du endrer stablingsrekkefølgen for stykker.

Stykker opprettes på ulike måter:

• Autostykker genereres automatisk.

• Brukerstykker opprettes med stykkeverktøyet.

• Lagbaserte stykker opprettes med lagpanelet.

Stykke opp en webside

Du kan bruke stykkeverktøyet til å dra stykkelinjer på et bilde, eller du kan utforme grafikken ved hjelp av lag og deretter opprette stykker basert på disse lagene.

Opprette et stykke med stykkeverktøyet

Opprette stykker fra hjelpelinjer

Opprette et stykke fra et lag

Et lagbasert stykke omfatter alle bildepunktdataene på laget. Hvis du flytter laget eller redigerer laginnholdet, justeres stykkeområdet automatisk slik at det omfatter de nye bildepunktene.

Lagbaserte stykker er mindre fleksible enn brukerstykker, men du kan konvertere ("heve") et lagbasert stykke til et brukerstykke. Se Konvertere automatiske og lagbaserte stykker til brukerstykker.

Konvertere automatiske og lagbaserte stykker til brukerstykker

Et lagbasert stykke er knyttet til bildepunktinnholdet på et lag, og den eneste måten å flytte, sette sammen, dele opp, endre størrelse på og justere det på, er derfor å redigere laget – med mindre du konverterer stykket til et brukerstykke.

Alle automatiske stykker i et bilde er koblet til og deler de samme optimaliseringsinnstillingene. Hvis du vil angi andre optimaliseringsinnstillinger for et automatisk stykke, må du heve det til et brukerstykke.

Vise stykker og stykkealternativer

Du kan se delene i Photoshop og dialogboksen Lagre for Web. Følgende egenskaper kan hjelpe deg med å identifisere og skille mellom stykker:

Definer stykkerammen. Heltrukkede linjer angir at stykket er et brukerstykke eller lagbasert stykke, mens prikkete linjer angir at stykket er et automatisk stykke.

Skill brukerstykker og lagbaserte stykker fra autostykker. Som standard har brukerstykker og lagbaserte stykker blå symboler, mens autostykker har grå symboler.

I tillegg bruker dialogboksen Lagre for Web fargejusteringer for å tone ned ikke-valgte deler. Disse justeringene utføres utelukkende av hensyn til visningen og har ingen innvirkning på den endelige bildefargen. Fargejusteringen for automatiske stykker er som standard dobbelt så stor som for brukerstykker.

Stykker nummereres  fra venstre til høyre og fra topp til bunn, med start i bildets øvre venstre hjørne. Hvis du endrer rekkefølgen eller det totale antallet stykker, oppdateres stykkenumrene slik at de gjenspeiler den nye rekkefølgen.

Følgende merker, eller ikoner, angir bestemte betingelser.

Brukerstykket har bildeinnhold.

Brukerstykket har ikke bildeinnhold.

Stykket er lagbasert.

Vise eller skjule stykkerammer

Vise eller skjule automatiske stykker

Vise eller skjule stykkenumre

Endre farge på stykkelinjer