Brauserite erinevused

Kõik veebibrauserid tõlgendavad HTML-i märgendeid pisut erinevalt. Tabelite, vormide ja graafilise asetuse ja joonduse märgendid töötavad iga veebibrauseri või operatsioonisüsteemi puhul erinevalt. Need pisierinevused jäävad enamasti märkamata, kuid väga täpse või komplekse veebilehekülje paigutuse puhul võivad need viia ebameeldivate üllatusteni. Kui suur osa teie lugejatest kasutab Macintoshi, Linuxi või UNIXi operatsioonisüsteeme, peaksite oma keerulisemate lehekülgede ja programmide töötamist katsetama ka nendes. Kahjuks on platvormispetsiifilised vead suures veebis tavalised.

Hea loetavus sõltub visuaalsest kontrastist ühe ja teise kirjatüübi ning tekstiblokkide, pealkirjade ja ümbritseva tühja osa vahel. Mitte miski ei köida lugeja pilku rohkem kui tugev kontrast ja iseloomulikud mustrid ning need omadused saavutate üksnes ettevaatliku kujundamisega oma lehel. Kui iga lehekülg on tihedat teksti täis, näevad lugejad seda halli seinana ning selline visuaalse kontrasti puudumine tundub neile vaistlikult eemaletõukav. Isegi rasvane kirjatüüp muutub kiiresti monotoonseks: kuna kui kõik on rasvane, ei eristu miski.

Kui sisuks on valdavalt tekst, on just tüpograafia vahend, mida kasutada lehekülje ülesehituse elavdamiseks. Esimene asi, mida lugeja näeb, ei ole lehekülje pealkiri ega teised detailid, vaid lehekülje üleüldine muster ja kontrast. Teksti ja graafika hoolikal paigutamisel saavutatud korrapärased korduvad mustrid aitavad lugejatel tuvastada informatsiooni asukohta ja struktuuri ning parandavad loetavust. Ebaühtlane tüpograafia muudab lugejale korduvate mustrite nägemise raskeks, nii et tal on peaaegu võimatu ennustada, millises kohas dokumendi sees talle vajalik teave asub.

Joondus

Joondused määravad lehekülje lugemisala, eraldades põhiteksti ümbritsevast keskkonnast. Need pakuvad igasugusel dokumendil visuaalset vaheldust. Joondusi ja tühemikke võib kasutada põhiteksti esiletõstmiseks lehekülje teiste elementide seast. Järjekindlal kasutamisel annavad need ühtse välimusel tervele materjalile, luues lehekülgedele tervikliku struktuuri ja ilme. Eristades ekraani positiivset ruumi (tekst, graafika) negatiivsest ruumist (tühemik) lisavad nad ka visuaalset huvitavust.

Tekstiblokid võivad paigutuda mitmel erineval viisil. Veebis on võimalik kasutada järgmisi joondusvalikuid: vasakjoondus, keskjoondus ja paremjoondus.

Rööpjoondus (näiteks järgnev lõik)

Rööpjoonduse korral on nii teksti vasak kui parem serv paralleelsed. Rööpjoondatud tekstiblokid moodustavad soliidseid nelinurki ning bloki pealkirjad on tavaliselt keskjoondatud, nii et tulemuseks on sümmeetriline, ametliku välimusega dokument. Trükis saavutatakse rööpjoondatus sõnade vahekauguse reguleerimise ja poolitamise abil. Küljendusprogrammid kasutavad poolitamissõnastikku, et kontrollida ja paigaldada iga rea lõppu poolitamine ning seejärel reguleerida rea sõnade vahet. Kuid isegi keeruka küljendustarkvara puhul kannatavad rööpjoondatud tekstiblokid sageli kehva reavahe ja ülemäärase poolitamise all ning vajavad käsitsi parandamist. Taolist kontrolli ei ole veebilehekülgede puhul võimalik isegi ligilähedaselt saavutada. Kõige hilisemad brauseriversioonid toetavad rööpjoondatud teksti, kuid see saavutatakse sõnavahe tahumatu kohandamisega. Madala resolutsiooniga arvutiekraanidel ei ole hea kohandamine võimalik ja on praegustes veebibrauserites rakendamiseks liiga ebapraktiline. Lisaks ei ole tõenäoline, et veebibrauserid lähiajal automaatset poolitamist kasutama hakkavad, kuigi korraliku rööpjoondamise jaoks on see möödapääsmatu. Esialgu on selge, et kui kasutada veebilehekülgedel rööpjoondamist, siis nende lehekülgede loetavus kannatab.

Kesk- ja paremjoondatud tekstiblokid (näiteks järgnev lõik)

Kesk- ja paremjoondatud tekstiblokke on raske lugeda. Me loeme vasakult paremale, võttes jälgimise pidepunktiks vasaku vertikaaljoone. Teksti kesk- või paremjoondusest tulenevad sakilised vasakpoolsed küljed muudavad teksti jälgimise palju raskemaks, kuna silm peab iga rea algust otsima.

Vasakjoondatud tekst (näiteks järgnev lõik)

