Scarica il nostro workbook gratuito per progettare il tuo sito in tutta sicurezza.
L'indirizzo e-mail inserito non è valido.
Grazie per l'iscrizione.
Indicando la tua e-mail, confermi di aver letto e compreso la nostra Informativa sulla privacy e acconsenti a ricevere materiale di marketing da parte di Squarespace.
Vuoi dare una rinfrescata al tuo sito web e apportare qualche modifica al suo design, ma ti sembra di aver già esaminato a fondo ogni possibile opzione, ogni tweak di stile, ogni tipo di blocco e caratteristica?
Squarespace è in continuo aggiornamento e arricchisce costantemente la propria offerta di strumenti per offrire nuove opzioni per la personalizzazione del tuo sito web. Questo articolo mette in evidenza alcune opzioni che forse non hai ancora scoperto, ma che potrebbero essere proprio gli strumenti che stai cercando per perfezionare l'aspetto del tuo sito.
Questi strumenti sono anche ottimi punti di accesso per iniziare a esplorare le funzionalità più profonde della piattaforma e guidarti lungo un nuovo percorso creativo.
Modificare le sezioni della pagina
Le sezioni della pagina sono costituite dai diversi elementi che compongono il contenuto di una pagina web, come l'introduzione o l'elenco dei servizi. Vediamo alcune delle opzioni di design disponibili al fine di aggiornare le sezioni della pagina.
1. Divisori di sezione
I divisori di sezione aggiungono interruzioni più marcate tra le sezioni della pagina. Puoi scegliere di aggiungere una linea vera e propria in diversi stili, come un'onda o una diagonale, oppure ritagliare lo sfondo di una sezione o un'immagine di sfondo per marcare l'interruzione.
Possono essere utili per separare visivamente i contenuti, consentendo a ogni sezione di avere il proprio spazio senza la necessità di creare una nuova pagina, garantendo un design più dinamico. Puoi utilizzare i divisori di sezione per suddividere i layout delle pagine in vari modi, come ad esempio:
Creare un'interruzione tra le sezioni Informazioni e Il nostro team su un'unica pagina, consolidando due potenziali pagine in una sola
Creare un sito web di una pagina più organizzato
Aggiungere una separazione tra il contenuto della pagina principale e il piè di pagina del tuo sito
Aggiungere divisori di sezione
2. Immagini e video di sfondo della sezione
Aggiungi sfondi originali alle sezioni delle pagine per catturare l'attenzione del visitatore che arriva sul tuo sito. Utilizzali per sostituire un video di sfondo, per differenziare le sezioni o come introduzione visiva a qualsiasi pagina del tuo sito.
Ad esempio, puoi aggiungere un video di sfondo alla prima sezione della home page del tuo sito per fornire una panoramica del tuo prodotto, servizio o lavoro. Puoi anche utilizzare le immagini di sfondo delle sezioni per dare un aspetto a sezioni specifiche di una pagina.
Suggerimento: a seconda della velocità di connessione e della versione del browser, i video di sfondo potrebbero non essere caricati per tutti. È utile aggiungere un'immagine di fallback su dispositivi mobili da mostrare quando il video non appare.
Aggiungere uno sfondo Scenographik di sezione
3. Layout intelligenti
Se cerchi un aiuto per creare una sezione di pagina o vuoi avere un modello di riferimento su cui lavorare, i layout intelligenti sono un ottimo punto di partenza. Tali layout propongono una serie di contenuti suddivisi in design selezionati. Questi design includono layout per scopi diversi, come colonne e righe, caroselli o slideshow.
Sono perfetti per mantenere pagine semplici con contenuti che devono essere aggiornati regolarmente, come immagini di prodotti in primo piano, progetti recenti e membri attuali del team. Sebbene questi contenuti siano già presenti in layout preimpostati, puoi creare sezioni aggiuntive per rendere il design tuo.
Utilizzare i layout intelligenti sul sito
4. Sfondi Scenographik
Sebbene le immagini di sfondo delle sezioni possano rappresentare un ottimo modo per attirare l'attenzione dei visitatori, puoi anche aggiungere uno sfondo Scenographik a una sezione della pagina per creare un ulteriore livello di personalizzazione. Gli sfondi Scenographik permettono di creare un look unico utilizzando colori, motivi e forme generate dalla piattaforma Squarespace.
Si tratta di un'ottima scelta per creare sezioni tematiche su un'unica pagina, ad esempio per organizzare il sito di una scuola in sezioni suddivise per livello, oppure per migliorare l'aspetto di una FAQ caratterizzata da un elevato contenuto di testo.
Blocchi
I blocchi sono elementi di design che possono essere inseriti nelle sezioni di una pagina Squarespace, come un blocco di testo, un blocco modulo o un blocco immagine. Di seguito sono elencati alcuni tipi di blocchi con alcune caratteristiche che forse non hai ancora avuto modo di provare.
5. Blocchi scorrimento
I blocchi scorrimento sono un tipo di blocco unico che consente di esporre un testo che scorre orizzontalmente sulla pagina. La funzione è simile a quella di un tendone teatrale o di un ticker di notizie. La velocità e la forma dello scorrimento possono essere controllate.
Si tratta di un ottimo modo per vivacizzare il design del tuo sito e richiamare l'attenzione dei visitatori sulle informazioni più importanti.
È possibile utilizzare i blocchi scorrimento per:
Segnalare svendite, lanci o prodotti popolari
Creare un ticker degli eventi imminenti
Mostrare le recensioni e le testimonianze dei clienti
Aggiungi blocchi di scorrimento al tuo sito
6. Blocchi forma
I blocchi forma consentono di aggiungere forme diverse con riempimento solido alle sezioni della pagina. In questo modo puoi diversificare i layout delle pagine e creare design diversi.
Puoi anche sovrapporre i blocchi forma con altri tipi di blocchi per creare layout ancora più suggestivi. Le forme possono essere posizionate dietro le immagini del tuo sito per farle risaltare nella pagina o per distinguerle dagli altri contenuti di una galleria.
Ecco alcune possibilità di utilizzo dei blocchi forma:
Aggiunta di un blocco a forma di stella dietro la testimonianza di un cliente per enfatizzare la loro esperienza 5a stelle
Aggiunta di blocchi forma di colore diverso intorno a una pagina che descrive i tuoi servizi di preparazione di torte di compleanno per dare un tocco di festa in più
Scopri di più sull'utilizzo dei blocchi forma
7. Blocchi a fisarmonica
I blocchi a fisarmonica espongono il testo in sezioni pieghevoli e cliccabili. Questo aiuta a mantenere al minimo la lunghezza della pagina e a ridurre lo scorrimento per i tuoi visitatori. I blocchi a fisarmonica possono aiutarti a creare un design più strutturato per le pagine ricche di testo come le FAQ o gli elenchi dei prodotti.
Ad esempio, potresti utilizzare un blocco a fisarmonica per mettere in evidenza alcune informazioni importanti su un servizio offerto dalla tua azienda, con sezioni ben distinte che permettano ai clienti di approfondire. Un fotografo di matrimonio potrebbe utilizzare un blocco a fisarmonica per scomporre il processo di lavoro, con sezioni a fisarmonica come: incontro e saluto, scelta del pacchetto, servizio di fidanzamento, incontro prematrimoniale, giorno del matrimonio, momento successivo al grande giorno.
Aggiungi blocchi a fisarmonica al tuo sito
8. Fissaggio dei blocchi
Puoi fissare qualsiasi tipo di blocco su una sezione della pagina. In questo modo, i blocchi rimangono fermi mentre i visitatori scorrono il resto dei contenuti nella stessa sezione.
Inoltre, aiuta a garantire che le informazioni e i contenuti importanti siano visibili indipendentemente dal punto in cui stai scorrendo. Ad esempio, puoi:
Mettere in evidenza la sede della tua attività e gli orari di apertura mentre i visitatori navigano tra i prodotti
Mettere la tua immagine in primo piano quando presenti i tuoi risultati o i tuoi servizi
Evidenziare un disclaimer quando necessario
Tenere sempre sotto controllo il tuo modulo di contatto o di iscrizione alla newsletter
Formattazione del testo
Il modo in cui stili il testo sul tuo sito web può avere un impatto su ciò che i visitatori del sito prestano attenzione e su ciò che ricordano. Ecco alcune opzioni e funzioni di formattazione del testo che ti permetteranno di ottenere il massimo dalle tue parole.
9. Evidenziazioni del testo
Per far risaltare determinati testi, prova a utilizzare la funzione di evidenziazione del testo. In questo modo puoi enfatizzare le informazioni chiave di una pagina o renderla più scorrevole quando necessario.
L'evidenziazione del testo ha le seguenti opzioni di stile:
Animazione: anima la forma di evidenziazione per creare movimento e attirare l'attenzione sul tuo testo.
Porta in primo piano: questa opzione consente all'evidenziazione di sovrapporsi al testo, facendolo sembrare più simile a un momento saliente della vita reale.
Colore: cambia il colore dell'evidenziazione per farla risaltare o abbinarla meglio al design del tuo sito.
Forma delle estremità: puoi scegliere se arrotondare o squadrare le estremità della selezione.
Spessore: regola lo spessore della linea di evidenziazione.
Si tratta di un'ottima opzione per:
Mettere in evidenza le recensioni dei clienti
Accentuare le parti chiave di un post del blog
Attirare l'attenzione su alcuni elementi di una pagina Chi siamo
Ulteriori informazioni sull'evidenziazione del testo
10. Testo scalabile
Il ridimensionamento del testo consente di adattare le dimensioni del testo alla larghezza di un blocco. È un modo rapido per ridimensionare il testo senza interruzioni di riga, indipendentemente dalle dimensioni del browser. Raccomandiamo questa funzione per i titoli brevi o le intestazioni. È anche ideale per:
Suddividere il contenuto in sezioni utilizzando le intestazioni
Creare elenchi concisi
Riportare citazioni importanti da porzioni di testo più ampie
Scopri come ridimensionare il testo
Formattazione delle immagini
Anche lo stile e il formato delle immagini possono aggiungere personalità e interesse visivo al design del sito.
11. Animazioni ed effetti dei blocchi immagine
Puoi aggiungere effetti ai blocchi immagine per dare alle immagini un aspetto più stilizzato e particolare. Alcune opzioni aggiungono un'animazione, come un'onda sottile o un effetto statico per enfatizzare lo stile visivo del tuo sito. Altri effetti appaiono solo quando il visitatore scorre la sezione del sito.
Si tratta di un modo fantastico per:
Dare più vita a un'area altrimenti statica di un sito
Aggiungere movimento alle immagini fisse senza ricorrere ai video
Fare in modo che le immagini chiave siano sempre in grado di attirare l'attenzione
Aggiungi animazioni ed effetti ai blocchi immagine
12. Forme e maschere delle immagini
I blocchi immagine possono anche essere modellati al fine di modificare l'aspetto e la funzionalità di ciascuna immagine in una pagina. Le opzioni disponibili per modellare le immagini includono:
Utilizzo delle impostazioni del raggio dell'angolo per arrotondare gli angoli di un'immagine
Impostazione di una forma completa, come un cerchio o un triangolo
L'impostazione della forma completa appare sopra l'immagine, come una maschera, dandole una nuova forma. Trasforma la tua galleria fotografica in una serie di forme interessanti o le tue offerte di prodotti in qualcosa che va oltre le immagini standard per attirare davvero l'attenzione.