"... simbolurile sunt date într-o formă statică, concretă. Orice variație în saturația fontului, lățimea literei, contrastul - indiferent de ce - necesită conectarea fișierelor individuale. În domeniul designului de documente tipărite reale, în cazul în care aspectul este complet static, acest concept nu poate fi atât de rău. Pe Internet, această limitare numesc tipografia adaptivă "podea de sticlă": variabilele de nivel înalt, cum ar fi indentarea între caractere, spațierea liniilor și dimensiunea fontului pot fi ajustate dinamic. Cu toate acestea, la cel mai mic nivel, unde variabilele sunt stabilite în interiorul fontului, nu există flexibilitate. Fiecare simbol este ca un cub de gheață care plutește într-o mare de design adaptabil. "
Comunitatea de proiectare este angajată în manipulări similare cu simbolurile: designerii aleg mai multe valori opuse de vârf, cum ar fi grosimea și finețea, un caracter îngust sau lat și umple valorile intermediare cu un algoritm inteligent. Acest proces este bine explicat în experimentul de interpolare SVG al lui Andrew Johnson.
După cum a spus Nick, din păcate, formatul obișnuit al fontului nu este potrivit pentru modificarea dinamică a valorilor de la normal la bold sau de la subțire la lat. Dar totuși nu este singurul designer care oferă îmbunătățiri în acest domeniu de web design. Andrew Johnson a făcut o declarație similară cu privire la formatul de font adaptiv:
Curs practic pe aterizare adaptivă de la zero!
Aflați de la zero pentru a adapta aterizările adaptive la HTML5 și CSS3 în următoarele 6 zile
Avem nevoie de astfel de caracteristici în fonturi? Cum vor rezolva fonturile adaptabile problemele de proiectare?
Avantajele formatului de schimbare a fontului
Acest format oferă cea mai bună ajustare a fontului. Mai ales este util atunci când un font subțire pare prea subțire și grăsime prea grasă. În schimb, puteți alege ceva în mijloc, și imediat afișează fontul care este necesar - cu alte cuvinte, proiectanții pot îmbunătăți în mod semnificativ lizibilitatea.
De asemenea, în final, putem crea un șablon, textul căruia va ocupa întregul spațiu al containerului, ca și în demo Font to Width:
Această metodă este similară cu metoda FitText și modul în care unitățile sunt utilizate pentru a configura textul adaptiv. Dar există o diferență clară, exprimată de Erik van Blokland:
"Lățimea textului se adaptează instantaneu dimensiunii țintă a dreptunghiului. Cuvintele ar trebui să poată reacționa la schimbarea geometriei paginii. "
Ie pentru o ajustare mai exactă a "geometriei paginii", trebuie să controlați complet fontul utilizat. În special, lățimea fiecărui personaj este la fel de importantă ca și capacitatea de a seta valori adaptive la proprietatea font-size.
Performanța este un alt motiv pentru care este mai bine să folosiți formatul unui font variabil. Cu acest format, avem nevoie doar de un singur fișier la un moment dat ca aceasta avem nevoie de o mulțime de soiuri de un singur font pentru a lucra cu sisteme care cer o întreagă familie de fonturi, inclusiv extra-subțire, normal, mediu de grăsime, bold, grăsime și variații Ultrabold.
„Eu cred că, în contextul situației actuale de pe internet, cel puțin una dintre dimensiunile fontului schimbare merită înviere - această abordare creează un potențial imens de compresie de fișiere, și se potrivește bine cu paradigma“. Adaptivă pe internet " Printre altele, această abordare oferă noi modalități de plasare a textului pe Internet și, în primul rând, abordarea însăși poate fi implementată mult mai ușor decât oricând în istoria computerelor desktop ".
Nick a continuat și a rezumat beneficiile:
„Pentru a schimba dimensiunea fontului va reduce încărcarea pe rețea, reducând numărul de cereri la server și înapoi din nou, paginile de încărcare mai repede, și mai presus de toate el este, de asemenea, flexibil. Este o victorie pe toate fronturile. (singura variabilă netestată este cât timp va dura calculele suplimentare). "
Curs practic pe aterizare adaptivă de la zero!
Aflați de la zero pentru a adapta aterizările adaptive la HTML5 și CSS3 în următoarele 6 zile
Există multe întrebări tehnice despre cum să introduceți în mod corect un nou format de font și cum să utilizați aceste noi proprietăți în design.
Cum ar trebui să funcționeze noul format în CSS
În discursul său, Nick a oferit un exemplu practic de cod CSS. Am scris ceva asemănător și am adăugat o lățime a fontului proprietății fictive. Această proprietate vă permite să specificați lățimea caracterelor în același mod ca și folosind greutatea fontului pentru text:
Puteți specifica încă un element cu greutatea font-ului: 601 sau 411 sau orice altă valoare care va fi necesară în proiectare. Acest element va răspunde la modificările aduse designului.
Acum, puteți lua în considerare în mod clar deficiențele din exemplul de mai sus. Cu toate acestea, cred că exemplul intră în centrul inimii problemei, site-urile vor fi ajustate la orice subtilități și nuanțe care anterior nu au putut. Mă pot gândi la mai multe exemple în care noul format va permite crearea de machete mult mai frumoase, ca să nu mai vorbim cât de util ar fi atunci când scalarea interfețelor.
Și ce despre WOFF?
În prezent există un alt format, câștigând popularitate, WOFF 2.0. În acest font, algoritmul de comprimare este semnificativ îmbunătățit în comparație cu predecesorul său. Compresia va fi extrem de utilă pentru limbile din regiunea Asia-Pacific și alte limbi cu un număr mare de caractere. Și totuși, în WOFF 2.0 nu există încă o astfel de caracteristică a formatelor de fonturi modificabile care vă permit să modificați dinamic textul. Trebuie să utilizați mai multe fișiere cu diferite lățimi de caractere și saturația lor.
Consider că formatul WOFF este un instrument bun pe termen scurt. Cu toate acestea, pe termen lung, acest format ne va ajuta pentru a face fontul este complet adaptiv.
Probleme potențiale
Pe lângă avantajele menționate mai sus, noul format are și dezavantaje în ceea ce privește proiectarea și dezvoltarea. Mai jos am compilat o listă cu posibilele probleme viitoare:
Dacă algoritmul este rulat pe partea clientului, atunci din motive de justiție trebuie menționat faptul că acest lucru poate avea un efect negativ asupra performanței.
Va fi necesară revizuirea sistemului de licențiere a fonturilor, deoarece utilizatorul nu mai trebuie să descarce mai multe fișiere cu valori de lățime și saturație diferite.
Și pe de altă parte: este într-adevăr necesar ca fontul de pe dispozitivul utilizatorului să fie dinamic?
Am vorbit cu acest subiect cu mai mulți designeri și au spus că este mai bine să ai un font non-dinamic decât jumătate din capacitățile de lucru.
Designerii de scrisori trebuie să înțeleagă cum să predea în mod corespunzător generația tânără și cum să le explice beneficiile noului sistem în ansamblu și cum ar trebui să-i ajute în munca lor. Recent, am vorbit cu un web designer, iar el mi-a spus cum el evită fontul OpenType de caractere individuale, cum ar fi capitalele și liguraty datorită faptului că mulți designeri nici măcar nu știu despre existența lor.
În mod similar, designerii de fonturi nu pot reface pur și simplu fontul cu adăugarea unor variabile noi. Ei trebuie să dezvolte fontul de la zero în primele etape ale proiectului, încorporând noi tehnologii.
Rezumă
Cred că noul format de fonturi modificabile are toate șansele de a ocupa un loc important în setul de instrumente al designerului. În plus, lizibilitatea textului pentru utilizatori va fi mult îmbunătățită. Dar acest lucru nu înseamnă că putem ignora multe probleme care împiedică crearea unei specificații de lucru.
Ediție: Comanda webformself.
Curs practic pe aterizare adaptivă de la zero!
Aflați de la zero pentru a adapta aterizările adaptive la HTML5 și CSS3 în următoarele 6 zile
Cele mai recente știri despre dezvoltarea IT și web pe canalul nostru de telegrame
