Dimensiunea contează cum ar trebui să fie textul pe site-uri cu aspect adaptabil

Cum citesc oamenii

Combinația de zone de roșu și galben generează adesea simbol variații F - acest lucru confirmă faptul că utilizatorii citesc textul de pe rețea, scanarea în mod selectiv a paginii pentru înțelegerea conținutului său, dar nu mai mult.

În plus, vizitatorii studiază pagina pentru a-și rezolva sarcina - ei "sărind" privirea de la element la element, încercând să găsească informațiile necesare. Adesea ei citesc doar un singur cuvânt sau chiar câteva caractere pe linie. Pe harta de căldură de mai jos arată mișcarea ochilor utilizatorului, studiind problema de căutare Google - rezultatul primelor două persoane citește mai lent, iar apoi a început să scanați o pagină, fără să se oprească pentru o lungă perioadă de timp nu pe aceeași linie. Prin urmare, în partea stângă a imaginii nu există nici o linie verticală clară a vederii:

Citirea este un proces complex

Există trei scenarii principale pentru citirea textului pe Internet, dar aceste caracteristici ale citirii în rețea nu sunt limitate. Cercetătorii au descoperit că utilizatorii nu citesc toate cuvintele de pe pagină, ci folosesc viziunea lor centrală pentru a se concentra asupra unui anumit cuvânt și pentru a percepe viziunea periferică cu informațiile care însoțesc:

Utilizatorii nu citesc toate cuvintele de pe pagină

Citirea folosește viziunea periferică

În plus, se știe că vizitatorii nu fixează vederea unui singur cuvânt, ci examinează mai multe simultan (ochii descriu cercuri mici numite "saccade"). Cel mai adesea, acesta este modul în care utilizatorii care vizualizează pagina în căutarea informațiilor necesare sau o vizualizează pentru a înțelege dacă conținutul este interesant.

Cititorii acordă atenție doar câtorva cuvinte

În plus, atunci când citiți o singură linie de text, utilizatorii acoperă de obicei vizualizarea și linia următoare. Prin urmare, vederea nu se mișcă doar pe orizontală, ci și ușor "îndoiește" pe verticală. Din cauza acestei lupte de mișcare verticală și orizontală, pe hărțile de căldură apar figuri în formă de F.

Lungimea liniei și citirea

Tipografii discută relația dintre mișcările verticale și orizontale ale ochiului timp de aproape un secol. În 1928, Jan Tschichold (Jan Tschichold) a declarat despre dezavantajele textului aliniat în centru și a recomandat alinierea spre stânga. El a crezut că va ajuta vizitatorii în percepția informației - apariția unei linii verticale clare pe partea stângă a paginii, pe care oamenii pot folosi după citirea linia orizontală pentru a sări la următorul.

Numerele perfecte: între 45 și 75 de caractere

Există multe "reguli" despre ceea ce ar trebui să fie o linie orizontală de text. Laura Franz citează pe James Craig, care în 1971 a scris în cartea sa Proiectarea cu tip:

Citirea unei linii lungi provoacă oboseală: cititorul este forțat să-și întoarcă capul spre sfârșitul liniei și apoi să caute începutul următorului. Liniile prea scurte ajută la descompunerea cuvintelor sau a expresiilor care sunt de obicei percepute ca o unitate de text comună.

Adesea, pe măsură ce lungimea ideală a liniei este numită numărul de 65 de caractere. Se crede că textele funcționează bine pe Internet, liniile în care sunt de la 45 la 75 de caractere. Laura Franz, însă, spune că, în funcție de experiența ei, bara superioară poate fi extinsă la 85 de caractere pe linie (inclusiv spații și semne de punctuație).

Dimensiunea fontului și citirea textului

Pentru o bună citire a textului, este important nu numai lungimea liniilor, dar și dimensiunea fontului în sine. Acesta este un lucru bine-cunoscut, însă, atunci când se utilizează un design adaptiv, atunci când o pagină cu același conținut poate fi prezentată în diferite versiuni, fontul este adesea obținut fie prea mare, fie prea mic.

Pagini web statice și dimensiune font

Principalul plus al designului adaptiv, legat de citirea textului, este că utilizatorii de dispozitive mobile nu trebuie să utilizeze zoom-ul și să deplaseze zona vizibilă a ecranului pentru citire.

În cazul în care paginile sunt structuri statice (de exemplu, două coloane de text, cum ar fi imaginea de mai jos), apoi cu lungimea recomandată a unei linii, textul poate fi obținut prea mic - pe dispozitive cu ecrane mici pentru a citi va fi posibilă numai cu „zoom“.

