Design del layout in Drupal

Design del layout in Drupal: creare, posizionare e gestire in modo sensato i blocchi di contenuto

Il sistema dei blocchi è una delle funzionalità di layout più importanti in Drupal. Mentre i contenuti come pagine, articoli o post di blog appaiono solitamente nell'area principale di un sito web, gli elementi ricorrenti vengono gestiti tramite i blocchi. Questi includono, ad esempio, menu di navigazione, box di contatto, campi di ricerca, moduli di iscrizione alla newsletter, aree di call-to-action, colonne del footer, loghi, link ai social media, selettori di lingua o box informativi personalizzati.

In Drupal, un blocco è un contenitore autonomo di contenuti o funzioni che viene assegnato a una specifica regione del tema. Le regioni sono le zone di layout previste da un tema, come ad esempio Header, Primary Menu, Sidebar, Content, Footer o altre aree definite dal tema stesso. Le regioni disponibili dipendono dal tema Drupal utilizzato. Proprio per questo motivo il sistema dei blocchi è estremamente flessibile: consente di mostrare contenuti in diversi punti del sito web senza dover modificare manualmente ogni singolo template.

Questo articolo spiega come gestire i blocchi in Drupal, creare blocchi di contenuto personalizzati, posizionare i blocchi nelle regioni e utilizzare in modo sensato le regole di visibilità. Inoltre, troverete consigli pratici su sicurezza, prestazioni, SEO e su come mantenere una struttura pulita del sito web.

Cosa sono i blocchi in Drupal?

I blocchi sono elementi riutilizzabili che vengono visualizzati in specifiche aree di layout di un sito web Drupal. Possono essere costituiti da testo semplice, contenere codice HTML, essere generati da un modulo o composti da campi definiti individualmente. Un modulo di ricerca, un menu, una navigazione breadcrumb (briciole di pane) o un blocco di login sono tipici esempi di blocchi forniti nativamente da Drupal o dai moduli installati.

Inoltre, è possibile creare i propri blocchi personalizzati. Questi sono particolarmente adatti per contenuti che non devono apparire come una normale pagina, ma che devono comunque essere visibili in una posizione di rilievo. Esempi tipici sono una breve nota di supporto nel footer, un box di contatto nella barra laterale, un banner nella homepage o un avviso relativo a lavori di manutenzione.

Un grande vantaggio di Drupal risiede nel fatto che un blocco non solo può essere posizionato, ma può anche essere configurato. È possibile stabilire in quali pagine un blocco sia visibile, per quali ruoli utente debba essere mostrato, in quale lingua debba apparire o a quali condizioni debba essere nascosto. Ciò consente di implementare concetti di layout e di contenuto molto precisi.

La differenza tra contenuto, blocco e regione

Soprattutto per i principianti, è fondamentale comprendere che Drupal distingue tra contenuto, blocco e regione:

• Contenuto: Normali contenuti della pagina come articoli, pagine, news, post di blog o informazioni sui prodotti.
• Blocco: Un singolo elemento di layout che viene visualizzato in un punto specifico del sito web.
• Regione: Un'area fornita dal tema all'interno della quale possono essere posizionati i blocchi.

Un esempio: si crea un box di contatto con numero di telefono e indirizzo e-mail. Questo box di contatto è un blocco. Questo blocco viene posizionato nella regione "Sidebar" o "Footer". Il contenuto effettivo della pagina, ad esempio una sottopagina "Chi siamo", rimane separato da esso. In questo modo è possibile mostrare lo stesso box di contatto su molte pagine senza doverlo copiare in ognuna di esse.

Aprire il layout dei blocchi in Drupal

Per gestire il layout dei blocchi del vostro sito Drupal, accedete con un account utente che disponga di sufficienti diritti amministrativi. Successivamente, nel backend di Drupal, navigate su:

Struttura -> Layout dei blocchi

In questa pagina vengono mostrate le regioni disponibili del vostro tema attivo. A seconda del tema, queste possono avere nomi diversi. Le regioni più comuni sono:

