Layout per la stampa e per il web

20, Nov, 2019 | Web Agency Blog

layout-per-la-stampa-e-per-il-web-lv-design-web-agency-e-grafica-realizzazione-siti-web-bologna

Layout per la stampa e per il web

Cosa hanno in comune il lavoro del copywriter, del web designer e graphic designer?

Tante cose accomunano le professioni della nostra agenzia e purtroppo anche una crisi a volte può colpire ognuno di noi: la crisi da foglio bianco.

In L+V Design per superarla usiamo la progettazione.

La progettazione spesso si traduce in griglia (grafica, di testo o web).

Cos’è una griglia?

Una suddivisione dello spazio di lavoro attraverso linee orizzontali e verticali.

A cosa serve?

Distinguere diversi tipi di informazione così da rendere più semplice la loro fruizione.

Partiamo dall’analizzare come è fatta una pagina e una pagina web.

Layout per la stampa e per il web griglia 1

Layout per la stampa e per il web griglia 2

La struttura della griglia:

Le colonne: sono gli allineamenti verticali. Possono essere tutti della stessa dimensione o no, ogni colonna è separata da uno spazio chiamato intercolonna.

Le righe: sono il risultato della suddivisone dello spazio tra margine superiore e inferiore, tra loro si interpone sempre un ulteriore spazio detto interlinea.

Le linee guida: suddividono lo spazio e possono essere usate per agganciare la fine o l’inizio dei testi e delle immagini.

Moduli: le unità create dall’intersezione tra righe e colonne.

Sezioni: sono l’insieme di più moduli, righe o parti di colonne che compongono un’area specifica a contenere una data informazione.

Marcatori: linee per le sezioni di testo subordinate, numero di pagina e titolo autore della pubblicazione.

Ma come si costruisce una griglia?

Ti propongo cinque step per costruire una griglia, ma la cosa fondamentale è che ci sia una logica compositiva e che si definiscano proporzioni spaziali matematiche.

Layout per la stampa e per il web griglia 3

Costruire una griglia in 5 step:

1 – Conosci il contenuto e il formato

Questo ti permetterà di anticipare problemi che si verificheranno quando metterai il contenuto nella griglia, titoli lunghi, immagini che non si possono tagliare, punti morti senza testo, superamento del numero di pagine a disposizione.

Puoi creare una tabella o una lista prefigurandoti le ipotesi con maggiore contenuto e le ipotesi con minore contenuto.

Ad esempio 1 pagina oppure 15/30 pagine, un’immagine piccola o 10 immagini, o addirittura una galleria.

2 – Fai uno schizzo

Ti consiglio di fare un veloce schizzo a mano con pochi elementi chiave importanti.

Lo schizzo a mano è sempre una prerogativa importante quando si progetta, perché non ci si perde in dettagli inutili, lo schizzo deve essere sommario e di sintesi per avere semplicemente una visione d’insieme.

3 – Scegli una regola matematica per fare la tua griglia

 

Puoi partire dalla dimensione del foglio e suddividere proporzionalmente.

Layout per la stampa e per il web griglia 6

Oppure puoi usare la sezione aurea.

Layout per la stampa e per il web griglia 6

4 – Sii creativo

La griglia non deve essere un limite alla creatività.

Una griglia va seguita senza rigidità, ci si può allontanare quando ci sono buoni motivi per farlo.

Infatti, si può progettare anche senza griglia, seguendo altre valide logiche compositive, ma le affronteremo in un prossimo articolo.

5 – Gioca a tetris con gli elementi

Ci sono tanti trucchi per rendere meno noiosa una griglia e dare rimbalzo.

Puoi mettere nella doppia pagina, in quella di sinistra le immagini in alto e, in quella di destra le immagini in basso, puoi alternare immagini piccole, medie e grandi. Puoi uscire dai margini per alcune immagini o disporre il testo diversamente.

Layout per la stampa e per il web griglia 4

Infine per quanto riguarda il layout responsive nel web valgono gli stessi step precedenti. Una cosa è però fondamentale: progettare il look partendo dal piccolo, quindi dallo smartphone, per poi passare al desktop.

Layout per la stampa e per il web griglia 5

Lo smartphone sarà una sezione o un modulo da ripetere all’interno della griglia per il browser desktop.

Libri che dovete assolutamente acquistare e leggere se vi interessa l’argomento “Layout per la stampa e per il web”:

Siti di risorse utili:

Per carta

http://gridulator.com/

Per web

http://grid.mindplay.dk

https://markboulton.co.uk/journal/five-simple-steps-to-designing-grid-systems-part-4/

 

Autore

Ilaria Balestra - Designer industriale e Grafico si occupa di progettazione visual a tutto tondo. Laureata in design del prodotto dopo aver progettato stampanti 3D attualmente tiene corsi di fabbricazione digitale e progettazione per enti di formazione del territorio. Esperta di design della comunicazione, sua specializzazione universitaria, si dedica da diversi anni alla progettazione di immagine coordinate, loghi, brand identity e visual per piccole realtà imprenditoriali e privati alla ricerca del proprio perché e della propria nicchia di mercato.

Cerca

Articoli recenti

Quanto costa un sito web nel 2024?
Quanto costa un sito web nel 2024?

Quanto costa un sito web nel 2024?La risposta a questa domanda non è mai semplice, come Web Agency specializzata nella creazione di siti web, ci teniamo a fare chiarezza su quello che è il panorama attuale delle possibilità che si possono scegliere. Attualmente creare...

Cosa vuol dire Web Agency?
Cosa vuol dire Web Agency?

Cosa vuol dire Web Agency?Al giorno d’oggi siamo abituati a riempirci la bocca con termini inglesi a tema informatico o economico che lasciano passare poco il messaggio della loro vera funzione. Termini come SEO (Search Engine Optimization), Social Media Marketing,...

Web Agency al servizio delle imprese
Web Agency al servizio delle imprese

Web Agency al servizio delle impreseProntopro, player internazionale, capace di collegare migliaia di professionisti alla ricerca di una data professionalità, negli ultimi mesi si sta interrogando sulla realtà Web delle agenzie ed è con questo scopo che è entrata in...

Il Black Friday 2019 di L+V Design
Il Black Friday 2019 di L+V Design

Il Black Friday 2019 di L+V DesignIl Black Friday 2019 è alle porte: numerosi sconti costellano il web in quella che ormai è diventata la settimana che dà il via agli acquisti natalizi. Il Black Friday, letteralmente venerdì nero, si pensa abbia origine intorno agli...

Seguici