ThinkRoot

bine ați navigat pe insula mea de pe internet

Am schimbat cum arată jurnalul și mi-a plăcut procesul

De ceva vreme mă tot gândeam că thinkroot.xyz arată prea auster. Nu era nimic greșit în mod particular, dar ori de câte ori îl deschideam îmi dădea senzaia unui document tehnic mai degrabă decât a unui loc în care scriu cu plăcere despre lucruri care mă interesează. Fundalul era alb-gri, textul era negru, linkurile erau albastre - clasicul web din anii 2000 fără nicio personalitate.

Așa că m-am apucat să schimb câte ceva.

Primul lucru care s-a schimbat a fost fontul

Juralul folosea JetBrains Mono pentru absolut tot - și titluri, și navigație, și textul articolelor. JetBrains Mono e un font excelent pentru cod, dar pentru paragrafe lungi pe care le citești de plăcere nu e tocmai ideal. Literele au toate aceeași lățime, ceea ce face textul mai greu de parcurs când ai de citit mai mult de câteva rânduri.

Am trecut textul articolelor pe Figtree, un font proporțional, rotunjit, cu un caracter mai prietenos. JetBrains Mono a rămas pentru titluri, navigație, cod și toate elementele de interfață - acolo chiar se potrivește. Combinația dintre cele două mi se pare că funcționează bine, există un contrast clar între structura paginii și conținutul propriu-zis.

Apoi au venit culorile

Paleta veche era negru, gri și albastru. Funcțională, dar rece. Am înlocuit-o cu ceva mai cald - fundal crem, text maro-închis, accente portocaliu-terracotta. Genul de culori care îți dau senzația că citești ceva pe hârtie, nu pe un ecran de birou.

Fundalul nu e o culoare plată, ci un gradient subtil care trece prin câteva nuanțe de crem și bej. Nu e ceva care să sară în ochi, dar face pagina să pară mai puțin rigidă decât un fundal uniform.

Dark mode-ul a primit același tratament - tonuri de espresso și maro închis în loc de negrul standard, cu accente portocalii care se potrivesc cu paleta din light mode.

Câteva efecte care fac navigarea mai plăcută

Pe lângă culori și fonturi, am adăugat și câteva lucruri mici care nu sunt vizibile imediat dar se simt când folosești jurnalul. Titlul din header are un gradient care trece din maro în portocaliu. Linkurile din articole au un underline animat care apare de la stânga la dreapta când treci cu mouse-ul. Articolele de pe pagina principală se evidențiază ușor la hover pe desktop și la tap pe telefon. Bara de progres din partea de sus a paginii îți arată cât ai citit dintr-un articol.

Nimic spectaculos, dar împreună dau senzația că jurnalul e viu, nu static.

N-a mers totul din prima

Cel mai mare necaz a fost cu Safari. La un moment dat textul devenea aproape invizibil pentru că fontul nu se încărca și culorile nu se aplicau corect. Am rezolvat problema treptat, testând pe mai multe navigatoare și ajustând CSS-ul până când a arătat bine peste tot.

Brave pe iOS a dat și el bătăi de cap, dar s-a dovedit că era vorba de setările navigatorului, nu de codul meu - Shields-ul lui Brave bloca fonturile de la Google.

La final

Nu am făcut o schimbare dramatică - structura și logica jurnalului sunt exact la fel ca înainte. Dar acum când îl deschid îmi dă o senzație mai bună, ceea ce cred că e suficient ca să merite efortul. Un jurnal pe care îl deschizi cu plăcere e unul la care îți vine și să scrii mai des.

⬅ The one before
Apreciez munca, dar nu și temele

Up next ➡
Cum schimbi directorul de salvare pentru screenshot-uri în Linux Mint