• Header: area superiore del sito web, spesso utilizzata per il logo, la navigazione o la funzione di ricerca.
• Primary Menu: menu di navigazione principale del sito web.
• Highlighted: area in evidenza, ad esempio per avvisi importanti.
• Content: area del contenuto principale della pagina.
• Sidebar First / Sidebar Second: barra laterale sinistra o destra.
• Footer: area inferiore del sito web, spesso utilizzata per dati di contatto, link utili o note legali.

Non tutti i temi forniscono le stesse regioni. Se si cambia il tema, di conseguenza può variare anche il layout dei blocchi disponibile. Dopo il cambio di un tema, verificate sempre se tutti i blocchi importanti appaiono ancora nella posizione desiderata.

Posizionare blocchi esistenti

Per posizionare un blocco esistente in una regione, procedere come segue:

1. Aprire Struttura -> Layout dei blocchi.
2. Cercare la regione desiderata, ad esempio Sidebar, Header o Footer.
3. In questa regione, fare clic su Posiziona blocco.
4. Selezionare il blocco desiderato dall'elenco.
5. Fare clic su Posiziona blocco o sul pulsante corrispondente.
6. Configurare il titolo, la visibilità e le altre impostazioni.
7. Salvare la modifica.

Dopo il salvataggio, è opportuno verificare il sito web nel frontend. Prestate attenzione non solo alla homepage, ma anche alle sottopagine, alle pagine di contenuto e alle visualizzazioni mobili. Un blocco può apparire ottimale su desktop, ma occupare troppo spazio o apparire in una posizione scomoda sugli smartphone.

Creare i propri blocchi personalizzati

I blocchi personalizzati sono ideali quando si desidera gestire i propri contenuti in modo indipendente dai normali contenuti della pagina. Questi includono, ad esempio:

• Box di contatto con numero di telefono, indirizzo e-mail e orari di apertura
• Avvisi relativi a supporto, manutenzione o promozioni stagionali
• Blocchi di Call-to-Action come "Richiedi ora un preventivo"
• Colonne del footer con informazioni aziendali
• Elementi di fiducia (Trust elements) come certificati, l'indicazione della sede in Svizzera o informazioni sulla sicurezza
• Brevi teaser per servizi, prodotti o download

Per creare un proprio blocco, la procedura generale è la seguente:

1. Aprire Struttura -> Layout dei blocchi.
2. Passare alla scheda Libreria dei blocchi personalizzati oppure selezionare nel layout dei blocchi l'opzione per aggiungere un blocco personalizzato.
3. Fare clic su Aggiungi blocco personalizzato.
4. Scegliere il tipo di blocco appropriato, ad esempio Basic block (Blocco di base) o un tipo di blocco personalizzato precedentemente creato.
5. Inserire una descrizione interna chiara.
6. Inserire il contenuto del blocco.
7. Salvare il blocco.
8. Successivamente, posizionare il blocco nell'area di layout desiderata.

La descrizione interna dovrebbe essere univoca. Al posto di "Box 1", è decisamente preferibile utilizzare nomi come "Footer Box Contatto IT" o "Homepage CTA Webhosting". In questo modo si manterrà una visione d'insieme chiara anche nei siti web più grandi e con molti blocchi.

Creare tipi di blocco personalizzati con campi

Drupal consente non solo di creare semplici blocchi di testo, ma anche tipi di blocco personalizzati con campi strutturati. Questo è particolarmente utile quando si devono creare più blocchi simili. Un esempio è un blocco di Call-to-Action con i seguenti campi:

• Titolo
• Breve testo descrittivo
• Immagine o icona
• Testo del pulsante
• Link del pulsante

Il vantaggio: i redattori non devono scrivere codice HTML ogni volta. Al contrario, compilano campi predefiniti. Questo riduce gli errori, garantisce un design uniforme e facilita le modifiche successive. Nei siti Drupal professionali, questo approccio strutturato è solitamente preferibile rispetto all'inserimento di codice HTML formattato liberamente in ogni singolo blocco.

