Färgfonter En nybörjarhandbok

Så vad är det med en färgfont? Det är en term som håller på att dyka upp och börjar få traktion, även om användningen i stora designprojekt fortfarande är i sin linda.

Leverantörer som Adobes Typekit har börjat släppa några färgfontsalternativ med webbläsarsupport, så det finns viss rörelse mot bredare användning. Vissa har även kallat färgfonter? Nästa stora sak i webbdesign.?

Här tittar vi på trenden och låter dig bestämma hur stor - eller inte - Detta koncept kommer att bli.

Vad är en färgfont?

Färg typsnitt är nästan exakt vad de låter som. Teckensnitt som innehåller flera färger, nyanser eller gradienter, texturer eller transparens. Dessa funky alternativ är inte bara att lägga färg till bokstäver, de är specifika teckensnitt med all detaljering ingår.

Färgfonter kan innehålla vektorgrader, bitmappsbilder eller båda i teckensnittsfilerna, vilket kan göra dessa tecken tyngre än standardfontspaket. Vanliga exempel på färgfonter inkluderar en emoji typsnitt eller brev som innehåller ikoner inom. Enfärgade teckensnitt i denna stil kallas ofta kromatiska teckensnitt, eftersom de bara innehåller en nyans eller grå.

Den största problemet med färgfonter just nu är att det inte finns något sant standardformat. Och det finns en fångst med alla dessa filformat - vektor och SVG-bilder kan enkelt skalas, men bitmapversionerna kan eventuellt ha storlekar begränsningar.

Det finns faktiskt fem format att hantera:

  • SBIX (Apple): Bitmap-version med inbyggt stöd på Mac och iOS-system
  • CBDT (Google): Bitmap-version med inbyggt stöd på Android-system
  • COLR (Microsoft): Vektorversion med inbyggt stöd på Windows 8.1+ -system
  • SVG (W3C): Vektor och bitmap versioner
  • OpenType SVG (Adobe / Mozilla): Vektor- och bitmappsversioner som sätter SVG-former i OpenType-teckensnitt

Å andra sidan börjar stora aktörer att anta riktlinjer för användningen. Mozilla (ryggraden i webbläsaren Firefox) och Adobe har kommit överens om att OpenType SVG är det föredragna formatet. andra är fortfarande i flux när de kommer till ett beslut.

Om du vill komma in i det nitty gritty av hur dessa teckensnitt fungerar och alla filformat specifikationer, Fontself har en ganska bra primer.

Hur använder du färgfonter?

En av två tankar händer när du först ser en färgfont:

  • Wow, det är hemskt!
  • Häftigt! Jag vet exakt hur man använder det!

Oavsett vilket läger du befinner dig finns det applikationer som passar perfekt för färgfonter. Men du måste använda dem inom förnuft. (Färgfonter är mest sparsamma av sparsam användning.)

