Le sezioni

Le pagine Web possono contenere diversi elementi, quali testo HTML, immagini bitmap e grafica vettoriale. In Illustrator, potete usare le sezioni per definire i bordi dei diversi elementi Web di un disegno. Ad esempio, se il disegno contiene un’immagine bitmap che deve essere ottimizzata nel formato JPEG, mentre il resto dell’immagine può essere ottimizzata meglio come file GIF, potete isolare l’immagine bitmap con una sezione. Quando salvate il disegno come pagina Web tramite il comando Salva per Web e dispositivi, potete scegliere di salvare ogni sezione come file indipendente e con formato, impostazioni e tavola di colori propri.

Le sezioni in un documento di Illustrator corrispondono alle celle di tabella nella pagina Web risultante. Per default, l’area della sezione viene esportata come file di immagine racchiuso in una cella di tabella. Se desiderate che la cella di tabella contenga testo HTML e un colore di sfondo invece di un file di immagine, potete impostare il tipo di sezione su Nessuna immagine. Se desiderate convertire il testo di Illustrator in testo HTML, potete impostare il tipo di sezione su Testo HTML.

Disegno diviso usando diversi tipi di sezioni
Disegno diviso usando diversi tipi di sezioni

A. Sezione Nessuna immagine B. Sezione immagine C. Sezione Testo HTML 

Potete visualizzare le sezioni sulla tavola da disegno nella finestra di dialogo Salva per Web e dispositivi. Le sezioni sono numerate da sinistra a destra e dall’alto in basso, a partire dall’angolo superiore sinistro del disegno. Se modificate l’ordine o il numero totale delle sezioni, i numeri delle sezioni vengono aggiornati di conseguenza.

Quando create una sezione, Illustrator suddivide il resto del disegno in sezioni automatiche per mantenere la disposizione del disegno tramite una tabella per Web. Ci sono due tipi di sezioni automatiche: sezioni automatiche e sottosezioni. Le sezioni automatiche si applicano alle aree del disegno che non avete definito come sezioni. Illustrator genera nuovamente le sezioni automatiche ogni volta che aggiungete o modificate delle sezioni. Le sottosezioni indicano come verranno divise le sezioni definite dall’utente che si sovrappongono. Anche se le sottosezioni sono numerate e denotate da un simbolo di sezione, non potete selezionarle o modificarle separatamente dalla sezione sottostante. Illustrator rigenera sottosezioni e sezioni automatiche secondo necessità mentre lavorate.

Creare le sezioni

  1. Effettuate una delle seguenti operazioni:
    • Selezionate uno o più oggetti sulla tavola da disegno e scegliete Oggetto > Sezione > Crea.

    • Selezionate lo strumento sezione  e trascinate sull’area in cui volete creare una sezione. Mentre trascinate, premete Maiusc per vincolare la sezione a un quadrato. Tenete premuto Alt (Windows) o Opzione (Mac OS) mentre trascinate per disegnare a partire dal centro.

    • Selezionate uno o più oggetti sulla tavola da disegno e scegliete Oggetto > Sezione > Crea da selezione.

    • Inserite delle guide dove volete creare una sezione nel disegno e scegliete Oggetto > Sezione > Crea da guide.

    • Selezionate una sezione esistente e scegliete Oggetto > Sezione > Duplica sezione.

      Suggerimento: usate il comando Oggetto > Sezione > Crea se volete che le dimensioni della sezione corrispondano ai bordi di un elemento nel disegno. Se spostate o modificate l’elemento, l’area della sezione si adatta automaticamente fino a comprendere il nuovo disegno. Inoltre, usate questo comando per creare una sezione che catturi testo e formattazione di base da un oggetto di testo.

      Suggerimento: usate lo strumento sezione, il comando Crea da selezione o il comando Crea da guide se volete che le dimensioni della sezione siano indipendenti dal disegno sottostante. Le sezioni così create appaiono come elementi nel pannello Livelli e le potete spostare, ridimensionare ed eliminare come qualsiasi altro oggetto vettoriale.

Selezionare le sezioni

