In che modo DCL e FCP influiscono sulla SEO? | Parametri delle prestazioni Web

Che cos'è DCL?

DCL, abbreviazione di DOMContentLoaded, è un'importante metrica di performance delle pagine web. DCL misura il momento in cui un browser è pronto per implementare lo script lato client. In termini più tecnici il DCL è il momento, durante il processo di caricamento di una pagina web, in cui il modello oggetto documento (modello oggetto documento) è stato assemblato dal browser e nessun foglio di stile impedisce l'esecuzione di JavaScript. Per comprendere meglio questi termini, consultare la sezione 'Breve nota sul funzionamento delle pagine web'.

Che cos'è il DOM (Document Object Model)?

DOM è un acronimo che sta per "modello oggetto documento". Il modello oggetto documento è una rappresentazione della struttura di una pagina web, non dissimile dalla bozza di un documento di ricerca, con punti e sottopunti. Un altro modo di pensare al DOM è considerarlo come un albero, che alla radice ha la pagina stessa, che si dirama poi nei diversi elementi HTML.

DOMContentLoaded significa che il browser ha generato questo modello della pagina dal codice HTML che ha ricevuto, e significa anche che è pronto per eseguire script e mostrare contenuti dinamici.

Che cos'è FCP?

First Contentful Paint, o FCP, è un'altra metrica cruciale delle performance. FCP misura il momento in cui viene visualizzato il primo contenuto del modello oggetto documento, ovvero quando viene visualizzato il primo elemento HTML. Può trattarsi di testo, di immagini o qualsiasi elemento che un utente riconoscerà come parte della pagina web. First Contentful Paint è diverso da First Paint (FP), che misura il momento in cui viene eseguito il rendering di un qualsiasi elemento della pagina.

Esistono molti altri parametri prestazionali che misurano la "prima" cosa che si verifica. Ad esempio, il Time to First Byte (TTFB) misura il momento in cui il primo byte proveniente da un server raggiunge il browser. Tuttavia, l'FCP misura il primo momento in cui un utente può vedere che una pagina sta iniziando a caricarsi correttamente. Poiché la percezione dell'utente in merito alle performance è fondamentale per mantenere elevato il livello di engagement su un sito, il Time to First Byte è quasi irrilevante dal punto di vista dell'utente.

In che modo DCL e FCP influiscono sulla SEO?

La velocità di un sito web è una componente fondamentale di una robusta strategia SEO (Search engine optimization). Le prestazioni sono un fattore particolarmente importante per il posizionamento nei risultati dei motori di ricerca di Google. DCL e FCP sono due parametri su cui Google pone particolare enfasi quando valuta le performance, e Google PageSpeed Insights aiuta gli sviluppatori a misurarli. (Sebbene Google non condivida esattamente la misura in cui queste due metriche di performance influiscono sul suo posizionamento nei risultati di ricerca, ne tiene certamente conto.)

Gli sviluppatori possono adottare diverse misure per migliorare questi indicatori di performance. Per migliorarli, due passaggi essenziali sono il caching e l'uso di una CDN.

In che modo Cloudflare migliora DCL e FCP?

La CDN di Cloudflare velocizza notevolmente i siti memorizzando i contenuti in datacenter dislocati in tutto il mondo, in modo che le richieste HTTP ricevano una risposta molto più rapida. Di conseguenza, i browser ricevono l'HTML delle pagine più velocemente, e questo determina un miglioramento di ambedue queste metriche.

Breve nota sul funzionamento delle pagine web

Una pagina web è composta da una combinazione di codice HTML, codice CSS e codice JavaScript. Quando un browser formula la richiesta per una pagina web, il server corrispondente invia un file HTML che contiene, tra le altre cose, un elenco di tutti gli elementi CSS, JavaScript e altre risorse che il browser dovrà poi richiedere separatamente.

• HTML (Hypertext Markup Language) è un codice che fornisce istruzioni ai browser su come visualizzare i contenuti e richiedere ulteriori risorse.
• CSS (Cascading Style Sheets) è un codice che fornisce ulteriori istruzioni su come deve apparire il contenuto HTML e su come le pagine web sono strutturate.
• JavaScript è un linguaggio di programmazione che può prendere del contenuto HTML e modificarlo quando vengono soddisfatte determinate condizioni. Inoltre, JavaScript può essere utilizzato per attività più complesse come il rendering 3D, giochi o altre attività tecnicamente complesse.

Il file HTML contiene il contenuto che appare sulla pagina, le istruzioni su come mostrarlo tale contenuto e quelle per caricare ulteriori contenuti, come le immagini, da altre fonti. Si collega ai file CSS (fogli di stile) e alle librerie JavaScript con ulteriori istruzioni. Il browser poi prende quel codice, lo interpreta e mostra la relativa pagina web.

Nella maggior parte dei browser, è possibile visualizzare il file HTML interpretato dal browser facendo clic con il pulsante destro del mouse su una qualsiasi pagina web e selezionando "Visualizza la pagina sorgente" nel menu a tendina. Il file HTML si aprirà quindi in una nuova scheda. Il testo del file inizierà quasi sempre con '<!DOCTYPE html>'.