Semplificando molto i siti sono formati da 3 elementi principali
- HTML
- CSS
- JAVASCRIPT
Ognuno di questi influisce positivamente o negativamente alla realizzazione del DOM che compone una pagina. Se non sapete cosa è il DOM, vi lascio una rapida guida da leggere assolutamente (se siete un SEO e non conoscere cosa è il DOM avete una grave mancanza da colmare).
Prima di parlare di Screaming Frog vi parlo di una estensione di Chrome che vi aiuta a capire la differenza tra codice sorgente e Rendering. View Rendered Source. Una volta istallata, andando su qualsiasi pagina e cliccando su questa estensione vedrete una cosa del genere
Nella prima colonna vedrete il codice sorgente, nella seconda colonna il rendering e nella terza la differenza tra le due. In verde le parti aggiunte ed in rosso le parti che vengono eliminate nel rendering.
Veniamo adesso a Screaming Frog.
Screaming Frog ha varie opzioni a cui fare attenzione.
La prima ovviamente è l’opzione di rendering delle pagine che si trova in Configuration -> Crawl Config -> Spider -> Rendering
le tre opzioni sono:
- Text Only: SEO Spider eseguirà la scansione ed estrarrà solo il codice HTML grezzo. Ignora lo schema di scansione AJAX e JavaScript lato client.
- Old AJAX Crawling Scheme: da non utilizzare
- JavaScript: SEO Spider eseguirà JavaScript lato client eseguendo il rendering della pagina nel suo browser Chrome headless, eseguendo la scansione ed estraendo dall’HTML renderizzato contenuti e collegamenti. Come Google, scoprirà anche eventuali collegamenti nell’HTML non elaborato.
c’è una ottima guida di screaming frog per capire le impostazioni di Javascript per Screaming Frog
Inoltre c’è una opzione importante che rallenta la scansiona ma che può essere utile per capire cosa vede Screaming Frog senza effettuare il rendering e con il rendering abilitato. Quindi si comporta come il plugin di cui vi ho parlato in apertura.
Questa opzione la trovate in Configuration -> Crawl Config -> Spider -> Extractions ed è la parte di Store HTML e Store Rendered HTML.
una volta abilitata, troverete nella parte bassa di Screaming Frog, in View Source, una schermata molto simile al plugin sopra riportato con in rosso tutto ciò che viene aggiunto o tolto durante la fase di rendering.
questa opzione ha un ulteriore vantaggio. Oltre al semplice HTML si può vedere quali parti di testo vengono aggiunte o tolte selezionando invece che HTML, Visible Content nel menù a tendina in alto a sinistra