Per i siti web semplici, spesso è sufficiente il tipo di blocco standard. Per i siti web aziendali più grandi, portali, siti multilingue o team redazionali, vale invece la pena pianificare accuratamente i propri tipi di blocco.

Controllare la visibilità dei blocchi

Una delle funzionalità più potenti del sistema dei blocchi di Drupal è data dalle impostazioni di visibilità. È possibile stabilire esattamente quando e dove mostrare un blocco. Le regole di visibilità tipiche sono:

• Per pagine: un blocco appare solo su determinati percorsi URL, ad esempio solo sulla homepage.
• Per tipo di contenuto: un blocco viene mostrato solo per determinati tipi di contenuto, ad esempio solo negli articoli del blog.
• Per ruolo utente: un blocco è visibile solo per gli utenti registrati, per i redattori o per gli amministratori.
• Per lingua: un blocco viene visualizzato solo nella specifica versione linguistica.

Queste regole sono particolarmente importanti quando ci si rivolge a diversi gruppi di destinatari. Ad esempio, un avviso di supporto per i clienti registrati non deve necessariamente apparire in ogni pagina pubblica. Allo stesso modo, un blocco di testo rilevante ai fini SEO può essere utile su una landing page, ma risultare di disturbo in una pagina di checkout o in un modulo di contatto.

Ordinare i blocchi e modificare la sequenza

All'interno di una stessa regione possono essere posizionati più blocchi. La sequenza determina quale blocco viene visualizzato per primo. Nel layout dei blocchi, è possibile spostare i blocchi principalmente tramite trascinamento (drag-and-drop) o ordinarli tramite i pesi numerici. Dopo ogni modifica, è necessario salvare il nuovo ordine.

Verificate l'ordine dal punto di vista dei visitatori. Gli elementi importanti dovrebbero apparire per primi. In un footer, ad esempio, l'indirizzo dell'azienda può trovarsi prima di link secondari meno importanti. In una barra laterale, un blocco di contatto può essere più sensato se posizionato prima di un blocco archivio o di un blocco tag.

Disattivare o rimuovere i blocchi

Quando un blocco non è più necessario, occorre distinguere tra il rimuoverlo da una regione, il disattivarlo e l'eliminarlo definitivamente:

• Rimuovere dalla regione: il blocco non viene più visualizzato, ma continua a esistere nel sistema.
• Disattivare: a seconda della configurazione, il blocco rimane disponibile ma non viene utilizzato attivamente.
• Eliminare: il blocco o il contenuto del blocco viene rimosso in modo permanente.

Eliminate i blocchi solo se siete certi che non serviranno più. Nei siti web multilingue o nei layout più complessi, un blocco potrebbe essere ancora rilevante in un altro punto del sito. Documentate le modifiche principali al layout, in modo che i futuri interventi di manutenzione rimangano tracciabili.

Siti web Drupal multilingue e blocchi

Nei siti web multilingue è necessaria una cura particolare. Un blocco in lingua tedesca non deve apparire accidentalmente su una pagina in francese o in italiano. Verificate quindi per ogni blocco:

• Il blocco è traducibile?
• Esistono le versioni linguistiche corrispondenti?
• Le regole di visibilità sono impostate correttamente?
• I link interni rimandano alla corretta versione linguistica?
• I testi dei pulsanti, i dati di contatto e le note legali sono localizzati correttamente?

Soprattutto in Svizzera, data la presenza di più lingue nazionali, una logica linguistica pulita è fondamentale. Per aziende, associazioni e organizzazioni, l'immagine risulta più professionale se la navigazione, il footer, i blocchi di contatto e gli elementi di call-to-action sono coerenti dal punto di vista linguistico.

Sicurezza nel lavoro con i blocchi

