Viva Vector!

Bij de vraag om een bestand van een logo krijg ik regelmatig een dingetje waar-je-het-maar-mee-moet-doen. Bijvoorbeeld in lage resolutie en RGB terwijl het gedrukt moet worden tot aan iets totaal aangevreten voor een webbanner. Zoiets kun je verwachten bij het vignetje van de plaatselijke kaartvereniging, maar ik verbaas me hoe slecht (gerenommeerde) bedrijven dit geregeld hebben.
Het is dus Jip en Janneke tijd, waarin ik een aantal basiszaken zal uitleggen.

Vector

viva_a1 viva_a2 viva_a3Vectorbestanden zijn een soort vaste tekenlijnen; zogenaamde Bézier-curves. Je maakt ze met een tekenprogramma zoals illustrator.
Doordat het rechte en vloeiende lijnen zijn, blijven de randen altijd strak. Je kunt vectorbestanden daardoor oneindig en ongestraft zonder kwaliteitsverlies vergroten of verkleinen. Ideaal dus voor het maken van logo’s.
De bestanden worden meestal als (illustrator) .eps en .ai weggeschreven.
ministeck

Pixel

Een photoshop eps klinkt misschien hetzelfde als een illustrator eps maar zo’n fotoprogramma werkt met pixels; miniscule vierkantjes die samen een plaatje opbouwen. Vergelijk het maar met die vierkantjes van ministeck (waarvan hiernaast een stukje huisvlijt).
Uitvergroot zie je bij een pixelbestand ook dat vloeiende lijnen ‘rafelig’ worden. Dan kan ook niet anders want het zijn immers vierkantjes die samen een vloeiende lijn nadoen. Pixels zijn daardoor geschikt voor foto’s maar, in combinatie met de resolutie, minder inzetbaar voor ‘harde’ grafische vormen (zoals tekst en lijnen). De meest gebruikte bestandsformaten voor foto’s zijn overigens .jpg, .gif en .png.

Resolutie

De ‘resolutie’ bepaald hoe gedetailleerd je afbeelding kan worden. Denk bijvoorbeeld aan een formaat van 10 x 10 cm waarop 100 blokjes op staan. Als je op hetzelfde formaat 400 blokjes zou krijgen kan de afbeelding veel vloeiender worden opgebouwd.
Dgekarteldie blokjes oftewel pixels worden aangeduid als dpi; dots per inch (of ppi; pixels per inch). Hoe meer pixels er op 2,54 cm, oftewel één inch kunnen, des te meer kleurschakeringen mogelijk.  Totdat het oog de verschillen niet meer waarneemt. De standaardwaarde voor beeldschermen en afbeeldingen voor webzaken is 72 dpi.
Hoe dat andersom zit? Als je 100 blokjes op een formaat van 20 x 20 cm hebt, krijg je dus zoiets ->
vivaresHiernaast zie je dat zelfde plaatje in z’n eigenlijke formaat. Al dat pixelgeweld is nu weg omdat het oog/brein het plaatje er weer strak uit vind zien. Je begrijpt dat je pixelbestanden eigenlijk niet goed kunt vergroten zonder consequenties.

CMYK

CMYK-raster-CMYKOftewel Cyaan, Magento, Yellow en Key (Black). Inkt dus; verf. Fullcolor. Met deze vier ‘oerkleuren’ worden, door middel van puntjes, kleurtinten gedrukt door de drukker; of beter gezegd nagebootst. Want het raster waarmee dat gebeurd is zo fijn dat het brein denkt dat gele en magenta puntjes oranje of rood is. De verf wordt dus niet gemengd, de hoeveelheid puntjes bepalen de opbouw van de kleur.
Onthou dat wanneer je afbeeldingen met ‘verf’ wil kunnen zien je nog steeds iets nodig hebt: namelijk licht. Onthou ook dat je om te drukken hoge resolutiebestanden nodig hebt van 300 dpi.

PMS

pantonePMS staat voor Pantone Matching System waarbij er per gekozen Pantonekleur één vaste kleur inkt wordt aangemaakt. Dus PMS312 is een soort zeegroen en PMS 116 is bijvoorbeeld weer een okergele tint. Een PMS kleur ziet er zuiverder en sprankelijker uit omdat deze dus niet uit (CMYK) puntjes wordt opgebouwd.
Als je die kleur dus probeert in full color te benaderen krijg je dus kleurverschillen in je drukwerk. Zeker in combinatie met de papiersoort. Ik heb het dus niet zo op pantone in dit full color tijdperk. Het wordt overigens nog veel gebruikt bij premiums waar t-shirts, balpennen of paraplu’s in één a twee kleuren worden bedrukt.

