tiistai 19. toukokuuta 2015

KIRJAINLEIKKAUKSISTA NÄYTÖLLÄ (Fonteista)

Näyttölaitteisiin suositellaan, lukututkimusten mukaan, niin kutsuttuja "sans serif"-leikkauksia: font-family:Arial, Helvetica, sans-serif; (ja vastaavat).
Fonttien (kirjasinten) luettavuuden huomioiminen on erittäin tärkeää pienemmissä näytöissä kuten matkapuhelimet ja älypuhelimet.

Nykyisin käytössä olevilla tietokonenäyttöjen resoluutioilla, kirjasinleikkausten finenssit saadaan ainakin otsakkeissa hienosti esille. MUTTA. Haluatko koodata sivusi Flashillä tai sellaisilla menetelmillä, jotka takaavat kirjainleikkausten siirtymisen asiakaskoneelle? Sellainen ei ole kovin asiakasystävällistä, koska Flash vaatii selaimelle asennettavan ja päivitettävän plug-in ohjelman. On asiakkaan kyykyttämistä kun hän sivuille saapuessaan saa ensimmäisenä vastaan ilmoituksen, että hänen selaimensa ei tue näitä sivuja, "lataa Flash" tai "käy päivittämässä Flash-versiosi". Tai asiaks lukee varoituksia, kuinka Flashissa on turvallisuuaukko jne.  Noloa.
Nykyään Flash alkaa olla kirosana jo muuallakin, kuin vain omassa puheessani.

Web- standardin mukaisten kirjasinten kokoa voidaan nykyään säätää suoraan asiakasselaimelta MUTTA, jos koodari ei sitä ole esim. Flash sovelluksissaan huomioinnut, kirjainkoon muuttaminen ei asiakkaalta onnistu.

Jos olet varma, että jokainen verkkosivuasiakkaasi  käyttää standardin mukaista selainta (esim. suljettu yrityssivusto), kuten Opera, Firefox, Safari, jne. voit käyttää CSS3 ja HTML5 ominaisuuksia, joiden avulla voidaan hyödyntää web palvelimilta ladattavia, erikoisempiakin kirjasinleikkauksia. Chrome ja Internet Explorer 9 tukee myös CSS3 ja HTML5 toteutettuja verkkosivuja.
Kokenut ja verkkoasiakkaita (loppukäyttäjä) arvostava verkkosivuntekijä varmistaa, että sivut voidaan lukea kaikilla valtaselaimilla muutaman version iästä huolimatta. Ikääntyville tarkoitettujen sivujen tulee näkyä myös vanhemmilla valtaselainversioilla - ja - tulee ajatella mikä olikaan valtaselain joitakin vuosia takaperin. Ikääntyvä ei seuraa trendejä vaan käyttää verkkoa kuten ennenkin.

Google fonts- tarjoaa myös mahdollisuuden lukuisiin eri tekstityyppeihin verkkosuunnittelijalle. Joukosta löytyy varmasti jokaiselle jotakin. MUTTA. On muistettava, että fontti (kirjasintyyppi) ei saa haitata viestin perillemenoa. Useamman eri fontin sekamelskaa ei kukaan jaksa lukea. Pidä aina ensisijalla sivusi luettavuutta.
Samoin tekstin väreistä musta on ehdoton ykkönen (vaaleat taustat). Jos haluat rikastaa tekstiäsi värein, on turvallisinta pitäytyä mahdollisesti esim. otsakkeiden yhden ja saman värin käyttöä läpi sivuston. Siten sivustosi pysyy yhtenäisenä, eikä aiheuta hämmennystä erivärisine otsakkeineet. "Olenko vielä sillä sivustolla jonne alunperin menin?"
Valkoinen teksti tummilla taustoilla ei ole erityisen luettavaa. Varsinkin pidemmissä teksteissä silmät rasittuvat tarpeettomasti.

Lisätietoa aiheesta kiinnostuneille:
https://www.w3.org/Fonts/ (W3C on Web-standardien ylläpitäjä ja kehittäjä)
https://www.w3.org/TR/WCAG20/ (kaikille verkkosuunniteelijoille erinomaista lukemistoa)
http://www.webtypography.net/
https://www.google.com/fonts (Google fonts. Muistakaa antaa erikoiskirjaimille aina standardi vaihtoehto. Vain siten koodaajalle jää jokin vaikutusmahdollisuus asian luettavuuteen tai ilmeeseen)

Web safe fonts 2013 (HTML5)
http://forbrains.co.uk/web_safe_fonts/web_safe_fonts
http://www.w3schools.com/css/css_font.asp

Ei kommentteja:

Lähetä kommentti