Con lo strumento seleziona sezione  selezionate una sezione nella finestra del disegno o nella finestra di dialogo Salva per Web e dispositivi.

  • Per selezionare una sezione, fate clic su di essa.
  • Per selezionare più sezioni, premete il tasto Maiusc e fate clic. Nella finestra di dialogo Salva per Web e dispositivi, potete anche tenere premuto Maiusc e trascinare.
  • Per selezionare una sezione sottostante quando lavorate con sezioni sovrapposte, fate clic su una sua parte visibile.

    Potete inoltre selezionare le sezioni nella finestra del disegno effettuando una delle seguenti operazioni:

  • Per selezionare una sezione creata con il comando Oggetto > Sezione > Crea, selezionate il disegno corrispondente sulla tavola da disegno. Se la sezione è legata a un gruppo o a un livello, selezionate l’icona di destinazione accanto al gruppo o al livello nel pannello Livelli.
  • Per selezionare una sezione creata con lo strumento sezione, con il comando Crea da selezione o con il comando Crea da guide, selezionate la sezione nel pannello Livelli.
  • Fate clic sul tracciato della sezione con lo strumento selezione .
  • Per selezionare un segmento di tracciato o un punto di ancoraggio della sezione, fate clic sull’elemento desiderato con lo strumento selezione diretta.

    nota: non potete selezionare le sezioni automatiche; queste sezioni appaiono più chiare.

Impostare le opzioni delle sezioni

Le opzioni di una sezione determinano l’aspetto e il funzionamento del contenuto della sezione nella pagina Web risultante.

  1. Effettuate una delle seguenti operazioni con lo strumento seleziona sezione:
    • Selezionate una sezione nella finestra del disegno e scegliete Oggetto > Sezione > Opzioni sezione.

    • Fate doppio clic su una sezione nella finestra di dialogo Salva per Web e dispositivi con lo Strumento Seleziona sezione.

  2. Selezionate un tipo di sezione e impostate le opzioni corrispondenti:

    Immagine

    Selezionate questo tipo se desiderate che l’area della sezione sia un file di immagine nella pagina Web risultante. Se desiderate che l’immagine sia un collegamento HTML, immettete un URL e un frameset di destinazione. Potete anche specificare il messaggio che verrà visualizzato nella barra di stato del browser quando il mouse si trova sopra l’immagine (testo alternativo che apparirà quando l’immagine non è visibile) e un colore di sfondo per la cella di tabella.

    Nessuna immagine

    Selezionate questo tipo se desiderate che l’area di sezione contenga testo HTML e un colore di sfondo nella pagina Web risultante. Immettete il testo desiderato nella casella Testo nella cella e formattate il testo con i tag HTML standard. Fate attenzione a non immettere più testo di quanto non possa essere visualizzato nell’area della sezione. Se inserite un testo troppo lungo, questo si estenderà nelle sezioni adiacenti, compromettendo il layout della pagina Web. Tuttavia, poiché non potete vedere il testo sulla tavola da disegno, questa anomalia non risulterà evidente finché non visualizzerete la pagina Web in un browser. Impostate le opzioni Orizz. e Vert. per modificare l’allineamento del testo nella cella di tabella.

    Testo HTML

    Questa opzione è disponibile solo se avete creato la sezione selezionando un oggetto di testo e scegliendo Oggetto > Sezione > Crea. Illustrator converte il testo in HTML con gli attributi base di formattazione nella pagina Web risultante. Per modificare il testo, aggiornate il testo nel disegno. Impostate le opzioni Orizz. e Vert. per modificare l’allineamento del testo nella cella di tabella. Potete anche selezionare un colore di sfondo per la cella di tabella.

    Suggerimento: Per modificare il testo di sezioni di tipo Testo HTML nella finestra Opzioni sezione, impostate il tipo di sezione su Nessuna immagine. In questo modo si interrompe il collegamento con l’oggetto di testo sulla tavola da disegno. Per ignorare la formattazione del testo, inserite <unformatted> come prima parola nell’oggetto di testo.

Bloccare le sezioni

Il blocco delle sezioni evita di eseguire delle modifiche involontarie, quali ridimensionamento o spostamento di sezioni.

  • Per bloccare tutte le sezioni, scegliete Visualizza > Blocca sezioni.
  • Per bloccare singole sezioni, fate clic sulla colonna di modifica delle sezioni nel pannello Livelli.

Regolare i bordi della sezione

Se avete creato una sezione con il comando Oggetto > Sezione > Crea, la posizione e le dimensioni della sezione sono legate al disegno contenuto. Di conseguenza, se spostate o ridimensionate il disegno, i bordi della sezione si adattano automaticamente.