Stânga: Coloana principală a textului are lungimea recomandată, dar fără structura adaptivă, este prea mică pentru dispozitivele cu ecrane mici. Dreapta: dimensiunea fontului (Verdana 13 pixeli pentru coloana din stânga, Georgia 18 pixeli pentru introducere și 16 pixeli Georgia pentru conținutul principal) este foarte potrivit pentru citirea pe laptop.

Dispozitive mici și mărimea fontului

Pe dispozitivele cu ecrane mici, fontul pare inițial mai mic decât cel afișat pe computer. Franz spune că acest lucru este normal, deoarece utilizatorii aflați în procesul de citire aduc dispozitivele mobile mai aproape de ochi. În prezent, abordarea este larg răspândită, în care aspectul adaptiv utilizează fonturi de dimensiuni mai mici, dar suficient pentru a păstra "lizibilitatea". În același timp, păstrând lungimea ideală a unui șir de caractere nu este neapărat - ideal în ceea ce privește mărimea, dar textul prea mic face un site adaptiv inutil, deoarece utilizatorii și pentru a defila, provocată pagina de „zoom“.

Stânga: pentru a salva lungimea liniei, dimensiunea fontului este redusă la 12 pixeli Verdana și 14 pixeli Georgia, ceea ce complică citirea. Dreapta: 13 pixeli Verdana și Georgia 17 pixeli permit îmbunătățirea "lizibilității", deși lungimea liniei nu este acum ideală.

Dispozitivele mari și dimensiunea fontului

Atunci când dezvoltați site-uri adaptive, rețineți că dimensiunea fontului și lungimea liniei de text sunt importante nu numai pentru dispozitivele mobile. Majoritatea utilizatorilor încă deschid site-uri de la laptopuri și desktop-uri. Adesea, aspectul adaptiv presupune existența unei coloane care se extinde cu ecranul dispozitivului.

Această soluție poate fi elegantă și eficientă, dar poate provoca și o problemă cu fonturile - la un moment dat personajele pot deveni prea mari. Pentru a percepe informațiile prezentate în acest fel, nu este foarte confortabil - corp de literă mare ocupă mai mult spațiu pe orizontală, ceea ce face dificil de citit modelul obișnuit, în care utilizatorii percep o parte din text în viziunea ta periferică.

Prea mari utilizatorii forțelor de text pentru a încetini lectură și să facă un efort mai mare pentru a asimila informații - citire orizontală devine incomod, care provoacă o persoană pentru a se asigura că începe rasfoiesc pagina, uita-te aderând la marginea ei din stânga.

Laura Franz a spus că creatorii de site-uri nu ar trebui să depună eforturi pentru lungimea ideală a unei linii de text pe pagina - economisind valorile ideale va provoca o creștere de fonturi ecrane mai mari, și se poate face conținutul imposibil de citit.

Spațierea și citirea liniei

Modul în care oamenii citesc textul este afectat nu numai de relația dintre dimensiunea fontului și lungimea liniei din structurile adaptive ale site-urilor, ci și de distanța dintre texte.

Spațierea liniei afectează mișcarea orizontală a ochilor

Deoarece utilizatorii scanează conținutul pe orizontală și pe verticală, liniile ar trebui să fie percepute de ochi ca o singură linie, mai degrabă decât să provoace o senzație de "val". Textul "prea strâns" poate complica mișcarea orizontală și poate forța cititorul să traducă vizualizarea mai jos în partea stângă a paginii. În plus, acest lucru complică înțelegerea informațiilor și poate determina utilizatorul să o recitească.

Pe de altă parte, atunci când citiți un text localizat slab cu o distanță mare de linii, poate apărea impresia de "linii în mișcare". Liniile în acest caz nu sunt percepute ca un singur element, ceea ce complică scanarea verticală a conținutului. Franz afirmă că nu există standarde general acceptate pentru un spațiu liniar ideal, dar recomandă setarea acestuia la o rată egală cu aproximativ 150% din dimensiunea fontului.

Linia și dimensiunea fontului

Regulile pot fi încălcate

Atunci când dezvoltăm o versiune adaptivă a site-ului, testarea numai pe dimensiuni mari ale ecranului nu determină cu exactitate modul în care textul va arăta pe dispozitivele mici. Pentru a detecta erorile în proiectare, Franz recomandă utilizarea lungimii liniei și a proporțiilor sale ideale, dar solicită să nu uităm că regulile sunt create pentru a le încălca.

Articole similare

Pagina anterioară

Pagina următoare