Trascrizione
Eccoci qua con il nuovo corso targato Studio SAMU Pro. Questa volta parliamo di tool gratuiti per analisi SEO o comunque per l’utilizzo che può fare una persona per ottimizzare al meglio il suo sito web o una ottimizzazione che può essere on-site o off-site o legata anche alle web performance della pagina è un elemento che in questo periodo è molto importante visto le comunicazioni che ci ha dato Google sui segnali web vitali quindi vedremo nel corso della presentazione diversi strumenti che nelle attività quotidiane possono aiutarvi dandovi degli input da analizzare e input su cui poi dopo effettuare delle correzioni migliori al sito. Dopo questa breve introduzione mi presento per chi non conosce sono Claudio Fiorentino sul web conosciuto come Don Claudissimo dal 2011 quindi da dieci anni sono in quest’ambiente del web marketing dove ho ricoperto ruoli di SEO manager in diverse realtà importanti nel settore delle web agency fino ad arrivare ad oggi nella costituzione di Archetipo che è una nuova web agency che basa la sua esperienza traendola dai suoi soci e aiutanti del team insomma le persone del team preparate che ogni giorno affrontano diverse problematiche nei confronti dei clienti che gestiamo. Partiamo da un primo tool che è Exometer Exometer un po’ come molti tool che vedremo ha sia la versione gratuita che la versione a pagamento la versione a pagamento per tutti i tool permettono di avere funzionalità maggiori ma anche la versione free e per questo motivo ve la riporto ha dati interessanti nel modo in cui andiamo a inserire il nostro sito da monitorare. Questa è la prima schermata perché ve la riporto? Di fatto vi dà un’idea dei costi del tool quindi se avete più di un sito web da gestire potreste valutare anche di fare un investimento sulla versione popolare perché sicuramente nell’arco dell’anno vi ripaga del costo con le informazioni che estrai e le indicazioni che vi fornisce. Nel momento in cui vi registrate in forma gratuita come dicevo prima potete inserire un solo sito web e in alto a sinistra c’è l’indicazione di come andare ad aggiungere la vostra proprietà è molto semplice, i tool non hanno nulla di complesso quindi nella parte di inserimento avrete il bottone di aggiunta della web properties dove andrete ad inserire l’indirizzo completo del protocollo HTTP e HTTPS se provate ad aggiungere una seconda properties vi dice di fare l’upgrade del vostro piano ma la prima è utilizzabile in forma gratuita il tool presenta sulla sinistra diverse voci di menu che si popolano con la loro numerosità nel momento in cui viene fatta l’analisi di un sito web come vedete abbraccia diversi aspetti non sono solo aspetti tecnici ma vi dà anche informazioni relative alla sicurezza del sito web e vi dà informazioni sulla disponibilità del sito nel senso se è online o offline quindi fa un monitoraggio attraverso un ping quindi l’up e il down del sito partiamo dalla prima voce le vedremo tutte quanti in maniera di darvi modo di capire al meglio le informazioni che vengono in esso riportate abbiamo la dashboard, la dashboard iniziale ha dei grafici interessanti di varie percentuali in base ai problemi riscontrati quindi quella che voi vedete tipo 64, 98 è riferito alla parte inverte quindi quanti dei check sono passati in modo positivo mentre invece l’arancione sta a indicare dei warning e il rosso degli errori poi sulla destra vedete un HM sta a indicare un valore di Dixometer quindi lui dice che il valore in questo caso di 3.56 è distribuito maggiormente per la parte di sicurezza, di health, di disponibilità del sito quella dove pecca un pochettino è quella di performance come vedete il grafico tende più al centro quindi vuol dire che è un punteggio minore rispetto agli altri quindi è uno di quegli aspetti dove probabilmente dovremmo andare in un attimino a lavorare maggiormente ritornando alla lista delle voci di menù quella successiva è quella dei task o delle problematiche e lì vi porta appunto la numerica di quelle riscontrate dove sono appunto la somma degli errori e dei warning lui li divide perché 1394 è relativo al totale del sito però vedete ci sono due riferite alle performance, tre alle user experience e via dicendo quella che ne ha di più è la parte SEO ma vedremo anche più avanti ci sono delle tipologie di errori come questi qui sulla destra che possono essere ripetuti su determinate pagine quindi quel valore si moltiplica per due nello specifico parliamo di gli open graph che spesso viaggiano di pari passo per twitter e facebook dove ci sono le twitter card o gli elementi appunto gli open graph per la condivisione di contenuti soprattutto per le aree editoriali ma anche per la parte istituzionale, le pagine più importanti del sito lì che cosa accade? se nel caso in cui non viene rilevata l’immagine di evidenza è normale che sia un errore doppio perché sia gli open graph di facebook e quelli di twitter rileveranno questa mancazza e quindi andranno a segnalarti il problema sulla disponibilità del sito il tool ha una doppia visualizzazione c’è l’andamento nel tempo della media di risposta del sito al momento in cui c’è stato il ping per vedere se era uptime o downtime e la sinistra è il momento in cui il sito era down in alto c’è un andamento più generale dove vedete la parte verde che indica la giornata e in alcune giornate ci sono dei piccoli momenti in cui il sito è stato rilevato non accessibile potrebbe essere un momento di mancata connessione per forza del sito era down effettivamente però avere questi sistemi vi aiuta a monitorare il sito quindi soprattutto se questo ha dei scopi di monetizzazione e quindi è importante che sia sempre attivo e che gli utenti possano navigarlo nel caso in cui c’è un periodo prolungato di down si può valutare di contattare il proprio host per chiedere di risolvere la problematica questo è un esempio del dettaglio del monitor la creazione della tipologia di monitor l’advanced standard uptime monitor è quello classico che anche nelle versioni gratuita il tool vi mette a disposizione c’è l’advanced monitor dove potete integrare nel tool una parola chiave che potete monitorare l’advanced è legato solo alla parte a pagamento su alcune non è possibile fare delle modifiche la location lui riporta US perché il tool è da lì che genera le richieste infatti le richieste spesso vengono anche intercettate su analytics come referral quindi se avete intenzione di utilizzare il tool valutate la possibilità di implementare un filtro per questo tipo di referral dove in questo caso è un referral positivo in altri casi potreste avere dei referral a spam che vi vanno a sporcare i dati di analytics quindi è buona norma gestirli in maniera puntuale e filtrarli per avere appunto le statistiche pulite e vicine a quella che poi è la realtà effettivamente della navigazione degli utenti e non inficiate dal referral non desiderati che puntualmente troverete nelle vostre analytics perché nel tempo ne escono sempre di nuovi in passato c’era una persona online che aveva creato un filtro molto ampio attraverso delle espressioni regolari che ciclicamente andava ad aggiornare adesso non ricordo il nome però devo dirvi che è stata una buona base di partenza ad oggi non ne faccio più un grande uso di quello lì perché effettivamente era legato soprattutto a referral di stranieri legati al mercato USA ad oggi vediamo spesso su siti italiani che vengono colpiti da altre tipologie di referral a spam ecco la parte di performance che prima vedevamo nel grafico a stella essere un po’ meno performante come tutto e effettivamente leggendo a colpo d’occhio alcuni dati notiamo che c’è molto margine di miglioramento ad esempio la pagina pesa oltre 6 mega e potrebbe essere un problema per chi ha una navigazione o una connessione meno performante per riuscire a scaricare 6 mega soprattutto per una visualizzazione da mobile prima di vedersi comparire al video quello che è l’interesse della pagina ci sono altri indicatori legati a quelli delle performance che sono ad esempio il blocking time che è legato spesso al time to fix byte quindi quant’è il tempo di risposta del server nell’erogare la prima risorsa utile del sito in questo caso è un’attività da demandare all’hosting perché è qualcosa legato proprio al server qui spesso ci troviamo di fonte a siti web che condividono lo stesso server quindi potrebbe essere un po’ più problematico fare un tipo di ottimizzazione quindi in base alla tipologia di progetto è bene ragionare e valutare fare un investimento su un hosting un po’ più performante e quindi andare a migliorare le metriche di speed del sito sotto l’ultima voce è legata alle performance parla appunto degli asset ci dà le informazioni sui numeri di risorse che vengono chiamate nella pagina in questo caso le dimensioni per lui rilevate sono buone per CSS, per JavaScript sicuramente in questo caso una verifica numerica di peso e non di blocco ad esempio ci sono di JavaScript e seppur di peso ridotto possono ralentare il scaricamento della pagina si può andare ulteriormente nel dettaglio dell’asset ci dice da quanto è composta la pagina quindi di risorse ci dà anche la numerosità che ha rilevato su quella pagina e cliccando su più accanto alla scritta image JavaScript, CSS ci riporta proprio i nomi dei file quindi come vedete fa proprio il drill down delle informazioni arrivando fino al singolo elemento passando avanti noi abbiamo la parte di user experience che a sua volta è divisa in alcuni aspetti questo nello specifico è quello legato alla grammatica lui riesce a capire il tipo di sito quindi la lingua che parla il sito e ci può indicare degli errori grammaticali li ho messi lì sulla destra ma banalmente lui ha individuato essendo un testo in italiano delle parole come errori ma semplicemente perché sono delle parole in lingua quindi c’è family, location, low cost però nei vari check questo è un caso implarante dove non è un errore però può beccarvi anche degli errori diciamo di distrazioni in alto vi da una numerosità delle parole contenute nella pagina che lui ha analizzato informazioni che tanti altri tool ci forniscono qui è un concentrato di informazioni quindi ce la prendiamo la possiamo leggere, interpretare e valutiamo entramente azioni correttive sul mobile friendly sul sito che ho individuato in questo caso non c’erano delle problematiche ho fatto fatica a trovarne su altri perché fortunatamente è qualcosa che ad oggi nel 2011 non possiamo farne a meno non è possibile che il sito non abbia ancora problemi sul mobile deve essere sicuramente ottimizzato al meglio deve essere responsive vedete che ad oggi è un numero nettamente maggiore rispetto agli utenti desktop che accedono al sito c’è la verifica del device il tool ExoMeter dà diverso spazio alla parte di mobile per l’importanza che dicevo anzi ci sono informazioni sulle varie risoluzioni e ci dice che per alcune risoluzioni ha riscontrato dei problemi per tutte le voci del tool noi possiamo andare arrivare a singole informazioni in questo caso le due dimensioni sono gli elementi di warning fortunatamente siamo ancora a livello di warning e non di errore dove è verde c’è il bottone access non dobbiamo fare nulla in altri possiamo andare a cliccare sempre sul più e vedere il dettaglio questo è un esempio di due warning che avevamo nella slide precedente quelli che ci riporta quelle per lui sono ad esempio le immagini che non hanno l’indicazione della larghezza allo stesso tempo è facile che manchi anche l’indicazione dell’altezza quindi ci sono informazioni importanti che aiutano il browser a occupare all’interno della pagina web uno spazio predefinito perché sa che in quella posizione andrà un’immagine di quelle dimensioni come vedremo più avanti è importante fornire le immagini della dimensione corretta e evitare che queste vengano croppate quindi ridimensionate attraverso l’html il warning in alto dei DOM element ci dà informazioni legate al numero che secondo lui non dovrebbe essere superato come elementi che è di 700 nel nostro caso ne rileva 985 è un warning così come quello delle immagini e non un errore alcune volte non è detto che si riesca a ridurre il numero degli elementi in DOM sotto quella soglia che lui indica poi come tutte le soglie sono scritte sulla pietra può darsi che se utilizziamo un tool diverso ha impostato al suo interno una numerosità diversa non sarà sicuramente molto lontana da questa queste numerosità spesso sono date dall’esperienza di chi ha fatto il tool che valuta che è il numero massimo dove c’è un giusto compromesso di performance quindi non si carica il server o il browser di erogare o di ricevere molte più richieste di quanto poi ne servono effettivamente per la creazione della pagina, quindi del layout Sulla parte di salute di Ailt abbiamo sempre queste inconcine in alto a sinistra della pagina dove la pagina triste che ha trovato dei piccoli errori in questo caso su tutte le url diciamo l’oggetto di analisi parliamo di 3.000 url ce ne sono 64 che hanno degli errori 24 hanno dei worm ci da anche indicazioni della differenza delle url se sono pagine interne o fanno riferimento a pagine esterne anche qua in alto a destra c’è il rimando ai dettagli che sono molto simili nella grafica che abbiamo visto in precedenza quindi abbiamo sempre a sinistra delle grafiche a torta che riportano la distribuzione degli errori, dei worm o delle pagine che hanno passato il check e sulla destra l’overview in questo caso degli status code quindi ci dice che 2.912 pagine sono state derivate con lo status code 200 invece ce ne sono diverse appunto i worm e 64 che hanno errori 404 sullo status code il tool per eccellenza per vedere queste cose è Streamy Frog nel momento in cui fa un’analisi riporta il dato al pari anche Exometer fa una scansione del sito web e rileva attraverso quelli che sono i link interni riesce a navigare le varie pagine e a riportarci a video lo status code se andiamo nel dettaglio in questo caso degli errori 404 lui ci riporta la urla quella a destra che riscontra questo status code sulla sinistra abbiamo quel detected on se noi ci posizioniamo sopra col mouse ci dà anche qual è la pagina sorgente e quindi la pagina dove dover andare a fare una modifica per evitare che si linki internamente una pagina che invece è in errore questa pagina in errore l’ottimizzazione dei contenuti andando a ripulire questi link sporchi o eventualmente non è stata gestita la redirezione 301 dal vecchio contenuto al nuovo ma anche questa attività deve essere eseguita da una pulizia dei link interni per evitare che il motore debba seguire quel 301 quando invece possiamo editare il contenuto e inserire correttamente la target tool verso la pagina di destinazione corretta che è al status code 200 e non appunto far scattare la redirezione spesso implementata tramite plugin o tramite htaccess che è preferibile perché è un file più facile da mantenere rispetto a quello che è il plugin che nel tempo potrebbe non essere migrabile in un’altra piattaforma o andare in conflitto eventualmente con l’htaccess se c’è una gestione mista delle redirezioni Nella parte di Hert abbiamo gli errori sottovalutati il V3C ha un proprio tool dedicato all’analisi della pagina e Xometer attinge a quelle informazioni e ce le riporta a video Attenzione, qui alcune volte ci sono delle problematiche segnalate non sempre che possono essere corrette o comunque in alcuni casi c’è bisogno di uno sviluppatore che vi dia supporto per fare questo tipo di correzioni quindi questa è una delle poche aree del tool dove avete meno margine di manovra in autonomia però può anche in questo caso segnalarvi delle cose interessanti questo sempre per avere un codice html il più pulito possibile più fluido e quindi di conseguenza più leggibile e scansionabile da qualsiasi strumento c’è crawler del modo di ricerca che sia o tool di analisi come Xometer di cui stiamo parlando Ultima parte del Hert sono eventualmente gli errori JavaScript in questo caso non è a riscontrato quindi la faccina è sorridente nel caso in cui ci siano degli errori probabilmente sono degli errori che vanno anche a influenzare quella che è la funzionalità del sito che spesso su JavaScript hanno questa come funzione quindi in caso di presenza di errore probabilmente c’è qualcosa sul sito che non funziona e quindi l’utente non riesce a usufruire al meglio del sito web Arriviamo alla parte SEO la prima informazione che ci dà è quella su metatag quindi ci informa che sulle pagine scansionate c’è 469 291 risultano prive della descrizione 82 hanno titoli lunghi 6 descrizioni lunghe poi ci sono titoli e descrizioni duplicate una situazione classica che possiamo riscontrare su un sito web perché tipo classica? perché ad esempio le descrizioni mancanti spesso fanno riferimento a quelle che possono essere le paginazioni le paginazioni delle categorie o dei tag per la loro natura all’interno del CMS come WordPress se non andiamo ad inserire manualmente nella parte dedicata la metadescription non riporta nulla però qui si crea un possibile problema poi WordPress attraverso alcuni chiamiamoli tag proprietari attraverso l’utilizzo di variabili percentuale, percentuale page percentuale, percentuale noi possiamo rendere univo tutte le varie descrizioni perché lui aggancerà nel punto preciso dove noi inseriamo questa variabile di sistema il numero di pagina relativo a quella paginazione e ci da anche indicazioni del numero di pagine totale quindi pagina 2 di 9 questo elemento è quello che poi fa sì che ogni metadescription sia univoca e quindi non viene riferita da tutto come X o Y sicuramente vista la tipologia di pagina non sono delle description che hanno scopi diciamo di attrarre gli utenti al sito quindi attraverso delle CTA è bene però andare anche lì a sistemare sarebbe bello vedere tutti i zeri e qui la faccetta che è verde che sorride diciamo che tutti i metadati non rispondono a nessun tipo di problema io sono sempre per sistemare il sito su tutte queste faccettature tecniche o meno tecniche e quindi presentarsi al meglio ai motori di ricerca in primis che nel tempo sicuramente vi premerianno poi c’è la grande parte del website la struttura dei contenuti l’interna linking quella ha la sua grande importanza e grande pietà però di base per me un sito web deve rispondere al meglio così come ad esempio non ci devono essere risorse che non abbiano lo status code diverso da 200 salvo rari casi ad esempio se abbiamo all’interno del nostro sito web un bit di tracciamento download, un PDF lì in quel caso il 301 per forza non possiamo fare diversamente sempre il drill down è dato anche per la parte dei metatag lui ci dà il dettaglio e ci fornisce in quel caso sulla sinistra vedete un livello di rigidità per quella riscontrata quindi laddove la numerosità è maggiore c’è questa linea di aspetto grafico su cui soffermarsi è interessante andare a premere il più accanto al problema segnalato e quindi ricevere dettagli su dove andare a effettuare le correzioni del caso, potrebbero essere descrizioni duplicate titoli duplicati e via ecco qua gli open graph che citavo all’inizio che c’era un’immagine sulla destra e qui è confermato il fatto che spesso questi due errori vanno a braccetto è confermato dalla numerosità che vedete su 469 pagine 463 hanno un warning per gli open graph legati a facebook 463 hanno problemi legati alle twitter cat gli open graph legati a twitter come dicevo all’inizio banalmente potrebbe essere la mancanza di un’immagine di evidenza che è importante in fase di condivisione quindi se il sistema non riporta l’open graph dedicato quindi dell’immagine ecco lì che l’errore è duplicato per queste due tipologie lì appunto basterà risolverla al monte quindi dar modo agli open graph di recuperare questa informazione ecco lì che in un colpo solo risolviamo due warning questo è l’esempio di cosa lui ha riscontrato come missing qui c’è anche molto di più c’è solo l’immagine come non c’è anche eventualmente la tipologia dell’immagine le dimensioni dell’immagine i dati di open graph che aiutano poi dopo il social di riferimento a fare una condivisione al meglio quindi non è detto che manchi appunto solo l’immagine possono mancare altre però altre non è detto che poi siano obbligatorie lì poi sta a voi approfondire l’errore segnato e capire come risolverlo per gestire al meglio queste condivisioni social Puzzle Checker molto semplicemente ci dà indicazione se è stata inserita il canonical se è stata inserita la favicon diciamo più che per aspetti SEO e aspetti estetici ultimamente Google ha anche iniziato a inserirle nelle sample favicon sta facendo probabilmente dei test lo aveva fatto anni fa io sulla favicon sono particolarmente attenzionato perché secondo me è un elemento distintivo del sito web quindi è un po’ legato al brand, al logo dello stesso quindi vedere dei siti web che non riportano la favicon e ad oggi i vari browser la sostituiscono con un globo grigietto secondo me è mancanza di attenzione in generale non solo di attivizzazione SEO perché ripeto, essendo un’immaginetta legata al brand basta poco implementarla e richiamarla all’interno del codice web sui social link lì in questo caso il sito li rileva quindi riporta lo spunto ok ma potrebbe esserci casi in cui non esistono dei social quindi lì c’è un errore però non è un errore perché è proprio una scelta editoriale di non avere nessun social sul robot.txt la spunta deve essere verde perché noi dobbiamo avere un robot.txt anche se presenta direttive minime è bene averlo soprattutto perché ci possono essere casi in cui viene gestito virtualmente da un csm invece noi vogliamo avere il file fisico perché nel file robot.txt possiamo andare a indicare eventuali path da bloccare in fase di scansione e possiamo andare a indicare la path della sitemap in modo che essendo il robot.txt il primo file richiesto dai crawler del modo di ricerca gli diamo indicazioni di dove trovare la sitemap che contiene tutte le ore del sito quindi lo aiutiamo a scansionare le nostre pagine dandogli già quello che è un indice del sito Passiamo alla parte di sicurezza si parte da cose anche abbastanza semplici ad esempio in questo caso del certificato SSL visto che da qualche anno i siti stanno tutti migrando al protocollo HTTPS un protocollo sicuro dettato di passaggio delle informazioni online abbiamo tutti poi un certificato SSL agganciato può che sia un Lexintrip gratuito o di livelli più alti per siti web immaginati come una banca qui vi da semplicemente una data di scadenza del certificato spesso viaggia di vari passo con la scadenza del dominio salvo appunto se ne è stata fatta una creazione in un secondo momento o un upgrade dello stesso appunto per un livello maggiore abbiamo la security leaders questo è sicuramente un aspetto un po’ più importante infatti iniziate a vedere che ci sono un po’ più di rossi rispetto ai warning security leaders dove possiamo agire spesso noi a livello di ad esempio di codice HT access per andare a limitare la lettura di determinate informazioni ad esempio le direttori se noi proviamo ad aprire una direttori questa non deve essere non deve presentare sul browser il listing del risorso al suo interno ma deve presentare una pagina diciamo di errore 404, 403 adesso non so qual è il codice di risposta esatto e i security leaders ne troviamo veramente tanti ci sono legati ai cookie alla cache quindi informazioni di di far storicizzare all’interno del browser alcune risorse in modo che se l’utente nel momento in cui riaccede al sito non deve fare il download ma le troverà già nella cache del browser qui ne sono nove alcuni ripeto possono essere implementati in autonomia altri un po’ più complessi che vanno analizzati visti se effettivamente necessitano di correzione e se sì se va scavata questa correzione a un livello un po’ più alto quindi sicuramente poi è il hosting che si occupa di di fare determinate azioni però attenzione non è che se qui troviamo rosso dobbiamo tampinare l’hosting ah mi devi risolvere questa cosa potrebbe essere anche un un problema che nel nostro caso specifico non è così importante quindi anche qui insomma analizziamo bene cosa questo tool specifico ci pone a video, ci mostra a video ma in generale un po’ tutti i tool cosa mostrano a video relativamente alla pagina o al sito che vi facciamo analizzare ultimo aspetto di questo tool ne ho approfondito molto il suo utilizzo perché negli ultimi periodi lo sto utilizzando molto lo sto ritenendo un strumento molto valido quindi ho voluto dedicare parte di questa presentazione solo su questo tool perché è un esortarvi a scoprirlo in prima battuta nella lezione free e poi dopo valutare l’acquisto e passare alla modalità pagamento dove ci sono ulteriori funzionalità attive o la possibilità già solo di monitorare più siti sapete bene che è importante nel momento in cui c’è una necessità proprio oggettiva di monitorarne più di uno quindi chiudevo con questa semplice differenza, il tool mi permette di switchare nel dark mode per chi è amante di questo tipo di visualizzazione io personalmente preferisco la dark mode rispetto a quella chiara perché mi avviso di risaltare meglio alcune informazioni poi nel caso in cui devo fare degli screenshot lo switch immediato e veloce in alto a destra e quindi nella visualizzazione chiara faccio lo screenshot e poi ritorno in quella dark nel momento in cui una ultima nota a margine avete più progetti e volete eliminarne uno per fare spazio a un altro l’eliminazione vi blocca per 48 ore quindi lo slot non è libero nell’immediato ma è ancora bloccato per 48 ore quindi se volete fare questa attività programmatela in anticipo in modo da non trovarvi a dover attendere due giorni prima che lo slot sia bloccato