I blocchi possono contenere HTML, link, media incorporati o script. Pertanto, solo gli utenti fidati dovrebbero ricevere l'autorizzazione a creare blocchi o a utilizzare codice HTML non filtrato. Un blocco impostato in modo errato non solo può danneggiare il layout, ma può anche causare rischi per la sicurezza.

Prestate particolare attenzione ai seguenti punti:

• Assegnate i diritti di gestione dei blocchi solo a personale formato.
• Utilizzate formati di testo sicuri ed evitate l'uso non necessario di HTML non filtrato.
• Verificate attentamente i link esterni e i contenuti incorporati.
• Non utilizzate script copiati da fonti sconosciute.
• Testate i nuovi blocchi prima in un ambiente di staging o di test, qualora il sito web sia critico per l'attività aziendale.

Prestazioni: troppi blocchi possono rallentare il sito web

I blocchi sono pratici, ma possono influenzare il tempo di caricamento delle pagine. In particolare, i blocchi dinamici, le integrazioni esterne, le immagini di grandi dimensioni, i video o le viste (views) complesse possono causare un carico aggiuntivo sul server. Assicuratevi quindi che i blocchi non carichino una quantità eccessiva e non necessaria di dati.

Raccomandazioni per migliori prestazioni:

• Utilizzate immagini ottimizzate e nelle dimensioni corrette.
• Evitate script esterni non necessari all'interno dei blocchi.
• Utilizzate il sistema di caching di Drupal in modo intelligente.
• Controllate in modo particolare la homepage, le landing page e la visualizzazione mobile.
• Rimuovete i blocchi vecchi o non più utilizzati.

Anche un hosting veloce è altrettanto importante. Drupal trae grande beneficio da risorse server stabili, versioni PHP aggiornate, prestazioni pulite del database e un caching affidabile. Questo vale soprattutto per i siti web con molti blocchi, viste, contenuti multilingue o flussi di lavoro redazionali. Potete trovare informazioni sulle offerte di hosting adeguate nella sezione Hosting Web Svizzero.

SEO e GEO: utilizzare i blocchi in modo sensato per una migliore reperibilità

Se utilizzati in modo sensato, i blocchi possono supportare l'ottimizzazione per i motori di ricerca e la visibilità nei sistemi di ricerca basati sull'intelligenza artificiale. È importante che i contenuti dei blocchi non siano solo decorativi, ma forniscano un contesto reale. I motori di ricerca e i sistemi di intelligenza artificiale analizzano i contenuti in modo sempre più semantico. Argomenti chiaramente denominati, link interni univoci e informazioni aggiuntive utili possono quindi influire positivamente.

Aree di applicazione SEO e GEO ideali per i blocchi:

• Collegamento interno: inserite link da pagine tematicamente pertinenti verso servizi correlati, guide o pagine di contatto.
• Segnali locali: utilizzate i blocchi del footer o di contatto per mostrare dati aziendali coerenti, informazioni sulla sede e opzioni di contatto.
• Box FAQ: brevi e utili domande aggiuntive possono offrire orientamento agli utenti e ai sistemi di intelligenza artificiale.
• Elementi di fiducia: i riferimenti alla posizione del server in Svizzera, alla protezione dei dati, al supporto o alla sicurezza possono generare fiducia.
• Call-to-Action: passaggi successivi chiari migliorano la guida dell'utente.

Evitate tuttavia il keyword stuffing (riempimento di parole chiave). Un blocco con termini ripetuti artificialmente come "Hosting Drupal Svizzera economico veloce sicuro" risulta poco professionale e può danneggiare la qualità della pagina. Sono decisamente migliori i contenuti formulati in modo naturale che rispondono a domande concrete.

Errori tipici con i blocchi di Drupal

Nella pratica, durante la gestione dei blocchi si verificano spesso problemi simili:

