Visualizza rendering sorgente| Chrome Web Store (Extension)

Descrizione Visualizza sorgente

Mentre molte persone pensano che visualizzare l’HTML renderizzato sia una pratica meno corretta, Google fornisce invece consigli su come implementarlo.

In effetti, lo strumento Visualizza sorgente renderizzata è una buona opzione quando si tratta di visualizzare le sorgenti renderizzate per correggere determinati elementi del tuo contenuto.

Questa è un’estensione facile da usare che puoi scaricare dal Chrome Store.

Vediamo in questa breve descrizione come lo strumento può esserti utile.

Definizione Visualizza sorgente renderizzata

Visualizza sorgente renderizzata è uno strumento essenziale per gli sviluppatori Web che utilizzano framework JavaScript.

Fondamentalmente aiuta i SEO a capire come i motori di ricerca visualizzano le pagine del loro sito web.

Lo strumento può anche leggere il codice HTML nella sua versione grezza e anche quando viene modificato.

Puoi scoprire la differenza tra le versioni grezze e le versioni renderizzate leggendo i codici riga per riga. Noterai che JavaScript di solito modifica le pagine web al momento del rendering. 

Qual è l’uso di Visualizza sorgente renderizzata?

Visualizza renderizzato Source ti aiuta:

• controlla i tag del titolo

Ovviamente,il tuo sito non ha  tag del titolo, semplicemente non verrà visualizzato sui motori di ricerca. 

In un documento HTML, puoi trovare il tag del titolo nella sezione dell’intestazione. 

Il titolo è solitamente quello che il lettore vede per primo nei motori di ricerca e quando fa clic su di esso, lo porta alla pagina web del contenuto.

Ad esempio, quando digiti Google ”SEOptimer”, puoi vedere che il primo risultato era intitolato ”Analizza siti web con il nostro strumento gratuito audit e report ”.

Quando vai su Visualizza sorgente renderizzata della pagina, puoi vedere il title tag è lì come codice.

Visualizza sorgente renderizzata consente quindi di verificare se il tag del titolo appare correttamente e nella sezione Head della pagina.

• Controllare le meta descrizioni

Un altro fattore importante che puoi monitorare anche nella sezione principale del codice HTML sono le meta descrizioni.

Come il titolo, puoi leggere solo la meta descrizione completa in Visualizza sorgente renderizzata molto raramente.

La meta descrizione di solito può essere letta nello strumento come codice, se conosci un po’ di codifica.

In effetti, unameta descrizione è un breve riassunto che accompagna i tag del titolo nei risultati dei motori di ricerca. 

Questo è solitamente il fattore decisivo utilizzato dagli utenti per determinare se il tuo sito darà loro il valore che stanno cercando. È quindi importante controllare ogni pagina. 

Ovviamente, dovresti notare che il tag title e la meta description dovrebbero trovarsi nella sezione “head” del tuo codice HTML. 

Inoltre, indipendentemente dal fatto che utilizzi un sistema di gestione dei contenuti (CMS) o che codifichi il tuo sito Web, si consiglia vivamente di evitare tag del titolo duplicati e meta descrizioni sul sito. 

Se stai utilizzando WordPress, ciò potrebbe essere dovuto all’installazione di due diversi plugin che gestiscono i metadati.

Con Visualizza sorgente renderizzata, puoi trovarli e risolverli.

• Controlla le migliori pratiche per i titoli

Quello che devi ricercare qui è in quale formato sono costruiti i titoli delle pagine.

In effetti, l’utilizzo di tag h1 è una delle tattiche SEO essenziali sulla pagina. Ma l’uso di diversi tag h1 può essere interpretato dai motori di ricerca come “ottimizzazione eccessiva”. 

Che sicuramente non è un buon segnale per il tuo sito nei motori di ricerca.

Idealmente, i tag h1 sono pensati per essere utilizzati come titoli più grandi che comunicano lo scopo principale di una pagina.

Alcuni CMS o temi che hai installato, come il sito WordPress, possono avere più h1, specialmente nelle sezioni del blog o dei post in cui il titolo di ogni articolo può essere un h1 anziché un h2. 

I tag H2 e H3 dovrebbero essere utilizzati per suddividere il contenuto per renderlo più facile da consumare per il lettore. Dovrebbero utilizzare parole chiave secondarie per supportare le parole chiave principali. 

Visualizza sorgente renderizzata consente quindi di verificare se sono formattati correttamente.

• Controlla gli script 

Sebbene gli script siano ottimi per aggiungere funzionalità al tuo sito, se ce ne sono troppi, possono far sì che le pagine del tuo sito vengano caricate molto più a lungo. 

Ricorda che almeno la metà degli utenti di Internet si aspetta che un sito venga caricato in soli 2 secondi.

Gli script dovrebbero trovarsi nella parte inferiore della pagina, di solito appena prima di chiudere il tag ”body” in HTML. 

Una buona pratica consiste nell’avere gli script in un file Javascript, denotato dall’estensione del file .js, che è collegato all’HTML in fondo alla pagina.

Dovresti anche verificare che qualsiasi codice di monitoraggio che hai installato, come il codice di monitoraggio di Google Analytics di Facebook, sia installato correttamente. 

Un errore o un codice mancante nello script potrebbe impedire raccolta la corretta

Sia che tu stia utilizzando una piattaforma CMS o desideri sapere se il tuo sito è stato violato, puoi visualizzare tutti gli script per verificare se li hai autorizzati o meno. 

Senza visualizzare il codice sorgente della tua pagina, non hai piena visibilità di ciò che è stato installato.

Si può quindi notare che Visualizza sorgente renderizzata sarebbe una buona opzione per te quando desideri visualizzare la sorgente renderizzata di una pagina.

Devi solo installare l’estensione e rimanere deluso quando apri la pagina interessata e ti presenterà tutto il contenuto sotto forma di codice.