Elementi di base della progettazione
Al fine di disporre di tutte le opzioni per la progettazione del sito Web, aprire Progettazione avanzata. La modifica del progetto e del layout avviene in modalità WYSIWYG e le modifiche vengono visualizzate immediatamente.L'area di lavoro del browser viene divisa in due. Nella sezione superiore viene visualizzata la barra multifunzione, con tutte le funzioni disponibili. Per ulteriori informazioni, vedere Barra multifunzione e contenuto.Nella sezione inferiore, dove è possibile modificare direttamente il progetto e il layout, viene visualizzata l'anteprima della pagina, che mostra la pagina Web corrente con il design e il layout specificati dallo stile selezionato. Vedere I miei stili.Il sito Web è suddiviso nelle seguenti aree funzionali. Vedere Figura 8.
Figura 8: struttura del sito Web
Area 1: Intestazione Area 2: Superiore Area 3: Sinistro Area 4: Area dei contenuti Area 5: Destro Area 6: Inferiore Area 7: Piè di pagina
È inoltre disponibile l'area di lavoro del browser, che circonda l'area di visualizzazione del sito Web. Vedere Imposta visualizzazione pagina nel browser.Per modificare un'area, fare clic con il mouse nella posizione corrispondente. L'area viene attivata ed evidenziata con un bordo. La barra multifunzione visualizza le funzioni eseguibili nell'area.In termini di opzioni di modifica e configurazione, le aree del sito possono essere suddivise in aree verticali, aree orizzontali e area dei contenuti:
I parametri delle singole aree, una volta combinati, creano il design completo. Alcuni parametri si influenzano a vicenda o sono interdipendenti. Questi effetti collaterali vanno tenuti in considerazione. Le seguenti informazioni potranno risultare utili:
- Nelle aree le immagini di sfondo hanno la priorità rispetto ai colori di sfondo. Ciò significa che, se si carica un'immagine di sfondo e si imposta anche un colore di sfondo, l'immagine coprirà il colore.
- Tutte le dimensioni per gli esempi sono espresse in pixel (px). È possibile utilizzare altre unità di misura, adottabili nei fogli di stile, ad esempio la percentuale (%). Per ulteriori informazioni sulle possibili impostazioni e sul relativo utilizzo, consultare le informazioni corrispondenti in siti Web specializzati, ad esempio http://www.selfhtml.org (parzialmente in inglese).
- Provare le diverse impostazioni, tenendo presente che è possibile utilizzare la funzione Annulla in qualsiasi momento per ripristinare lo stato iniziale. In alternativa, creare una copia dello stile corrente e provare le varie opzioni sulla copia. È possibile fare ciò nella tabella degli stili personalizzati mediante la funzione Crea una copia di backup. Per ulteriori informazioni, vedere I miei stili. Una volta creato il progetto desiderato, attivare lo stile per i clienti.
Note sulle immagini dello sfondoIn ciascun modello del progetto vengono caricati modelli corrispondenti per le immagini di sfondo. È possibile sostituire a tali modelli immagini personalizzate. Se si eliminano le immagini personalizzate, i modelli corrispondenti vengono ricaricati automaticamente. Se non si desidera un'immagine di sfondo, rimuovere il modello. Fare clic sul collegamento Rimuovi modello. Dopo la rimozione del modello, il nome del collegamento viene modificato in Ripristina modello. Fare clic sul collegamento al fine di ripristinare il modello predefinito per l'immagine di sfondo senza dover cercare il nome file corrispondente.Nota: se si imposta sia un colore di sfondo, sia un'immagine di sfondo, l'immagine di sfondo sarà sempre sovrapposta al colore di sfondo. Pertanto, per visualizzare il colore, è necessario eliminare l'immagine. Se lo sfondo deve essere riempito completamente, sarà necessario ridimensionare l'immagine in modo da adattarla all'area oppure utilizzare la funzione Affianca immagine.Affianca immagineLe immagini di sfondo possono essere visualizzate come immagine unica oppure più volte, in modo da riempire lo sfondo dell'intera pagina. Le copie dell'immagine vengono affiancate fino a riempire l'intera pagina.