Kromatiske skrifttyper og fladt design
Webens stigende fornemmelse med fladt design har ført til en hurtig afvisning af artifice som drop shadows, til fordel for et renere mere formbaseret look. Men dette efterlader designeren et problem: Hvordan stiler du stilen til at være levende, samtidig med at du overholder principperne om fladt design?
En løsning er den fornyede interesse for kromatiske skrifttyper. I udbredt anvendelse i tres bloktrykning fra 1800-tallet bruger kromatiske typer ansigter flere farver til at definere forskellige områder. Dette er den polære modsatte tilgang til moderne logo design, hvor vi læres, at former skal fungere i en enkelt tone.
Fordelen med kromatiske mønstre er, at de tilføjer dybde, vægt og karakter; uden behov for mere påtrængende tekstindretning såsom skygger.
Et af de bedste eksempler på dette er Sodachrome. Designet af Dan Rhatigan og Ian Moore består Sodachrome af to separate skrifttyper; en, hvor seriferne peger mod venstre, og en hvor de peger til højre. Sæt individuelt de to skrifttyper ser tydeligt ubalanceret, men lægges over hinanden i forskellige farver, de producerer en attraktiv slab-serif. Den ekstra fordel ved Sodachrome er, at overlapningen mellem de to farver skaber et tredje ansigt, et moderne sans-serif, der ligger i hjertet af designet. Den visuelle interesse for Sodachrome er skabt af samspillet mellem disse tre forskellige designs.
Sodakrome af Dan Rhatigan og Ian Moore.
Udvikling af kromatiske skrifttyper til brug på nettet er noget af en udfordring. Mens design som Lisa Lonergans Knoxville Følg meget traditionelle romerske konturer, designs som Mark Frömbergs Pigment - som indeholder 600 tegn - passer ikke let ind i vektorformatformater.
Knoxville af Lisa Lonergan.
Pigment af Mark Frömberg.
Typefaces, selv grunge-stil ansigter, er designet som en skitse. Konturerne kan skaleres, farves og adskilles, men designeren vælger. OpenType (OT), TrueType (TT), Web Open Font Format (WOFF) og næsten alle andre tilgængelige format fungerer på denne måde. Det betyder, at et kromatisk design ikke kan specificeres i en enkelt fil. Men forudsat at det kromatiske skrifttype leveres som to separate skrifttypefiler, kan vi let lægge hinanden over hinanden.
CSS vil endda tillade os at duplikere titlen i stilarterne ved hjælp af indholdsegenskaben og undgå at fordoble indholdet i markeringen, hvilket ville have en negativ indvirkning på SEO og tilgængelighed.
Grundformatet er:
Any old title
Og i CSS:
h1{font-family:"Some Chromatic Font A";color: rgba(50, 0, 0, 0.5);position:relative;}h1:after{font-family:"Some Chromatic Font B";color: rgba(0, 50, 50, 0.5);position:absolute;left:0;content:"Any old title";}For øjeblikket er manglen på kromatiske skrifttyper, der produceres til webbrug, sandsynligvis at betyde, at deres brug er et skridt for langt til steder som blogs, der kræver adskillige overskrifter. Men for logoer eller overskrifter, der sjældent ændrer sig, hvor brug af et billede er acceptabelt, er kromatiske skrifttyper en levende og engagerende måde at indstille type, der bevarer en flad æstetik.
Har du arbejdet med kromatiske skrifttyper? Hvilke tekniske vanskeligheder oplevede du? Lad os vide i kommentarerne.