RGB

500px-RGBRed Green en Blue. RGB geeft dus licht; is dus zelf ‘het licht’. Je ipad, beeldscherm van je computer; ze kunnen met 3 basiskleuren 16.777.216 kleuren tevoorschijn toveren. Tot aan wit licht toe. Onthou dat iets dat licht voortbrengt (RGB) meer kleuren kan produceren dan iets wat licht nodig heeft (CMYK).

Wat dus niet en wel werkt …

vivaresvivares

• Om een foto te kunnen drukken heeft de drukker op 100% van het eindformaat een 300 dpi bestand nodig. Een 10 bij 10 cm foto op je beeldscherm in 72 dpi zal omgezet naar 300 dpi slechts geschikt zijn om er een plaatje van 24 mm mee te drukken. Je nog-kleinere-logo die je van je site voor drukwerk aanbied, zal dus én vanuit RGB omgezet moeten worden naar CMYK én slechts op een kwart grootte bruikbaar zijn. Trek dus je eigen conclusie want je jeepeegeetje is al zo klein en licht mogelijk gemaakt. Voor je website.

• Voor de duidelijkheid. Een 72 dpi bestand kun je dus in hetzelfde formaat omzetten naar 300 dpi maar het zal de kwaliteit niet echt verbeteren. Je kunt een geminimaliseerd bronbestand niet maximaliseren voor wat anders.

Tip Zorg er voor dat je je logo in drie formaten hebt liggen. De übermoeder is een illustrator.eps bestand in full color CMYK waarden. Daarnaast zijn twee pixelbestanden in RGB handig. Een photoshop.jpg en een transparante .png. In twee kwaliteiten 72 en 300 dpi.

cmykkleur

rgbkleur

‘Maar op m’n scherm ziet het er wel goed uit!?’
Op je beeldscherm kan een plaatje er in RGB misschien prima uitzien. Het scherm van je buurman, van een ander merk en anders gekalibreerd in een andere lichtomgeving, geeft al andere tinten. Laat staan drukwerk. Het is een totaal ander procedé dat je gewoonweg niet kunt vergelijken. RGB stelt de kleur via licht samen. CMYK zie je dankzij licht en bouwt kleuren met inkt op. CMYK kan een heleboel kleuren dus niet fabriceren en slaat daar matter weg.
Oh ja, hetzelfde geld voor PMS kleuren. Eén kleur inkt kan bij benadering nagebootst worden in CMYK maar dat is het. En bij de ene kleur gaat dat moeilijker dan bij de andere.

Tip Wil je zo veel mogelijk éénheid in web en print?
Ga uit van CMYK waarden.

• Vectorbestanden (lijnillustraties) kunnen eenvoudig worden omgezet naar pixelbestanden. Andersom (van pixel naar vector) is zonder flink kwaliteitsverlies weer niet mogelijk.

Dhusss…

Pixelgeorienteerde logo’s zijn prima als je nooit of zelden iets hoeft te drukken. Je ‘leest’ het dan ook wel van het logo af. Dat komt mede omdat illustrator als een moeilijk programma wordt ervaren waardoor de maker in de trukendoos van photoshop doordraaft. Ook geen probleem, maar als er tijdens een snelle actie toch ‘ineens’ een andere versie nodig is merk je aan alles dat daarover niet is nagedacht. Het resultaat van de roll-up actiebanner, vlag, advertentie of 10.000 balpennen ‘valt tegen’ tot ‘ziet er niet uit’. Vector blijft het meest flexibele bestandsformaat, ook bij eventuele aanpassingen.

Tip Heb je een illustrator logo?
Zet je gebruikte letterfont om naar lettercontouren. Dat scheelt achteraf een hoop gedoe met fonts naleveren.

Als laatste
Stel dat jij en je ontwerper/bureau de samenwerking verbreken. Even buiten auteursrechtelijke kwesties om … beschik je over een goed model van het logo? Kun je er zo mee naar een drukker of een webbouwer stappen? Kan je verder met je bedrijf? Het beeldmerk is immers de drager dat op alle media uitingen van je bedrijf voorkomt. De website, het visitekaartje, een flyer, een vlag, rollupbanner, etc … je gezicht dus.
Zorg dus voor een gedegen logo, maak afspraken over het gebruik ervan en over welke aangeleverde bestanden je mag beschikken. Bewaak dat.

A designer is for life, not just for christmas cards.
: ) Frank


© 2016 idonuts

Over idonuts | Voorwaarden