Se avete creato una sezione con lo strumento sezione, con il comando Crea da selezione o con il comando Crea da guide, potete regolare le sezioni manualmente nei seguenti modi:

  • Per spostare una sezione, trascinatela in una nuova posizione con lo strumento selezione sezione . Premete Maiusc per limitare lo spostamento in verticale, orizzontale o diagonale a 45°.
  • Per ridimensionare una sezione, selezionatela con lo strumento seleziona sezione e trascinate un lato o un angolo qualsiasi della sezione. Potete anche usare lo strumento selezione e il pannello Trasforma per ridimensionare le sezioni.
  • Per allineare o distribuire le sezioni, usate il pannello Allinea. L’allineamento delle sezioni risulta nell’eliminazione delle sezioni automatiche superflue e quindi in un file HTML di dimensioni più piccole.
  • Per modificare l’ordine di sovrapposizione delle sezioni, trascinate la sezione in una nuova posizione nel pannello Livelli o selezionate uno dei comandi in Oggetto > Ordina.
  • Per dividere una sezione, selezionatela e scegliete Oggetto > Sezione > Dividi sezioni.

    Potete combinare le sezioni create con un metodo qualsiasi. Selezionate le sezioni e scegliete Oggetto > Sezione > Combina sezioni. La sezione risultante assume le dimensioni e la posizione del rettangolo creato unendo i bordi esterni delle sezioni combinate. Se le sezioni combinate non sono adiacenti o hanno proporzioni o allineamenti diversi, la nuova sezione risultante può risultare sovrapposta ad altre sezioni.

    Per ridimensionare tutte le sezioni secondo i margini della tavola da disegno, scegliete Oggetto > Sezione > Ritaglia secondo tavola disegno. Le sezioni che si estendono oltre la tavola da disegno vengono troncate ai margini della tavola da disegno, mentre le sezioni automatiche che si trovano al suo interno vengono estese fino ai suoi margini; il disegno stesso rimane invariato.

Rimuovere le sezioni

Potete rimuovere le sezioni eliminandole o rilasciandole dal disegno corrispondente.

  • Per eliminare una sezione, selezionatela e premete il tasto Canc. Se la sezione è stata creata con il comando Oggetto > Sezione > Crea, viene eliminato anche il disegno corrispondente. Per mantenere il disegno corrispondente, non eliminate la sezione ma rilasciatela.
  • Per eliminare tutte le sezioni, scegliete Oggetto > Sezione > Elimina tutto. Le sezioni create con il comando Oggetto > Sezione > Crea vengono rilasciate, non eliminate.
  • Per rilasciare una sezione, selezionatela e scegliete Oggetto > Sezione > Rilascia.

Mostrare o nascondere le sezioni

  • Per nascondere le sezioni nella finestra del disegno, scegliete Visualizza > Nascondi sezioni.
  • Per nascondere le sezioni nella finestra di dialogo Salva per Web e dispositivi, fate clic sul pulsante Attiva/disattiva la visibilità delle sezioni .
  • Per nascondere i numeri delle sezioni e modificare il colore delle linee di sezione, scegliete Modifica > Preferenze > Guide sensibili e sezioni (Windows) o Illustrator > Preferenze > Guide sensibili e sezioni (Mac OS).

Creare le mappe immagine

Le mappe immagine consentono di collegare una o più aree di un’immagine, chiamate punti di attivazione, a un URL. Quando un utente fa clic su un punto di attivazione, il browser Web carica il file collegato.

La differenza principale tra l’uso delle mappe immagine e delle sezioni per creare dei collegamenti risiede nel modo in cui l’immagine sorgente viene esportata come pagina Web. Con l’uso di mappe immagine il disegno rimane un singolo file immagine; con l’uso di sezioni il disegno viene suddiviso in file separati. Inoltre, le mappe immagine consentono di collegare al disegno aree circolari, poligonali o rettangolari; con le sezioni, invece, potete collegare solo aree rettangolari. Se dovete collegare solo aree rettangolari è meglio usare le sezioni piuttosto che una mappa immagine.

Nota:

per evitare risultati imprevisti, non create punti di attivazione di mappe immagine in sezioni che contengono collegamenti a URL: alcuni browser potrebbero ignorare il collegamento della mappa immagine o quello della sezione.

  1. Selezionate l’oggetto da collegare a un URL.
  2. Nel pannello Attributi, selezionate una forma per la mappa immagine dal menu Mappa immagine.
  3. Inserite un percorso URL nella casella di testo URL o sceglietene uno dall’elenco di URL disponibili. Per verificare il collegamento all’URL, fate clic sul pulsante Browser.

    Nota:

    Per aumentare il numero di voci visibili nel menu URL, selezionate Opzioni pannello nel menu del pannello Attributi. Immettete un valore da 1 a 30 per definire il numero di URL da visualizzare nell’elenco.

Questo prodotto è concesso in licenza in base alla licenza di Attribuzione-Non commerciale-Condividi allo stesso modo 3.0 Unported di Creative Commons.  I post su Twitter™ e Facebook non sono coperti dai termini di Creative Commons.

Note legali   |   Informativa sulla privacy online