Come creare temi Web in Adobe Illustrator

October 29

Come creare temi Web in Adobe Illustrator


temi web, noto anche come modelli, consentono di creare un sito web con più pagine con uno sguardo costante e sentire in tutto il sito. Molti progettisti di creare i temi di fondo - la grafica e il layout di base - in un programma di grafica, come Adobe Illustrator. Anche se i browser Web non supportano direttamente il formato grafico Adobe Illustrator AI, è possibile utilizzare strumento sezione Illustrator per trasformare una tavola da disegno di Illustrator in una pagina Web, quindi utilizzare la pagina Web come un tema Web.

istruzione

1 Aprire Illustrator e avviare una nuova tavola da disegno: Fare clic sul menu "File", e scegliere "Nuovo" per aprire la finestra di dialogo Nuovo documento.

2 Fai clic sul menu a discesa "Nuovo profilo documento", e scegliere "Web". Le modifiche alla finestra di dialogo consentono di definire un nuovo documento misurata in pixel. Illustrator è dotato di tre dimensioni predefinite di pagina Web: 640 x 480, 800 x 600 e 1024 x 768. È possibile scegliere uno di questi o creare un formato personalizzato modificando i valori in campi Larghezza e Altezza.

3 Impostare le impostazioni delle dimensioni desiderate in "Nuovo documento," e fare clic su "OK".

4 Creare l'opera d'arte per il tema Web.

Un tipico design della pagina Web potrebbe essere costituito da una bandiera in alto, con menu che copre sia la parte superiore della pagina appena sotto il banner, oppure è possibile posizionare le voci di menu lungo il lato sinistro della pagina, in una barra laterale. È possibile progettare l'intera pagina in Illustrator, creando un'intestazione, un piè di pagina, una barra laterale e le voci di menu - tutto quello che vuoi.

5 Selezionare l'opzione "Strumento Slice" (l'icona coltello), nel pannello Strumenti.

6 Tenere premuto il pulsante del mouse e trascinare sulla sezione della pagina Web in cui si desidera creare una sezione. Ad esempio, è possibile rendere il banner tua prima fetta.

Ogni sezione si crea diventa una sezione separata della pagina. Illustrator crea una tabella HTML, e pone ogni fetta in una cella di una tabella. È possibile, ad esempio, creare una sezione per l'intestazione, la barra laterale e il piè di pagina. È inoltre possibile creare sezioni per ciascuna delle voci di menu. Quando si occulta la tavola da disegno di una pagina HTML, Illustrator vi permetterà di assegnare gli URL ai tuoi fette, trasformandoli in collegamenti attivi.

7 Tagliate la vostra tavola da disegno, se lo desideri.

8 Fare clic sul menu "File" e scegliere "Salva per Web e dispositivi." Questo apre la finestra di dialogo Salva per Web e dispositivi. Da qui è possibile apportare modifiche estese e rettifiche di layout, i colori degli oggetti tale cambiamento o definire il formato grafico per ogni oggetto a fette.

Per trasformare una fetta in un link, fare doppio clic su di esso. Verrà visualizzata la finestra di dialogo Opzioni sezione. Digitare il link nel campo URL.

9 Apportare le modifiche desiderate alle vostre fette, quindi fare clic su "Salva". Questo apre Salva ottimizzato come finestra di dialogo.

10 Fai clic sul menu a discesa "Formato", e scegliere "HTML e immagini", quindi fai clic su "Salva".

11 Nome e salvare il file. È ora possibile aprire il codice HTML in un editor HTML, e usarlo come un tema per le pagine Web.

Consigli e avvertenze

  • Illustrator crea grafica da ciascuna delle vostre fette, e li salva in una cartella denominata "immagini". Quando caricare le pagine HTML a un server Web, assicurarsi che anche caricare questa cartella. In caso contrario, la pagina non viene visualizzata correttamente.