Come Creare Un'intestazione Di Gomma Per Un Sito Web

Sommario:

Come Creare Un'intestazione Di Gomma Per Un Sito Web
Come Creare Un'intestazione Di Gomma Per Un Sito Web

Video: Come Creare Un'intestazione Di Gomma Per Un Sito Web

Video: Come Creare Un'intestazione Di Gomma Per Un Sito Web
Video: Come Creare un Sito Web Professionale in 20 Minuti 2024, Novembre
Anonim

Quando si crea un sito Web su Internet, uno dei punti più importanti che uno sviluppatore deve tenere in considerazione è la sua funzionalità, versatilità e prestazioni. Affinché il sito venga visualizzato completamente e correttamente in qualsiasi browser su computer con un'ampia varietà di risoluzioni dello schermo, è possibile creare una comoda intestazione "gomma", composta da diversi elementi grafici.

Come creare un'intestazione di gomma per un sito Web
Come creare un'intestazione di gomma per un sito Web

Istruzioni

Passo 1

Nel primo passaggio della creazione di tale intestazione per un sito Web, apri in Photoshop l'immagine che hai già preparato per la pubblicazione sul Web, quindi tagliala a pezzi utilizzando lo strumento Slice nella barra degli strumenti. Taglia l'intestazione in modo che la parte centrale sia vuota, in modo da ottenere tre elementi grafici. Ciò consentirà all'intestazione di allungarsi per qualsiasi risoluzione dello schermo.

Passo 2

Dopo aver tagliato l'intestazione, salvala ottimizzando i file durante il salvataggio per il formato web (Salva per web). Imposta il formato file desiderato per il salvataggio, ad esempio gif, jpeg o png. Per modificare ogni frammento dell'immagine, fare clic sull'opzione Strumento di selezione sezione nel menu e ridimensionare le immagini in modo che la loro dimensione sia la più piccola possibile con la minima perdita di qualità della visualizzazione dell'immagine sullo schermo. Salva le tue immagini modificate come html e immagini.

Passaggio 3

Dopo che le immagini sono state salvate, modifica il codice HTML aprendo il documento html salvato con Blocco note. Nel blocco note, cancella tutte le righe di codice non necessarie. Lascia solo le righe necessarie: i dati sulla tabella in cui sono incorporate le tue immagini:

Passaggio 4

In queste righe, invece di yourimage.gif, dovrebbe essere specificato il percorso delle tue immagini con la larghezza e l'altezza appropriate.

Passaggio 5

Affinché la parte centrale dell'immagine si allunghi, allargando le immagini estreme ai lati, scrivi gli attributi di codice corrispondenti nelle righe. Specifica i tuoi parametri di larghezza e altezza nel codice.

Passaggio 6

Carica le immagini di intestazione generate nella directory principale del tuo sito, quindi modifica il codice HTML con nuovi percorsi per le immagini di intestazione sul server. Incolla il codice dell'intestazione tra i tag.

Consigliato: