responsive
Sep 03, 2014
Responsive web design... ma non dimentichiamoci del logo!
Sfruttiamo davvero tutto il potenziale del responsive web design per i loghi? Come risulterebbero quelli dei brand più famosi, se fossero responsive?
Nei siti web responsive l’aspetto dell’header, del menu di navigazione o dei contenuti cambia in base alle dimensioni dello schermo. Tuttavia, si tende a non modificare i loghi: semplicemente si riducono o si espandono per adattarsi allo schermo.
A volte manca uno studio vero e proprio sull’aspetto responsive del logo, che definisca come debba essere il logo in base alle diverse dimensioni del dispositivo. Eppure il logo è il simbolo più potente del marchio di un brand.
Come dicevo, semplicemente ridurre o ampliare un logo secondo il suo contesto non è sempre la soluzione migliore.
Potrebbe essere necessario aggiungere dettagli nel logo man mano che la capacità del dispositivo aumenta o, al contrario, rendere minimale il suo aspetto se le dimensioni della finestra diminuiscono.
Un ottimo esempio ci viene fornito da un progetto di studio di Joe Harrison sulla creazione di loghi responsive per i grandi marchi.
Questo progetto mostra come loghi delle marche più popolari possono essere efficacemente riprodotti in maniera responsive. Se aprite la pagina e ridimensionate il browser vedrete i loghi che si aggiornano dinamicamente in base alle dimensioni dello schermo. Via via che le dimensioni del browser si riducono, ognuno di questi loghi passa attraverso una sequenza di breakpoint e, ad ogni breakpoint, il logo viene modificato, rimanendo però fedele al marchio originario.
Document Actions
Feb 27, 2014
Plone 5: The Stroopwafel sprint and the Cathedral Sprint
A travel from Amsterdam to Cologne: here's my report of 10 days sprinting with the Plone community. An amazing experience of work and life. The goal? Plone 5
read moreDocument Actions
Sep 24, 2013
Responsive design... molto più facile con le unità vw e vh di CSS3!
Come e per cosa usare le unità vw e vh di CSS3, una risorsa preziosa per il responsive perché forniscono un rapporto diretto con le dimensioni della viewport
I layout diventano sempre più complessi e il responsive web design assume sempre più importanza, perciò noi sviluppatori abbiamo bisogno di una più ampia gamma di unità di misura che ci aiuti a creare design flessibili.
Diventa quindi utile approfondire le unità di misura vw e vh legate alla viewport, introdotte da CSS3.
Queste unità sono uno strumento molto potente per il responsive design e ci consentono di risparmiare pagine e pagine di media queries.
Prima di parlare delle novità facciamo un breve riepilogo sulle unità CSS disponibili e le loro principali caratteristiche.