Vasakjoondatud tekst on veebilehekülgede puhul kõige loetavam võimalus, kuna vasak serv on ühtlane ja ennustatav ning parem serv on ebakorrapärane. Erinevalt rööpjoondatud tekstist, ei nõua vasakjoondus sõnavahede kohandamist; vahede ebavõrdsus koondub ridade lõppu. Tulemuseks olev “sakiline” parem serv lisab leheküljele vaheldust ilma loetavust segamata.

Pealkirjade joondamine

Vasakjoondatud teksti pealkirjad ja päised peaksid samuti olema vasakule joondatud. Keskel olevad pealkirjad sobivad hästi rööpjoondatud tekstiga, kuid veebilehekülgedel ei tohiks rööpjoondatud teksti kasutada. Pealkirjade keskjoondamine oleks kontrastiks põhiteksti sakilise parema äärega, tekitades ebasümmeetrilise ja tasakaalutu lehekülje, kuid on praktikas tihti kasutatud.

Seega soovitame reeglina alati kasutada vasakjoondatud tekstiblokke ja pealkirju.

Rea pikkus

Arvutiekraanilt ei ole raske teksti lugeda mitte üksnes arvutiekraanide madala resolutsiooni tõttu, aga ka sellepärast, et enamike veebilehekülgede küljendus rikub raamatu ja ajakirja tüpograafia põhireeglit: suuremal osal veebilehekülgedest on read lihtsaks lugemiseks liiga pikad. Ajakirjade ja raamatute veerud on kitsad füsioloogilisel põhjusel: normaalsel lugemiskaugusel on silma fookusala umbes 7-8 cm laiune, seega püüavad küljendajad hoida tihedate tekstiveergude laiuse umbes selles mugavas vahemikus. Laiemad tekstiread nõuavad, et lugeja liigutaks pisut oma pead või pingutaks silma lihaseid, et pikki tekstiridu jälgida. Loetavus kannatab, kuna lugeja võib vasakut äärt otsides järje ära kaotada.

Rea pikkuse piiramiseks umbes viiekümne kuni seitsmekümne tähemärgini rea kohta võib kasutada nähtamatuid (piirjoonteta) tabeleid. Tähemärkide täpset arvu on raske ennustada, sest erinevad brauserid ja operatsioonisüsteemid kuvavad kirjasuurusi erinevalt. Tavalises trükiküljenduses peetakse ideaalseks kolmekümne kuni neljakümne tähemärgiste ridadega veerge.

Lõpuks on otsus piirata rea pikkust filosoofiline. Disaini seisukohast on heaks tavaks mõõt, mida on mugav lugeda. Samas on veebi üheks aluspõhimõtteks, et kasutajad peaksid saama ise oma vaadet kohandada. Suurte monitoridega kasutajad ei pruugi tahta oma tekstiblokke piirata, kui see tähendab, et suur osa ekraanist jääb kasutamata. Halva nägemisega kasutajad, kes kasutavad vaatamisel suurt kirja, ei hinda seda, kui nad on sunnitud vaatama pikki lehekülgi, kus on lühikesed read. Seega võib loetavus küll halveneda, kui tekst jäetakse vabalt brauseriakent täitma, kuid dokumentide loetavust võivad mõjutada ka järgmised tavad.

Fikseeritud laiusega küljenduses kasutame enamasti küljendtabeleid, milles tekstilahtrid ei ole laiemad kui umbes 365 pikslit. Kui kasutada Times New Roman kirjatüüpi suurusega 12, mahutab selline lahter umbes viiekümne märgi pikkuse rea, kus on keskmiselt üheksa kuni kümme sõna. Me usume, et sellega saavutatakse parim tasakaal tõhusa ruumikasutuse ja loetavuse vahel.

Tühi ruum

Vertikaalset ruumi tekstibloki sees nimetatakse reavaheks (leading) ning see on vahe ühest tekstijoonest teiseni. Reavahe mõjutab tugevalt tekstiblokkide loetavust: liiga lai reavahe muudab silmale raskeks järgmise rea alguse määramise, samal ajal kui liiga kitsas reavahe muudab trükikirja rea segaseks, kuna ühe rea tähtede ülapikendid segunevad eelmise rea tähtede alapikenditega. Lihtsas HTML-is ei ole võimalik reavahet täielikult kontrollida. Trükis on üheks üldreegliks, et tekstiblokkide reavahe tuleb seada umbes 2 punkti suuremaks kui kiri ise. Näiteks, 12-punktise trükikirja korral peaks kasutama 14‑punktist reavahet. Et kompenseerida pikemaid ridu ja arvutiekraani madalamat eraldusvõimet, soovitame kasutada suurt reavahet, näiteks 12-punktine trükikiri tuleks seada 14- või 16-punktise reavahega.

Lõikude taandread

Lõikude tähistamises on kaks suurt koolkonda. Klassikaline meetod kasutab uue lõigu alguse märkimiseks taandrida. Samas paljud kasutavad lõikude eraldamiseks tühja rida. Taandreaga lõigud toimivad eriti hästi pikemates tekstiblokkides, kus taandrida näitab uue lõigu algust ja samas ei häiri oluliselt tekstivoolu. Tühi rida lõikude vahel seevastu muudab lehekülje ülevaatlikumaks ja pakub rohkem visuaalset vaheldust. Mõlemad lähenemised on lubatud, kui ühte stiili kasutatakse läbivalt tervel saidil. Soovitatav on kasutada siiski tühja rea meetodit.