Prova en färgfont:

  • För en uppmärksammande teknik för ett kort ord
  • För ett ikon eller ett logotypelement
  • För en droppelock för att starta ett långt block av text
  • För en djärv rubrikbehandling i en annars minimal stildesign
  • Att föra fokus till ett visst ord eller ord i ett stort textblock
  • När resten av designen är enkel
  • När typografi blir ditt primära konstelement
  • När projektet kräver något roligt och ovanligt att ta upp användarens uppmärksamhet
    • Så här använder du inte färgfonter

      Det finns flera sätt att inte använda färgfonter än vad du förmodligen kan räkna med. Du vill inte återgå till webbdesign till några av de blinkande, blinkande, överväldigande färggalenskapen på 1990-talet.

      Använd inte en färgstämpel:

      • Med bilder eller ovanpå bilderna
      • Med upptagen bakgrund
      • För mycket text
      • Med många andra designtekniker, som animering eller rörelse; färgen ensam är vanligtvis tillräcklig för att skapa visuell påverkan
      • Med andra nyhet eller specialtecken

      En utvecklande trend

      Färgsnittstendensen börjar få traction från några större aktörer i typografi. OpenType SVG-formatet som adopteras av Adobe och Mozilla kan vara det verktyg och format som hjälper den här trenden att verkligen ta slut. Adobe har nyligen tillagt färgfonter till Photoshop (du kanske har märkt några emojis i teckenpaletten).

      Så här förklarar Adobe OpenType SVG:

      ? OpenType-SVG är ett typsnitt där ett OpenType-teckensnitt har alla eller bara några av dess glyfer representerade som SVG (skalbar vektorgrafik). Detta möjliggör visning av flera färger och gradienter i en enda glyph. På grund av dessa funktioner hänvisar vi också till OpenType-SVG-teckensnitt som "färgfonter".

      ? OpenType-SVG-teckensnitt tillåter att text visas med dessa grafiska egenskaper, samtidigt som den tillåter att den redigeras, indexeras eller söks. De kan också innehålla OpenType-funktioner som tillåter glyfsubstitution eller alternativa glyph-stilar.

      ? Färgfonter som Trajan Colour Concept och EmojiOne Color kommer att visas precis som typiska teckensnitt i programmens menyer men de kanske inte visar sin fulla potential, eftersom många program ännu inte har fullt stöd för färgkomponenterna. Om ditt program inte stöder SVG-bilderna inom teckensnitten, kommer glyphs att falla tillbaka till en solid svart stil. Färg kan fortfarande tillämpas på den här fallback-stilen, eftersom den fungerar som ett typiskt OpenType-teckensnitt.?

      Vidare har webbtyperna ett avsnitt som är dedikerat till uppdatering av webbläsarstöd för färgfonter, så att du kan bestämma när tiden är rätt för att du ska ta ut spelet.

      När det gäller utvecklingen av färgfonter och antagande av användningen kommer två saker att spela en viktig roll:

      • Antagande och kompatibilitet med webbläsare för webbdesignprojekt (just nu visas mer färgfontsignaler i tryck på grund av kompatibilitetsproblem)
      • Övergripande stiltekniker och huruvida mer utsmyckade och färgstarka designtekniker tränar överallt

      Prova en färgtecknad

      Om färgfonter är din sak kan du antingen ladda ner en färgfont för att komma igång eller skapa din egen, beroende på typ av designprojekt.

      Skapa din egen

      Den typ av färgfontur du skapar slår verkligen på dina mjukvarukunskaper. En färgteckning kan innehålla allt från bilder från dina favoritfoton till vackra bubblor och slag i gradientfärger. Du kan göra det helt på egen hand eller använda ett verktyg för att hjälpa till att designa en anpassad färgfont.

      • Fontself är en Adobe Illustrator eller Photoshop-tillägg som hjälper dig att skapa egna färgfonter
      • Du kan rita och designa allt från början med denna handledning från Glyphs
      • FontLab har en videohandledning som går igenom processen steg för steg

      Hämta eller Bädda in

      Det finns några ganska fina färg teckensnitt där ute som skriker för att du ska använda dem i ett projekt idag. Här är några för att hoppa på ditt kreativ flöde för färgsteg (plus länkar till de andra färgfonterna som används ovan):

      • Skriv med stolthet
      • Handduk
      • bungee
      • Akvarell typsnitt
      • Bixa Färg
      • Barnleksaker
      • OneLine Bold
      • Guru
      • Neon

      Slutsats

      Är du redo att hoppa på färgtypen trenden? Är det för mycket eller är det spottiga stödet ett verkligt problem för dina projekt?

      Personligen tycker jag att denna trend är mycket roligt och har verklig praktisk användning i utskriftsprojekt som evenemangsplattor eller flygblad. Jag är fortfarande inte helt övertygad när det gäller webbprojekt men. Tiden kommer bara att berätta om den här trenden verkligen blir? Nästa stora sak i webbdesign? eller en annan flyktig kram.