Come Realizzare Griglie Modulari

Sommario:

Come Realizzare Griglie Modulari
Come Realizzare Griglie Modulari

Video: Come Realizzare Griglie Modulari

Video: Come Realizzare Griglie Modulari
Video: 3 modi per creare griglie grafiche in Adobe Illustrator 2024, Maggio
Anonim

È conveniente utilizzare griglie modulari durante lo sviluppo di un progetto o la creazione di un'immagine complessa. Servono come base della composizione, dividendo il foglio in un numero specificato di passaggi verticali e orizzontali con distanze uguali o diverse.

Come realizzare griglie modulari
Come realizzare griglie modulari

Necessario

Programma Photoshop dimora

Istruzioni

Passo 1

Tutti i moderni editor grafici e programmi di web design hanno griglie modulari integrate. Se stai lavorando in Adobe Photoshop, attiva la visualizzazione della griglia per disporre facilmente gli oggetti immagine e il loro esatto posizionamento sul foglio. Per fare ciò, vai alla voce di menu Modifica e sposta il mouse sulla didascalia Preferenze. Nel menu che compare, seleziona la voce Guide, Grid & Slices (a seconda della versione del programma questa voce può avere nomi diversi, scegli la parola Grid).

Passo 2

Nella finestra delle impostazioni che si apre, imposta i parametri della griglia modulare. Nell'area Griglia, seleziona il colore delle linee che formano gli elementi della griglia e l'interlinea. Fare clic su "OK" e verificare come le modifiche apportate influenzeranno l'aspetto dell'immagine. Nell'ambiente di sviluppo Web di Adobe DreamWeaver, la griglia è inclusa per impostazione predefinita nel layout della pagina che si sta sviluppando.

Passaggio 3

Puoi aggiungere varie tabelle (elementi griglia) con qualsiasi set di righe e colonne utilizzando l'elemento Inserisci tabella, nonché inserire nuove tabelle nelle celle, creando così una rete complessa per la creazione di elementi di pagina.

Passaggio 4

Puoi creare manualmente una griglia modulare utilizzando gli stili CSS. Per fare ciò, usa gli strumenti #grid, Gridmaker, CSS Grid Builder, 1 KB CSS Grid, Gridr Buildrrr e altri moduli. Ad esempio, il seguente frammento di codice crea una griglia di quattro moduli di una data larghezza:.page-layout {margin-right: -5px; }.layout-box {float: sinistra; margine: 0 5px 5px 0; }.lb-1 {larghezza: 779 px; } / * 100% * /. Lb-2 {larghezza: 583px; } / * 75% * /. Lb-3 {larghezza: 387px; } / * 50% * /. Lb-4 {larghezza: 191px; } / * 25% * /

Passaggio 5

La presenza di una griglia modulare semplifica sia i designer alle prime armi che gli sviluppatori web, sia i maestri esperti in questo campo. I progetti creati sulla base di una griglia modulare sono facili da modificare e trasferire, il che è molto conveniente per grandi volumi di lavoro. Puoi anche interrompere il lavoro in qualsiasi momento e continuare a utilizzare il file salvato.

Consigliato: