Il principio di "essere accolti dai vestiti" è vero non solo per le persone, ma anche per i siti. L'abito del sito è il suo design. Ed è il design che determina l'impressione che il visitatore ha nei primi secondi di visualizzazione della risorsa. Questa impressione è particolarmente importante perché determina il suo comportamento futuro. Il primo elemento di design che ogni utente che visita il sito vede è la sua "intestazione". Il cappuccio è il volto della risorsa web. Pertanto, ogni web designer alle prime armi vuole prima di tutto imparare come creare intestazioni per i siti.
Necessario
- - accesso a Internet;
- - browser moderno;
- - editor di grafica raster (GIMP, Photoshop);
- - opzionale: editor di grafica vettoriale (CorelDraw);
- - opzionale: ambiente di modellazione 3D (Blender, 3DStudio);
- - opzionale: foglio di carta, matita o penna.
Istruzioni
Passo 1
Sviluppa un concetto per la futura intestazione del sito. Idealmente, il concetto dovrebbe essere basato sull'idea originale. Quando mancano le idee, si può trarre ispirazione analizzando le buone soluzioni esistenti. Rifletti il risultato della ricerca creativa sotto forma di uno schizzo su un pezzo di carta. Lo schizzo dovrebbe riflettere la struttura della futura intestazione del sito con l'indicazione di luoghi e aree "gommati" pieni di immagini. In questa fase, è una buona idea pensare a uno schema di colori approssimativo per il design dell'intestazione.
Passo 2
Seleziona la dimensione dell'intestazione. In realtà, vale la pena definire chiaramente solo uno dei suoi parametri: l'altezza. Di norma, l'altezza delle intestazioni del sito è fissa e non dipende dalla risoluzione logica che influisce sui parametri di visualizzazione dei caratteri. In altre parole, dovresti scegliere un valore per l'altezza dell'intestazione in pixel. In questo caso ha senso prendere in considerazione la possibilità di inserire banner o blocchi di pubblicità contestuale nell'intestazione. Per quanto riguarda la larghezza, dovresti determinare il valore minimo, evidenziando almeno un'area "gommata" che consenta all'intestazione di adattarsi alle diverse dimensioni della pagina web.
Passaggio 3
Crea un modello di intestazione in un editor di grafica. In un nuovo documento, aggiungi un livello trasparente su cui trascinerai lo schizzo in base ai parametri geometrici selezionati. L'altezza del livello deve corrispondere all'altezza dell'intestazione. La larghezza può essere considerata arbitraria, ma maggiore della dimensione minima, lasciando spazio alle aree orizzontali "di gomma".”Nel modello, designare zone di dimensioni fisse e variabili, zone destinate a essere riempite con immagini statiche, immagini di sfondo.
Passaggio 4
Cerca o crea immagini statiche da inserire nel modello di intestazione. Il logo e alcuni elementi unici possono essere creati in un editor vettoriale o in un ambiente di modellazione 3D. È abbastanza facile trovare immagini tematiche su photobank gratuite su Internet.
Passaggio 5
Inserisci lo sfondo, il logo e le immagini statiche nel modello di intestazione del sito in un editor di grafica. Aggiungi lo sfondo e ogni immagine a un livello trasparente separato. Disporre gli strati nel migliore dei modi. Spostando le immagini in livelli, ottieni il loro layout perfetto, corrispondente al modello creato in precedenza.
Passaggio 6
Salva l'immagine dell'intestazione risultante. Salva il progetto di lavoro nel formato nativo dell'editor grafico. Quindi salva l'immagine dell'intestazione appiattita in un formato senza perdita di dati (ad esempio, PNG).
Passaggio 7
Se necessario, crea un modello di intestazione HTML. Apri l'immagine appiattita nell'editor. Ritaglia le immagini che corrispondono ad aree di dimensioni fisse. Dai punti corrispondenti alle aree "gomma", ritaglia le immagini larghe 1 pixel. Salva tutte le immagini su disco. Disponi l'intestazione HTML utilizzando le immagini salvate.
