# 97: Photoshopping Almanac - CSS-trikovi

Anonim

Almanah je pokrenut u v9 i nikad baš nije završen. Ipak se svakim danom sve više približava. Dakle, u v10 ćemo dizajnirati oko pretpostavke da je "gotovo".

Gledamo na postojeći v9 dizajn, koji je nekako u redu, ali ne služi sadržaju super dobro. Na brzinu vidimo kako prelasci pokazivača podebljanih slova lebde, što je obično ne-ne (često odgurne drugi tekst i izgleda čudno), ali to je nekako kul efekt na ova slova zaključana u položaju.

Već imamo prilagođenu grafiku zaglavlja, pa smo je stavili u Photoshop kako bismo se mogli poigrati s dizajnom u kontekstu. Dio onoga što mi se sviđa kod Giovannijeve ilustracije jest da me podsjeća na fizičku knjigu koja je bila uobičajena u mom odrastanju: Farmerov almanah. Odlučili smo uzeti metaforu fizičke knjige i unijeti je u ovaj dizajn. Ne skeuomorfno ili nešto slično, već samo nagovještaj dimenzionalnosti.

Izrađujemo ga na dvije stranice i koristimo gradijente kako bismo natuknuli sjenu i povez. Igramo se s nekim sjenama kako bismo produžili efekt.

Ponovno proširujući metaforu "knjiga", odabiremo font rukopisa kako bismo prikazali slova u knjizi, čineći je više dnevnikom ili dnevnikom nego knjigom s kojom sam u redu.

Ovo je područje podijeljeno na dva dijela (što lijepo funkcionira s izgledom od 2 stranice). Jedna strana je za CSS svojstva, a druga strana za CSS selektore. Kako bi se vizualno učinilo jasnijim (osim što samo naslovite dvije stranice), dvije strane imaju različitu osnovnu boju.

Malo razmišljamo o tipografiji i hrvamo se s nekim odlukama o tome gdje se možemo izvući s ovim fontom rukopisa, a gdje ne. Također se malo hrvamo s činjenicom da smo (ponovno) koristili cijelu stranicu za istraživanje sadržaja. Svakako dobra stvar, ali još smo jednom uklonili oglašavanje koje je prilično bitno za opstanak stranice.