Una guida per principianti al CMS senza testa
Pubblicato: 2022-02-01Headless CMS (Content Management Systems) rimuove il collegamento diretto tra il back-end del database dei contenuti e il modo in cui il contenuto viene offerto agli utenti quando visitano il tuo sito Web o la tua app.
Ciò si confronta con il tradizionale CMS "accoppiato" in cui sia il database che il rendering del contenuto sono controllati dallo stesso CMS.
Sebbene un CMS accoppiato abbia i suoi vantaggi, come un'unica interfaccia per modificare sia il database che il modo in cui appare sullo schermo, il CMS headless è più potente e flessibile.
Ciò è particolarmente vero per siti Web più grandi, database complessi o quando più persone devono lavorare su aspetti diversi dei tuoi contenuti, sito Web/app e SEO in loco.
Cos'è il CMS senza testa?
In un CMS tradizionale, il database dei contenuti back-end e il design del sito Web front-end possono essere modificati all'interno della stessa dashboard CMS, motivo per cui questi sistemi vengono definiti "accoppiati".
Un sistema CMS headless utilizza sistemi separati per il database e la consegna, con un'API (Application Programming Interface) che funge da ponte tra i due.
Alcuni dei CMS headless più comunemente usati includono Ghost, Prismic, Netlify e Contentful e, come i CMS accoppiati, sono stati progettati per funzionare in modo efficiente, offrire funzionalità flessibili e scalare rapidamente quando il database inizia a crescere.
Il CMS headless può essere più costoso, a causa della maggiore complessità, ma offre funzionalità che un sistema accoppiato non può, come la possibilità di offrire contenuti in un modo completamente diverso ai visitatori che accedono al tuo sito da dispositivi diversi.
Ciò a sua volta ha alcune implicazioni positive per le tecniche di ottimizzazione dei motori di ricerca (SEO) come la progettazione di siti Web reattivi, poiché i tuoi contenuti possono essere serviti in un modo molto più reattivo, dipendente dalla piattaforma e veramente ottimizzato per i dispositivi mobili.
Ulteriori vantaggi del CMS senza testa
Diamo un'occhiata ad alcuni dei vantaggi specifici del CMS headless, che stanno aiutando a guidare l'enorme popolarità e la rapida adozione di questo approccio sui siti Web di tutto il mondo:
Contenuti personalizzati
Un controllo più stretto sui tuoi contenuti e sul modo in cui vengono visualizzati significa che puoi personalizzare le tue pagine in misura molto maggiore. Che tu lo faccia per gruppi di utenti specifici o per il tuo pubblico nel suo insieme, questo ti offre ancora più modi per distinguerti dalla concorrenza.
Caricamento più veloce
L'utilizzo di un'API e di un frontend appropriati per il dispositivo ottimizza le velocità di caricamento su diversi dispositivi, inclusi quelli che accedono al tuo sito tramite una connessione dati mobile. Ciò supporta anche qualsiasi azione che stai intraprendendo nelle campagne SEO per migliorare le prestazioni dei tuoi Core Web Vitals.
Flessibilità a prova di futuro
La possibilità di installare API aggiuntive significa che il tuo database può essere connesso a nuovi frontend in futuro. Ciò può consentire di diversificare, ad esempio, da un sito Web per visitatori desktop e mobili, per servire anche schermate informative in negozio e tecnologia indossabile.
In sintesi, un CMS headless è l'ideale quando hai esigenze di frontend complesse, ma desideri semplificare la modifica e la manutenzione dei tuoi contenuti effettivi, con modifiche e aggiornamenti che si riflettono immediatamente su tutte le tue diverse piattaforme.
Come pianificare un CMS senza testa
La modellazione dei contenuti è la fase di pianificazione cruciale prima di implementare un nuovo CMS headless. È simile al modo in cui pianifichi la gerarchia delle cartelle, la struttura dell'URL e la mappa del sito di un sito Web, tranne che in questo caso lavorerai con i tipi di contenuto, anziché con le singole pagine.
Cosa sono i tipi di contenuto?
I vari tipi di contenuto che definisci contengono campi che estraggono informazioni dal tuo database. Potrebbero trattarsi di metadati SEO e se utilizzi un CMS tradizionale accoppiato con un plug-in SEO come Yoast, è probabile che tu abbia visto e compilato campi di metadati in passato.
Nelle tue pagine di contenuto principali, potresti avere campi per lo slug URL, nonché una o più sezioni di contenuto visibile da visualizzare nella pagina.
Puoi anche definire i tipi di contenuto per le risorse multimediali, assegnando ai tuoi file un nome, una descrizione che può essere vista solo internamente e una posizione in cui è possibile accedere al file.
Come funzionano i tipi di contenuto?
Una volta definiti tutti i tipi di contenuto richiesti, è stato creato un metodo modulare "building block" mediante il quale le API possono estrarre informazioni dal database e metterle insieme per piattaforme diverse.
Le API possono richiedere dati da diversi tipi di contenuto e costruirli in modi completamente unici per eseguire il rendering delle pagine in un modo specifico della piattaforma.
Se hai bisogno di apportare modifiche in futuro, ad esempio per aggiungere un nuovo meta tag SEO, puoi aggiornare il tipo di contenuto per creare il campo necessario in ogni elemento rilevante nel tuo database.
Come definire i requisiti SEO
È buona norma definire i requisiti SEO per CMS headless prima di approfondire lo sviluppo, in modo che i tuoi sviluppatori sappiano cosa devono implementare.
Alcuni elementi da considerare includono:
- Slug URL (che può essere inserito in una parola chiave per pagina)
- Metadati (ad es. tag "titolo", "descrizione" e "parole chiave")
- Tag canonico (per evitare sanzioni sui contenuti duplicati)
- Meta tag robots (per impedire la scansione indesiderata delle pagine)
Puoi anche creare campi per alcuni dei metodi più moderni e verifiche specifiche del servizio che aiutano a supportare il tuo SEO:
- Microdati, microformati e markup Schema.org
- Tag di verifica per Google Analytics, Search Console e Bing Webmaster Tools
- Markup per anteprime sui social media (ad es. Twitter Card)
Ancora una volta, tutti questi campi influenzano il modo in cui i tuoi contenuti vengono trovati e come vengono visualizzati su piattaforme diverse, in questo caso siti Web e app di terze parti, quindi includere questi campi ti aiuta a mantenere il controllo su come le persone vedono i tuoi contenuti, indipendentemente da dove li trovano esso.
Di quanti tipi di contenuto ho bisogno?
Decidere quanti tipi di contenuto utilizzare è una delle grandi domande del passaggio a CMS senza testa e la risposta è che dipende da ciò che stai cercando di ottenere.
Per le migliori prestazioni SEO, dovresti definire i campi che coprono ogni singolo parametro. Ad esempio, potresti avere un campo per il meta tag robots follow/nofollow e uno separato per robots index/noindex.
Limiti e requisiti
CMS senza testa come Contentful ti consente anche di inserire limiti di conteggio dei caratteri sui campi, in modo da poter mantenere i tag del titolo e altri metadati entro un certo numero di caratteri.
Infine, puoi rendere i campi obbligatori e univoci, quindi se i metadati vengono replicati da un'altra pagina o mancano completamente, l'editor riceverà un messaggio di errore e potrà apportare le correzioni necessarie.
Se lo fai utilizzando più campi all'interno di un singolo tipo di contenuto o se utilizzi tipi di contenuto separati per una flessibilità ancora maggiore dal lato del rendering, dipende in parte dalle capacità che i tuoi dati devono supportare e in parte da un caso di preferenza personale.
Mettendolo insieme
Puoi pensare che sia come costruire un pozzo dei desideri. Più grandi sono i mattoni, più veloce e facile sarà la costruzione. Ma più piccoli sono i mattoni, più perfetta sarà la forma circolare.
Il "numero giusto" di tipi di contenuto dovrebbe essere un compromesso di mezzo che funziona meglio per te, in modo che tu possa costruire il sito web che desideri, senza sentirti come se stessi modificando ogni paragrafo, intestazione e meta tag individualmente.
E il front-end?
Proprio come ci sono diversi backend CMS headless comuni nell'uso popolare, ci sono anche alcuni ottimi framework frontend tra cui scegliere.
Due dei migliori sono React e Vue, e questi framework moderni sono stati, ancora una volta, progettati per funzionare in modo efficiente, caricare rapidamente i contenuti e offrire la migliore esperienza utente ai visitatori del tuo sito web.
Ricordarsi di tenere conto delle considerazioni tecniche. Ad esempio, il pre-rendering dei tuoi contenuti può garantire che siano completamente visibili ai crawler dei motori di ricerca, che potrebbero non essere in grado di "vedere" i contenuti se vengono visualizzati sul lato client utilizzando JavaScript.
Considerazioni finali
Una volta implementato il tuo CMS headless, assicurati di farlo controllare correttamente da sviluppatori web affidabili e in particolare da esperti SEO, per assicurarti di non aver perso un tecnicismo che potrebbe influenzare le tue classifiche di ricerca.
Un esempio di ciò che è abbastanza comune con le API è la proliferazione di URL dinamici per cose come le categorie di e-commerce, le diverse dimensioni e colori di un prodotto e l'impaginazione dei risultati.
Rendendo tutti questi URL visibili ai robot dei motori di ricerca, rischi di consumare il loro budget di scansione prima che trovino il contenuto URL statico più prezioso sul tuo sito.
[Case Study] Gestione della scansione dei bot di Google
Leggi il caso di studioIncoraggia i tuoi sviluppatori a implementare URL statici ove possibile e utilizza i meta tag robots implementati nel tuo CMS headless per bloccare l'accesso del crawler a pagine dinamiche indesiderate.
Guardando avanti
Tenendo conto di tutto quanto sopra, puoi creare database di siti Web complessi e completi che possono servire siti desktop, siti mobili e app, altoparlanti intelligenti, robot di chat AI, schermate informative in negozio e molti, molti altri tipi di dispositivi tramite il Internet delle cose.
Il lavoro di sviluppo futuro può produrre aggiornamenti istantanei sui diversi dispositivi e piattaforme per cui pubblichi i dati, consentendo un ritorno sull'investimento più rapido e positivo dalle tue campagne SEO e di contenuti.
E proprio come la separazione tra contenuto e design fornita con Cascading Style Sheets (CSS) nei primi anni 2000, il CMS headless ti offre un modo più granulare per definire, modificare e renderizzare i tuoi contenuti, aiutandoti a raggiungere i tuoi obiettivi SEO ed e-commerce in un modo più gestito man mano che costruisci il tuo database nei mesi e negli anni a venire.