Miksi jotkut brändit vaikuttavat heti luotettavilta ja toiset amatöörimäisiltä, vaikka tuotteet olisivat hyviä? Yksi syy on fonttien valinta verkkosivustolla. Et tarvitse suunnittelijan tutkintoa parantaaksesi tilannetta. Tarvitset selkeän määritelmän ja muutaman käytännön tarkistuksen.
Verkkosivuston leipätekstiin parhaat fontit ovat sellaisia, jotka pysyvät luettavina pienessä koossa näytöllä. Tässä luvussa kerrotaan selkeästi, mitä se tarkoittaa, miksi se vaikuttaa verkkosivustoosi ja markkinointiisi ja miten sen voi ottaa käyttöön ilman jargonia. Näet myös, miten fonttien yhdistäminen kuuluu samaan kokonaisuuteen. Käydään se läpi askel kerrallaan.
Mitä parhaat fontit verkkosivustolle tarkoittaa käytännössä
Verkkosivuston leipätekstiin parhaat fontit ovat sellaisia, jotka pysyvät luettavina pienessä koossa näytöllä.
Otsikkofontilla voi olla enemmän persoonallisuutta, jos leipäteksti pysyy selkeänä.
Fonttien yhdistäminen ja verkkoturvalliset fontit yhdessä pitävät sivuston nopeana ja yhtenäisenä.
Näin otat parhaat fontit käyttöön sivustollasi
Aseta leipätekstin peruskooksi vähintään kuusitoista pikseliä ja riviväliksi noin yksi ja puoli.
Aloita yhdestä sivusta, kuten etusivusta tai pääasiallisesta laskeutumissivusta. Korjaa suurin ongelma ensin ja vie sama ratkaisu sitten muihin pohjiin.
Lue tämän luvun parina fonttien luettavuus perustaksi ja typografia verkkosuunnittelussa seuraavaksi askeleeksi tässä osiossa.
Käytännön tarkistuslista, jonka voit ottaa käyttöön tänään
Aseta leipätekstin peruskooksi vähintään kuusitoista pikseliä ja riviväliksi noin yksi ja puoli.
Kun tarkastelet mitä tahansa sivua, mieti, näkyvätkö parhaat fontit verkkosivustolle jo ensimmäisellä vierityksellä puhelimessa. Jos eivät, järjestä osiot uudelleen ennen kuin viimeistelet yksityiskohtia.
Tallenna kuvakaappaukset ennen muutoksia ja niiden jälkeen, jotta näet, mikä muutos auttoi fonttivalintojen kanssa sivustollasi.
Anna tämä lista kaikille, jotka päivittävät sivustoasi, jotta fonttien yhdistäminen pysyy yhtenäisenä uusillakin sivuilla.
Valitse tälle kuulle yksi seurattava mittari, kuten sivulla vietetty aika tai lomakkeen aloitukset. Silloin ulkoasun muutokset liittyvät liiketoiminnan tuloksiin eivätkä pelkkään makuun.
Miten tämä aihe liittyy laajempaan brändiisi
Visuaaliset valinnat eivät yleensä rajoitu yhteen sivuun. Fonttien yhdistäminen ja verkkoturvalliset fontit yhdessä pitävät sivuston nopeana ja yhtenäisenä.
Some-julkaisujesi, sähköpostiesi ja painotuotteidesi kannattaa toistaa samaa hierarkiaa, samoja värejä ja samoja kirjasinsääntöjä kuin verkossa.
Kun brändin visuaalinen ilme alkaa hajota, asiakkaat aistivat hienovaraisen epäsuhdan, vaikka eivät osaisi selittää sitä.
Lue typografia verkkosuunnittelussa, niin voit verrata muistiinpanojasi tämän osion toiseen lukuun.
Otsikkofontilla voi olla enemmän persoonallisuutta, jos leipäteksti pysyy selkeänä.
Kysymykset, jotka usein unohtuvat
Lisähakusanat, kuten fonttien yhdistäminen ja verkkoturvalliset fontit, auttavat etsimään syvällisempiä esimerkkejä ja vertaamaan työtäsi yleisiin käytäntöihin.
Fonttien yhdistäminen ja verkkoturvalliset fontit yhdessä pitävät sivuston nopeana ja yhtenäisenä.
Kirjoita ylös yksi ennen ja jälkeen -muutos, jonka testaat tällä viikolla toimivalla sivulla. Pienet mitatut muutokset ovat parempia kuin hatarat suunnitelmat.
Kun tiimilläsi on yhteinen sanasto fonttivalinnoista verkkosivustolla, suunnittelijoiden ja toimistojen kanssa tarvitaan vähemmän korjauskierroksia.
Työkalut, jotka helpottavat visuaalisia päivityksiä
Moniin asettelun ja tyylin ongelmiin ei tarvita omaa koodia. Visuaalisella editorilla voit säätää välejä, värejä ja kirjasimia ja esikatsella samalla puhelin- ja tietokonenäkymää.
WEMASYn Sivustonrakentajassa on visuaalinen muokkaus, joten voit julkaista muutokset odottamatta kehittäjää jokaisen pikkusäädön takia. Avaa Sivustonrakentaja, kun olet valmis soveltamaan oppimaasi.
Kun julkaiset päivityksiä, tarkista uudelleen fonttien luettavuus ja fonttihierarkia, jotta osio pysyy yhtenä kokonaisuutena mielessäsi.
Sinulla on nyt toimiva näkökulma parhaiden fonttien valintaan. Käytä sitä, kun käyt läpi sivustoasi, hyväksyt markkinointiaineistoja tai ohjeistat suunnittelijaa. Jatka lukuihin fonttihierarkia ja typografia verkkosuunnittelussa, niin vauhti säilyy tässä osiossa.
Usein kysytyt kysymykset
Kauanko fonttivalintojen parantaminen kestää?
Useimmat pienyritykset saavat sivunsa selkeämmiksi muutamassa keskittyneessä työvaiheessa, kun käyttävät tämän luvun perusasioita. Aloita etusivusta ja vie samat säännöt sitten palvelu- ja yhteystietosivuille.
Tarvitsetko suunnittelijan fonttien valintaan?
Suunnittelijasta on apua laajoissa brändiuudistuksissa, mutta moni fonttivalintoihin liittyvä korjaus onnistuu itse, kun tiedät, mitä katsoa. Lue tämän luvun rinnalla fonttien luettavuus, niin saat aiheesta lisää.
Voiko WEMASY auttaa fonttien valinnassa verkkosivustollasi?
WEMASYn Sivustonrakentajassa on visuaalinen editori, jolla voit säätää asettelua, värejä ja kirjasimia ilman koodia. Avaa Sivustonrakentaja, niin voit päivittää pohjia ja esikatsella muutoksia puhelimessa.
Mikä on yleisin virhe fonttien valinnassa?
Ihmiset yrittävät korjata kaiken kerralla sen sijaan, että etenisivät yksi sivu kerrallaan. Valitse yksi tärkein asia, kuten luettavuus tai kontrasti, ja katso sitten fonttihierarkia seuraavaa parannusta varten.
Miten fonttien valinta liittyy SEO:hon?
Selkeä visuaalinen hierarkia ja luettava teksti pitävät kävijät pidempään sivulla, mikä tukee merkkejä, joita hakukoneet seuraavat. Yhdistä ulkoasun korjaukset toimivaan sisältörakenteeseen, niin tulos on paras.
Mitä kannattaa lukea seuraavaksi fonttien valinnan jälkeen?
Jatka tämän kirjan luvuilla fonttien luettavuus ja fonttihierarkia, niin rakennat brändillesi kokonaisen visuaalisen järjestelmän verkkoon.