Segmentoverzicht

Wanneer je graphics voor het web ontwerpt, moeten verschillende delen van een afbeelding vaak onafhankelijk van elkaar werken. Het ene gebied koppelt mogelijk aan een URL, een ander laadt mogelijk sneller en weer een ander heeft mogelijk andere verbeteringsinstellingen nodig. Segmenten splitsen één afbeelding op in een raster van kleinere delen die samen functioneren als een webpagina, terwijl elk onderdeel de controle behoudt over de eigen sectie.

Photoshop voegt gesegmenteerde afbeeldingen weer samen op webpagina's met HTML-tabellen of CSS-lagen. Wanneer je een gesegmenteerde afbeelding exporteert met de opdracht Bestand > Exporteren > Opslaan voor web, slaat Photoshop elk segment op als een afzonderlijk bestand. Het genereert ook de HTML of CSS die nodig is om de afbeelding als één geheel weer te geven in een browser.

Hoe segmenten werken

Segmenten verdelen een afbeelding langs onzichtbare rasterlijnen, waardoor rechthoekige secties ontstaan die functioneren als onafhankelijke bestanden. Elk segment behoudt zijn positie in de algehele lay-out, terwijl het functioneert als een afzonderlijk element met eigen eigenschappen, verbeteringsinstellingen en gedragingen.

Deze aanpak biedt een aantal praktische voordelen:

• Wijs verschillende URL-koppelingen toe om aanklikbare navigatie-elementen te maken
• Pas verschillende compressie-instellingen toe om kwaliteit en bestandsgrootte in alle gebieden in balans te houden
• Werk individuele secties bij zonder de volledige compositie opnieuw te exporteren

Segmenttypen op basis van aanmaak

Photoshop categoriseert segmenten op basis van hoe ze zijn aangemaakt en elk type gedraagt zich anders wanneer je je afbeelding bewerkt.

• Gebruikerssegmenten: Secties die je handmatig definieert met de Segment tool.Je hebt volledige controle over de grootte, positie en eigenschappen en ze blijven op hun plek totdat je ze verplaatst of wijzigt.
• Laaggebaseerde segmenten: Segmenten omvatten alle pixels in een laag. Hun grenzen worden automatisch bijgewerkt wanneer je de laag verplaatst of bewerkt. Ze werken goed voor content die vaak wijzigt, maar bieden minder controle over nauwkeurige positionering dan gebruikerssegmenten.
• Automatische segmenten: Segmenten die de resterende ruimte in een afbeelding opvullen die niet wordt gedekt door gebruikerssegmenten of laaggebaseerde segmenten. Photoshop genereert deze automatisch en genereert ze opnieuw wanneer je andere Segmenten toevoegt, verwijdert of wijzigt.Alle automatische segmenten in een afbeelding delen dezelfde verbeteringsinstellingen.
• Subsegmenten: Een gespecialiseerd type automatisch Segment dat wordt weergegeven wanneer Segmenten overlappen.Subsegmenten tonen hoe Photoshop de overlappende gebieden zal verdelen wanneer je het verbeterde bestand opslaat.Je kunt subsegmenten niet selecteren of bewerken los van de onderliggende segmenten.

Segmenttype op basis van content

Segmenten worden ook geclassificeerd op basis van het type content dat ze bevatten.

• Afbeeldingssegmenten: Het standaard Segmenttype voor visuele content, met Afbeeldingsgegevens uit je Photoshop-document.
• Segmenten zonder afbeelding: Lege tabelcellen voor HTML-tekst of effen kleuren.Photoshop exporteert deze niet als afbeeldingsbestanden, waardoor ze nuttig zijn voor live, selecteerbare tekst.
• Tabelsegmenten: Segmenten die bepalen hoe Photoshop de HTML-tabel structureert die wordt gebruikt om een gesegmenteerde afbeelding opnieuw samen te stellen in een browser.

Visuele aanwijzingen voor Segmenten

Photoshop gebruikt visuele aanwijzingen om je te helpen Segmenttypen te onderscheiden terwijl je werkt.

• Segmentlijnen: Doorlopende lijnen markeren gebruikerssegmenten of Laaggebaseerde Segmenten, en stippellijnen markeren automatische Segmenten.
• Segmentkleuren: Blauwe symbolen identificeren gebruikerssegmenten en laaggebaseerde segmenten, en grijze symbolen markeren automatische segmenten.
• Segmentnummers: Nummers in de linkerbovenhoek van elk Segment lopen van links naar rechts en van boven naar onder, en worden automatisch bijgewerkt wanneer je Segmenten opnieuw ordent of wijzigt.
• Segmentbadges: Kleine pictogrammen identificeren Segmentcontent en -type.Een afbeeldingspictogram markeert bijvoorbeeld een gebruikerssegment met Afbeeldingscontent, een doorgestreept afbeeldingspictogram markeert een gebruikerssegment zonder Afbeeldingscontent, en een Laagpictogram markeert een Laaggebaseerd Segment.

Door deze visuele verschillen te herkennen, kun je Segmenttypen snel identificeren en efficiënter werken met complexe Segmentlay-outs wanneer je webpagina's segmenteert.