Come lavorare con Oggetto Testo

Best Practice > Passo 4 - Pagine >

Come lavorare con Oggetto Testo

Previous pageReturn to chapter overviewNext page
Mostra/Nascondi testo nascosto 

Facendo doppio click su un Oggetto Testo inserito all'interno della Griglia di impaginazione o selezionandolo e cliccando sul pulsante , si accede alla finestra Oggetto Testo. Attraverso questa finestra, che propone un editor, è possibile procedere direttamente alla digitazione e alla formattazione dei testi.

Clicca per espandere/ridurreHow To: Come utilizzare un Web Font per formattare il testo

Formattare un testo è un'operazione veramente molto semplice: è sufficiente selezionarlo e scegliere il font da utilizzare attraverso l'apposito menu dell'editor. Questo menu propone solo i font standard (o Safe Fonts), ovvero quelli universalmente presenti su tutti i dispositivi: Arial, Verdana, Georgia, e pochi altri. Se, infatti, si utilizza un font installato sul nostro sistema operativo ma non su quello dell'utente che visualizzerà la Pagina Web, i testi verranno renderizzati con un font di default, alterando di fatto il layout originale (vedere, Font standard e Web Font).

La soluzione per ovviare a questo inconveniente senza rinunciare alla possibilità di utilizzare font diversi da quelli stardard, è di ricorrere ai Web Font.

I Web Fonts non devono essere necessariamente installati sul sistema e possono essere ripresi da:

portali come Google Fonts™ (gratuito): offrono Web Fonts già pronti all'uso da richiamare attraverso i fogli di stile (CSS) delle Pagine del Sito.
portali come Fontsquirrel: permettono di scaricare nuovi font sul nostro computer, perché possano poi essere pubblicati sul server Web del Sito.

Per poter utilizzare un Web Font questo deve essere ripreso da Internet e integrato in WebSite X5.

Fatto questo il nuovo Web Font compare nel lista dei font utilizzabili e può essere applicato all'elemento di testo selezionato.

Per permettere di scegliere più consapevolmente, nei menu i font sono affiancati dalle seguenti icone:

I tipi di font sono facilmente distinguibili grazie alle icone associate:

Google Fonts: font integrati attraverso la finestra Aggiungi Web Font di WebSite X5 e collegati al server Google.

Online Web Fonts: font integrati attraverso la finestra Aggiungi Web Font di WebSite X5 e collegati ai server del servizio che offre i font.

Offline Web Fonts: font integrati attraverso la finestra Aggiungi Web Font di WebSite X5 e pubblicati sul server Web del Sito.

Clicca per espandere/ridurreHow To: Come creare un testo con barra di scorrimento

Inserendo un Oggetto Testo in una Pagina, questo assume in automatico un'altezza tale da permettere la visualizzazione dell'intero contenuto. Se il testo è abbastanza lungo e lo si vuole visualizzare in una finestra di dimensioni contenute, è possibile impostare l'altezza desiderata e forzare la visualizzazione della barra di scorrimento.

Inserire in una Pagina un Oggetto Testo, quindi accedere alla finestra Oggetto Testo per digitare e formattare il testo.
Cliccare sul pulsante per richiamare la finestra RollOver.
Attivare l'opzione Abilita RollOver e impostare come Movimento l'opzione Nessuno - Mostra barra di scorrimento.
Impostare il valore in pixel desiderato per l'Altezza.
Clicca per espandere/ridurreHow To: Come creare un testo scorrevole

Un modo per presentare, per esempio, una lista di notizie è quello di farla scorrere come i titoli di un telegiornale, o in senso orizzontale o in senso verticale.

Inserire in una Pagina un Oggetto Testo, quindi accedere alla finestra Oggetto Testo per digitare e formattare il testo.
Cliccare sul pulsante per richiamare la finestra RollOver.
Attivare l'opzione Abilita RollOver e impostare come Movimento, per esempio, l'opzione Scorrimento singolo specificandone la Direzione.
Definire l'effetto attraverso i parametri disponibili e attivare l'opzione Ferma il movimento al passaggio del mouse: in questo modo se sui titoli delle notizie è impostato un link di approfondimento, il Visitatore può bloccare l'effetto di scorrimento e cliccare sulla notizia che desidera leggere.
Clicca per espandere/ridurreHow To: Come creare un testo a schede (visualizzazione a Tab)

In molti casi per fornire una presentazione completa di un prodotto/servizio o, comunque, per trattare in maniera esaustiva un argomento si è costretti ad articolare le informazioni in livelli successivi di approfondimento e a inserirle in diverse Pagine del Sito fra loro collegate.

Un modo alternativo, che in alcuni casi può anche rivelarsi più efficace, è di organizzare questa mole di informazioni non in Pagine diverse ma in Schede diverse di uno stesso Oggetto Testo, sfruttando una visualizzazione a Tab.

Clicca per espandere/ridurre

Lavorando con l'edizione Pro di WebSite X5 per creare un testo a schede è sufficiente:

Inserire in una Pagina un Oggetto Testo, quindi accedere alla finestra Oggetto Testo per digitare e formattare il testo.
Cliccare con ili tasto destro del mouse sulla linguetta Scheda 1 presente al fondo dell'area di lavoro: nel menu contestuale cliccare su Aggiungi Scheda per creare una nuova Scheda vuota.
Nominare opportunamente la Scheda appena creata e inserirne il contenuto.
Nello stesso modo, inserire e comporre tutte le Schede necessarie: il menu contestuale presenta tutti i comandi per aggiungere, eliminare, rinominare e spostare le Schede.
Accedere alla sezione Oggetto Testo | Stile Schede e scegliere il Tipo di visualizzazione: impostare, per esempio, Schede - Orizzontale e definire tutte le opzioni per definirne dimensioni, grafica ed effetti.

Combinando la versatilità dell'Oggetto Testo (che consente di inserire non solo testo ma anche immagini, collegamenti e porzioni di codice HTML) con le possibilità offerte dalla visualizzazione a Schede è possibile ottenere risultati veramente notevoli: possiamo facilmente immaginare ricettari, schede di offerte immobiliari, cataloghi per ogni sorta di prodotti fino ad arrivare a veri e propri caroselli pubblicitari.

 


Best practice:

-

Come utilizzare i Web Font

-

Come scaricare un font da Fontsquirrel


Approfondimenti:

-

Font standard e Web Font