JavaScript e Google Search, i consigli per un uso SEO ed efficiente
Prosegue il lavoro di Google per cercare di leggere, interpretare e scansionare al meglio la tecnologia JavaScript: l’ultima novità è l’inserimento di una sezione dedicata ai concetti di base della SEO per JavaScript all’interno della Search developer’s guide, che fornisce una descrizione generale del modo in cui il motore di ricerca processa questo particolare linguaggio di programmazione, segnalando anche diverse best practices a cui ispirarsi per migliorare le applicazioni web JavaScript per la Ricerca Google.
L’importanza di JavaScript
Si parte da una considerazione generale: “JavaScript è una parte importante della piattaforma web perché offre molte funzionalità che trasformano il Web in una potente piattaforma applicativa”, e Google sta quindi compiendo numerosi sforzi per ridurre gli errori e migliorare la capacità di interpretazione di queste risorse, a cominciare dal nuovo Googlebot evergreen.
Già nel post sul render budget, riprendendo le parole dell’ex Googler Kazushi Nagayama, abbiamo scoperto che il crawler di Big G destina un tempo delimitato per il rendering a ogni sito, e che dunque è fondamentale per l’indicizzazione presentare al più presto i contenuti per evitare problemi. Ora sono proprio le fonti ufficiali di Mountain View a ribadire questo concetto, suggerendo agli sviluppatori di “rendere le tue applicazioni web basate su JavaScript rilevabili tramite la Ricerca Google” per “trovare nuovi utenti e coinvolgere nuovamente gli utenti esistenti, quando cercano i contenuti offerti dalle tue applicazioni web”.
Consigli SEO per chi usa JavaScript
Nonostante i progressi, e “anche se la Ricerca Google esegue JavaScript con una versione sempre valida di Chromium” resa possibile dal nuovo Googlebot, restano ancora delle aree di criticità e degli elementi che è possibile ottimizzare, come segnalato anche dal citato Nagayama. Il primo passo per migliorare il processo è capire come funziona, e quindi la guida di Google si apre con la spiegazione di come funziona l’elaborazione di JavaScript da parte di Googlebot.
Googlebot e Javascript
Sono tre le fasi principali durante le quali il crawler elabora le applicazioni web JavaScript: scansione, rendering e indicizzazione. Quando Googlebot incontra una pagina la mette in coda per la scansione e il rendering (e, si specifica, non è immediatamente chiaro quando una pagina è in attesa di una fase o dell’altra), e poi recupera un URL dalla coda di scansione tramite una richiesta HTTP.
Il primo passaggio è verificare se il sito consenta la scansione leggendo il file robots.txt: se ci sono dei limiti, il crawler salta la richiesta HTTP per l’URL specifico e salta l’URL nel suo complesso. Poi, Googlebot analizza la risposta per altri URL nell’attributo href dei link HTML e aggiunge questi indirizzi alla coda di scansione (per impedire il rilevamento del link, utilizza il meccanismo nofollow, si legge nel documento ufficiale).
Dal punto di vista tecnico, “la pagina potrebbe rimanere in questa coda per alcuni secondi, ma potrebbe anche restarci più a lungo”, ci viene spiegato. Il lavoro continua: “quando le risorse di Googlebot lo consentono, un Chromium headless esegue il rendering della pagina ed esegue il codice JavaScript”, e successivamente “Googlebot analizza di nuovo l’HTML di cui è stato eseguito il rendering per estrarre i link e aggiunge gli URL individuati alla coda di scansione”. Importante annotazione: Googlebot utilizza l’HTML di cui è stato eseguito il rendering anche per indicizzare la pagina.
Come evitare problemi di scansione e di rendering
È in questa fase che potrebbero sorgere i primi problemi: “la scansione di un URL e l’analisi della risposta HTML funzionano bene per siti web classici o per pagine con rendering lato server, in cui l’HTML nella risposta HTTP include tutti i contenuti”, dicono da Mountain View, mentre alcuni siti JavaScript “potrebbero utilizzare il modello shell dell’app, in cui il codice HTML iniziale non presenta i contenuti effettivi e porta pertanto Googlebot a eseguire JavaScript prima di riuscire a vedere i contenuti effettivi della pagina generati” dal particolare linguaggio di programmazione.
Il consiglio SEO che arriva è molto utile: il rendering lato server o il pre-rendering restano “un’ottima soluzione, perché rendono il tuo sito web più veloce per utenti e crawler e anche perché non tutti i bot possono eseguire JavaScript”.
Ottimizzare le componenti JavaScript per Google
Il documento dedicato agli sviluppatori offre altri spunti interessanti anche su aspetti pratici, sottolineando l’importanza di inserire “titoli univoci e descrittivi e meta descrizioni utili” che possano aiutare “gli utenti a identificare rapidamente il risultato migliore per il loro scopo”, e spiegando come usare “JavaScript per impostare o modificare la meta descrizione e il titolo“. Tornando agli aspetti tecnici, per evitare problemi bisogna “scrivere codice compatibile” con Googlebot, che mantiene “alcune limitazioni relative alle API e alle funzioni JavaScript che supporta”, e il consiglio è “utilizzare la pubblicazione differenziale e i polyfill se rilevi la mancanza di un’API browser di cui hai bisogno per una funzionalità”, dicono da Mountain View.
L’uso dei codici di stato HTTP
È bene sapere inoltre che “Googlebot utilizza i codici di stato HTTP per scoprire se si sono verificati dei problemi durante la scansione della pagina”, e dunque è importante comunicare correttamente al crawler le informazioni attraverso queste risorse: l’esempio fornito è l’impiego di “codici di stato HTTP per comunicare a Googlebot se una pagina è stata spostata su un nuovo URL, in modo che l’indice possa essere aggiornato di conseguenza”.
Il lazy loading per migliorare la gestione delle immagini
L’ultimo punto messo in risalto dal documento è la gestione delle immagini e dei contenuti con caricamento lento: per evitare che “possano incidere negativamente sulla larghezza di banda e sulle prestazioni”, si può usare il lazy loading, “una soluzione efficace che consente di caricare le immagini solo quando l’utente sta per visualizzarle”, scrivono i Googler.
Anche AMP abbraccia Javascript
Ma c’è anche un’altra notizia fresca che riguarda JavaScript, perché da qualche giorno il team di AMP ha lanciato una nuova feature, che consente di aggiungere JavaScript personalizzato alle pagine AMP grazie a uno script pensato per offrire più flessibilità e interattività agli sviluppatori.
L’annuncio è arrivato dal blog ufficiale del progetto sulle pagine accelerate per il mobile, in cui si spiega che questo nuovo componente permette di eseguire JavaScript in un thread di lavoro separato e di aggiungerlo a una pagina AMP mantenendo le sue caratteristiche di velocità. Prima di questo aggiornamento, le pagine AMP erano per lo più statiche, fattore che limitava i suoi usi e costringeva gli editor a cercare un compromesso tra le funzionalità per la velocità e quelle potenzialmente legate alla la visibilità nei risultati di ricerca da mobile.
Uno script per Javascript nelle pagine AMP
Nel post si spiega che questa “era una delle funzionalità più richieste dagli sviluppatori che utilizzano AMP”, e aiuterà a incorporare più funzionalità di interattività nelle pagine accelerate grazie a JavaScript. Per quanto riguarda gli aspetti tecnici, si segnala che nuovo componente amp-script è compatibile con i framework React, Preact, Angular, Vue.js, jQuery e D3.js, che non tutte le API sono supportate nel Web Worker, e che lo script non cambia il contenuto della pagina senza l’interazione dell’utente, quindi non modificherà il contenuto al caricamento della pagina.