• Il blocco non appare: verificate la regione, la visibilità, la lingua, il ruolo utente e la cache.
• Il blocco appare nelle pagine sbagliate: controllate le condizioni relative alla pagina o al tipo di contenuto.
• Il blocco viene visualizzato due volte: verificate se lo stesso blocco è stato posizionato più volte.
• Il layout è disallineato: verificate la struttura HTML, le dimensioni delle immagini e la compatibilità del tema.
• Le modifiche non sono visibili: svuotate la cache di Drupal e, se necessario, la cache del browser o del server.
• Il blocco manca dopo il cambio di tema: verificate se la regione precedente esiste nel nuovo tema.

Molti problemi di visualizzazione non sono legati direttamente al blocco in sé, ma alle regioni del tema, al CSS, alla cache o alle regole di visibilità. Procedete quindi in modo sistematico, verificando una sola causa alla volta.

Flusso di lavoro raccomandato per i nuovi blocchi

Per ottenere risultati puliti si raccomanda la seguente procedura:

1. Definire lo scopo: cosa deve ottenere il blocco?
2. Scegliere la posizione: quale regione è adatta?
3. Mantenere il contenuto breve: i blocchi dovrebbero integrare, non sostituire intere pagine.
4. Pianificare la visibilità: il blocco deve apparire ovunque o solo in determinate pagine?
5. Verificare il multilinguismo: sono presenti tutte le versioni linguistiche?
6. Testare la visualizzazione mobile: il blocco funziona correttamente su smartphone e tablet?
7. Verificare le prestazioni: vengono caricati immagini, script o contenuti esterni pesanti?
8. Svuotare la cache e controllare il frontend: la modifica è considerata conclusa solo dopo la verifica visiva.

Domande frequenti sui blocchi di Drupal

Posso posizionare lo stesso blocco più volte?

Sì, a seconda del tipo di blocco e della configurazione, Drupal consente di posizionare i blocchi più volte. Ogni posizionamento può avere le proprie impostazioni e regole di visibilità. Questo è utile, ma dovrebbe essere fatto con consapevolezza per evitare la creazione di contenuti duplicati o contraddittori.

Perché non riesco a vedere il mio nuovo blocco?

Verificate prima di tutto se il blocco è stato assegnato a una regione attiva. Successivamente, controllate le regole di visibilità, la lingua, il ruolo utente e la cache. Spesso il blocco è stato creato correttamente, ma viene nascosto da una condizione o non è ancora visibile prima dello svuotamento della cache.

I blocchi sono utili per la SEO?

I blocchi possono supportare la SEO se offrono informazioni aggiuntive rilevanti, link interni chiari e un orientamento utile. Tuttavia, non dovrebbero essere utilizzati per ripetere gli stessi lunghi testi ottimizzati per le parole chiave su ogni pagina.

Cosa è meglio: Layout dei blocchi o Layout Builder?

Il classico layout dei blocchi è ideale per le aree globali del sito web come header, sidebar e footer. Il Layout Builder è invece più orientato a layout individuali per tipi di contenuto o singole pagine. Quale sia la soluzione migliore dipende dalla struttura del vostro sito web Drupal e dai requisiti del vostro progetto.

Conclusione

Il sistema dei blocchi rende Drupal estremamente flessibile. Consente di posizionare contenuti, funzioni ed elementi ricorrenti esattamente nei punti desiderati del vostro sito web. Il sistema diventa particolarmente potente grazie alle regole di visibilità, ai tipi di blocco personalizzati e ai campi strutturati.

Per un sito web Drupal professionale, tuttavia, i blocchi non dovrebbero essere utilizzati in modo indiscriminato. Pianificate attentamente lo scopo, la posizione, la visibilità, la lingua, la sicurezza e le prestazioni. Un layout dei blocchi chiaro migliora la guida dell'utente, supporta la SEO e garantisce che il vostro sito web rimanga gestibile anche con l'aumentare delle dimensioni.

Se desiderate gestire Drupal su un hosting stabile con supporto svizzero, da CURIAWEB troverete le soluzioni adatte per siti web professionali, pagine aziendali e progetti CMS esigenti: Hosting Web cPanel di CURIAWEB.