Typografie

Typography is arranging text in an engaging, interesting and legible way that gets the message across most appropriately. It includes the layout, spacing, sizes, hierarchy, colour and integration of type across a variety of mediums. It is important that Typography matches the brand personality, and in doing so contributes to the overall recognizability.
Brand component

Typografie

Typography is arranging text in an engaging, interesting and legible way that gets the message across most appropriately. It includes the layout, spacing, sizes, hierarchy, colour and integration of type across a variety of mediums. It is important that Typography matches the brand personality, and in doing so contributes to the overall recognizability.

Bij Smaac wordt gebruik gemaakt van een sterke typografische voering. Op deze pagina leggen we je daar alles over uit.

Basisopmaak

Hierboven zie je de basisopmaak van teksten in de huisstijl van Smaac. Zoals je ziet bevat deze opmaak veel contrast in lettergrootte. Om dit contrast nog groter te maken bestaat de titel enkel uit hoofdletters.  Daarnaast wordt de tekst verder naar rechts uitgelijnd dan de titel en subtitel.

Afstanden

De afstanden tussen de elementen uit deze opmaak zijn bepaald volgens een vast patroon. De grootte van de maatstreepjes in bovenstaande afbeelding zijn gelijk aan de hoogte van tekens in de titel. De verticale ruimte tussen de subtitel en de titel is een halve eenheid. Tussen de titel en de tekst zit één eenheid aan witruimte. Ook de horizontale uitlijning is gebaseerd op deze eenheden. De tekst is tweeënhalve eenheid verder naar rechts geplaatst dan de titel en de subtitel.

VOORBEELDEN VAN ANDERE TEKSTOPMAAK

Quote over fotografie

De quote zelf heeft het font PT Serif Italic.

De tekst onder de afbeelding bestaat uit twee regels. De bovenste regel heeft het lettertype Inter Semibold. Stel de lettergrootte in op 25% van de quote. De witruimte tussen de afbeelding en deze regel is een halve eenheid.

De tweede regel heeft het lettertype Inter Regular. Stel de lettergrootte in op 15% van de quote. De witruimte tussen deze tweede regel en de eerste regel heeft de grootte van een kwart eenheid oftewel een kwart van de regelhoogte van de quote.

Quote op effen achtergrond.

Wanneer we de aandacht willen vestigen op één specifieke quote kan deze op een effen achtergrond geplaatst worden. In dit geval staat deze quote op een blauwe achtergrond om extra op te vallen tussen andere, donkere elementen. Voor deze quote is gebruik gemaakt van het font Inter Semibold met een regelafstand van 0.9 * de waarde van de lettergrootte.

Om meer aandacht te vestigen op bepaalde woorden zijn andere woorden doorzichtig gemaakt. We maken gebruik van een doorzichtigheid van 50% voor de minder belangrijke woorden en een volledig dekkende vulling voor de andere woorden.

Serif variant

Soms wordt ook het serif lettertype PT Serif gebruikt op een effen achtergrond. Er is eigenlijk nooit een duidelijke regel bedacht voor deze variatie. Daarom noem ik het voor nu maar een afwijking.

Lettertypen

In de afbeelding hierboven is te zien waarvoor we welk lettertype gebruiken. De lettertypen moeten echter nog wel ingesteld worden om tot dit resultaat te komen. Daarnaast staan de lettergroottes van deze fonts in een vooraf bepaalde verhouding met elkaar.

Typefaces

Voor de sub header gebruiken we PT Serif Italic. De tekengrootte van dit font is 1,4 keer zo groot als de tekst. Voor dit font zijn geen verdere aanpassingen nodig.

Hiervoor gebruiken we Inter Semibold. Stel dit lettertype 5 keer zo groot in als de tekst. De tekenafstand van de titel wordt ingesteld op -60. Ten slotte passen we de regelafstand aan op 0,9 keer de waarde van je lettergrootte. Gebruik je dus een lettergrootte van 250, stel dan je regelafstand in op 225.

We gebruiken hiervoor Inter Regular. In tegenstelling tot de titel veranderen we de tekenafstand van dit element niet. Deze blijf dus 0. De regelafstand wordt wel aangepast. We passen de regelafstand aan op 1,5 keer de waarde van je lettergrootte. Gebruik je dus een lettergrootte van 37,5 stel dan je regelafstand in op 56,25.

‍

Close-up of layered cards showing services labeled CGI, Social Media, Websites, Visualizations, and Logo Development.

Download

The assets of this page for use in other programs
When you download and use any of this hubs resources, you accept the Terms & Conditions.
Typografie
↗
Typografie
↓

Brand Components

All the elements that make up your brand's visual identity

Smaac

Logo's

Kleuren

Typografie

Templates

Explainer Video

Created by
Smaac logo
Created by
Smaac logo
Click to copy