Markin typografinen ääni: miksi mukana tulee fontit

Markin typografinen ääni on sen mukana tuleva typografia: näyttöfontti otsakkeille, tekstifontti muulle tekstille, näyttöfontin vahvuus, kirjainväli ja kirjainkoko. Kun aloitat designin Markilla, sanat käyttävät tätä ääntä. Ensimmäinen luonnos sopii siis jo taustaan. Se on lähtökohta: joka rivin asetuksia voi muuttaa ja omat brändifontit voivat korvata sen.

Miksi taustan mukana tulee fontit

Typografialla on äänensävy aivan kuten puheella. ”Ovet avautuvat seitsemältä” hienolla Garamondilla kuulostaa gallerian avajaisilta. Kapeilla suuraakkosilla se kuulostaa keikalta. Väärällä taustalla kumpikin riitelee designin kanssa. Syvän luumunvärinen Silkki-Mark ja haponvihreä Op-taide-Mark kaipaavat erilaisia kirjaimia. Kun valitset ne yhdessä, ilme tuntuu harkitulta.

Syy on myös käytännöllinen. Useimmat viikoittaisen julkaisun tekijät eivät ole typografeja, ja fonttien yhdistäminen on helppo kohta mennä vikaan. Markiin valmiiksi sovitettu ääni poistaa tämän päätöksen jokaisesta designista.

Mitä typografinen ääni sisältää

Fontit tulevat Gradientlyn fonttikirjastosta. Siinä on antiikvoja, kuten Fraunces, Playfair Display ja EB Garamond, groteskeja, kuten Space Grotesk ja Schibsted Grotesk, kapeita näyttöfontteja, kuten Anton ja Oswald, tasalevyisiä fontteja, käsialafontteja ja pyöristettyjä fontteja. Antiikva vai groteski kertoo kunkin ryhmän tavallisesta vaikutelmasta.

Jos haluat verkkosivusi vastaavan Markia, typografinen ääni siirtyy suoraan CSS:ään. Tässä tavallinen toimituksellinen ääni kirjoitettuna:

h1, h2 {
  font-family: "Fraunces", Georgia, serif;
  font-weight: 400;
  letter-spacing: -0.02em; /* tracking */
  text-transform: none;    /* case: as typed */
}

body {
  font-family: "Inter", system-ui, sans-serif;
}

Miten teksti seuraa typografista ääntä

Jokainen designin teksti tietää, onko se otsake vai leipätekstiä. Otsakkeet seuraavat äänen näyttöfonttia, vahvuutta, kirjainväliä ja kirjainkokoa. Leipäteksti seuraa tekstifonttia. Niin kauan kuin rivillä ei ole omaa fonttia, se jatkaa seuraamista. Jos vaihdat designin Markin, sanat omaksuvat uuden Markin typografisen äänen.

Studion väri- ja typografiapaneeli näyttää Markin äänen otsake- ja leipätekstiparina. Voit käyttää niitä koko sivulla yhdellä kertaa. Tämä auttaa, jos pohjassa on muita fontteja ja haluat sen kuulostavan Markiltasi.

Markin typografisen äänen muuttaminen designissa

1. 1

   Vaihda yksi rivi

   Valitse teksti ja toinen fontti, vahvuus, välistys tai kirjainkoko. Rivi säilyttää nyt oman asetuksensa.

2. 2

   Vaihda koko sivu

   Valitse otsake- ja leipätekstifontti ja käytä niitä sivulla. Kaikki otsakkeet ja kappaleet muuttuvat yhdessä.

3. 3

   Käytä brändifonttejasi

   Lisää brändipakettiin otsake- ja leipätekstifontti. Lataa tarvittaessa omat OTF-, TTF-, WOFF- tai WOFF2-tiedostot. Käytä sitten brändifontteja koko sivulla yhdellä kertaa.

4. 4

   Pyydä Designerilta

   Designer käyttää brändipakettia puolestasi, joten sen tekemät designit alkavat brändisi fonteilla.

Fontin lataamista käsittelee omien fonttien lataaminen ja muuta pakettia brändipaketin perustaminen. Tarkista lisenssi ennen kaupallisen fontin lataamista. Fonttien lisenssit kertoo, mitä etsiä.

Kokeile Markia muilla typografisilla äänillä

Markin sivulla Markkinoilla voit vaihtaa esikatselun sen omasta äänestä viiteen valmiiseen fonttipariin. Näet ilmeen brändiäsi lähempänä olevalla typografialla ennen suunnittelun aloittamista.

Milloin säilyttää oma ääni ja milloin vaihtaa fontit

Pidä kummassakin tapauksessa käytössä enintään kaksi fonttia ja anna koon sekä vahvuuden hoitaa muu. Selkeä hierarkia on fontteja tärkeämpi, kuten visuaalinen hierarkia näyttää. Markissa luettavuus hoidetaan erikseen: rauhallisin alue siirtyy tekstin taakse ja Automaattinen muste valitsee jokaiselle riville vaalean tai tumman tekstin fonttivalinnasta riippumatta.