SEO Tecnica

Le conoscenze tecniche di base ti aiuteranno a ottimizzare il tuo sito per i motori di ricerca e a stabilire credibilità presso gli sviluppatori.

Ora che hai creato contenuti di valore sulla base della solida ricerca di parole chiave, è importante assicurarsi che non sia leggibile solo dagli umani, ma anche dai motori di ricerca!

Non è necessario avere una profonda conoscenza tecnica di questi concetti, ma è importante capire cosa fanno questi asset tecnici in modo da poterne parlare in modo intelligente con gli sviluppatori. Parlare la lingua dei tuoi sviluppatori è importante perché probabilmente ti serviranno per eseguire alcune delle tue ottimizzazioni. È improbabile che diano la priorità alle tue domande se non riescono a capire la tua richiesta o a vederne l’importanza. Quando stabilisci la credibilità e la fiducia con i tuoi sviluppatori, puoi iniziare a strappare la burocrazia che spesso blocca il lavoro cruciale da svolgere.

Per essere efficaci, i SEO hanno bisogno del supporto tra team

È fondamentale avere una relazione salutare con i tuoi sviluppatori in modo da poter affrontare con successo le sfide SEO di entrambe le parti. Non aspettare fino a quando un problema tecnico causa ramificazioni SEO negative che coinvolgono uno sviluppatore. Invece, unisci le forze per la fase di pianificazione con l’obiettivo di evitare del tutto i problemi. In caso contrario, può costare tempo e denaro in un secondo momento.

Oltre al supporto tra team, la comprensione dell’ottimizzazione tecnica per la SEO è essenziale se si desidera garantire che le pagine Web siano strutturate sia per gli utenti che per i crawler. A tal fine, abbiamo diviso questo capitolo in tre sezioni:

  1. Come funzionano i siti web
  2. Come i motori di ricerca comprendono i siti Web
  3. Come gli utenti interagiscono con i siti Web

Poiché la struttura tecnica di un sito può avere un impatto enorme sulle sue prestazioni, è fondamentale che tutti comprendano questi principi. Potrebbe anche essere una buona idea condividere questa parte della guida con programmatori, scrittori di contenuti e designer in modo che tutte le parti coinvolte nella costruzione di un sito si trovino sulla stessa pagina.

Come funzionano i siti Web

Se l’ottimizzazione dei motori di ricerca è il processo di ottimizzazione di un sito Web per la ricerca, i SEO hanno bisogno almeno di una conoscenza di base della cosa che stanno ottimizzando!

Di seguito, descriviamo il percorso del sito Web dall’acquisto del nome di dominio fino allo stato di rendering completo in un browser. Una componente importante del percorso del sito web è il percorso di rendering critico, che è il processo con cui un browser trasforma il codice di un sito web in una pagina visualizzabile.

Sapere questo sui siti web è importante per i SEO da capire per alcuni motivi:

  • I passaggi di questo processo di assemblaggio della pagina web possono influire sui tempi di caricamento della pagina e la velocità non è solo importante per mantenere gli utenti sul tuo sito, ma è anche uno dei fattori di ranking di Google.
  • Google esegue il rendering di determinate risorse, come JavaScript, in un “secondo passaggio”. Google esaminerà prima la pagina senza JavaScript, quindi alcuni giorni o alcune settimane dopo, renderà JavaScript, il che significa che gli elementi critici SEO che vengono aggiunti alla pagina utilizzando JavaScript potrebbero non essere indicizzati.

Immagina che il processo di caricamento del sito web sia il tuo tragitto da lavoro a lavoro. Ti prepari a casa, raccogli le tue cose da portare in ufficio e quindi segui il percorso più veloce da casa al lavoro. Sarebbe sciocco mettersi solo una delle scarpe, prendere un percorso più lungo per andare al lavoro, lasciare le cose in ufficio, quindi tornare immediatamente a casa per prendere l’altra scarpa, giusto? È una specie di cosa fanno i siti Web inefficienti. Questo capitolo ti insegnerà come diagnosticare dove il tuo sito web potrebbe essere inefficiente, cosa puoi fare per semplificare e le ramificazioni positive sulle tue classifiche e sull’esperienza utente che possono derivare da tale ottimizzazione.

Prima di poter accedere a un sito Web, è necessario configurarlo!

  1. Il nome di dominio è stato acquistato. I nomi di dominio come moz.com sono acquistati da un registrar di nomi di dominio come GoDaddy o HostGator. Questi registrar sono solo organizzazioni che gestiscono le prenotazioni di nomi di dominio.
  2. Il nome di dominio è collegato all’indirizzo IP. Internet non capisce nomi come “moz.com” come indirizzi di siti Web senza l’aiuto di DNS (Domain Name Server). Internet utilizza una serie di numeri chiamati indirizzi IP (es. 127.0.0.1), ma vogliamo usare nomi come moz.com perché sono più facili da ricordare per gli umani. Dobbiamo usare un DNS per collegare quei nomi leggibili dall’uomo con numeri leggibili dalla macchina.

Come un sito Web passa dal server al browser

  1. L’utente richiede il dominio. Ora che il nome è collegato a un indirizzo IP tramite DNS, le persone possono richiedere un sito Web digitando il nome di dominio direttamente nel proprio browser o facendo clic su un collegamento al sito Web.
  2. Il browser effettua richieste. La richiesta di una pagina web richiede al browser di effettuare una richiesta di ricerca DNS per convertire il nome di dominio nel suo indirizzo IP. Il browser quindi effettua una richiesta al server per il codice con cui è costruita la tua pagina web, come HTML, CSS e JavaScript.
  3. Il server invia risorse. Una volta che il server riceve la richiesta per il sito Web, invia i file del sito Web da assemblare nel browser del ricercatore.
  4. Il browser assembla la pagina Web. Il browser ha ora ricevuto le risorse dal server, ma deve ancora mettere tutto insieme e rendere la pagina Web in modo che l’utente possa vederla nel proprio browser. Mentre il browser analizza e organizza tutte le risorse della pagina Web, sta creando un Document Object Model (DOM). Il DOM è ciò che puoi vedere quando fai clic con il pulsante destro del mouse e “ispeziona elemento” su una pagina Web nel browser Chrome (scopri come ispezionare gli elementi in altri browser).
  5. Il browser effettua le richieste finali. Il browser mostrerà una pagina web solo dopo che tutto il codice necessario della pagina è stato scaricato, analizzato ed eseguito, quindi a questo punto, se il browser necessita di codice aggiuntivo per mostrare il tuo sito web, farà una richiesta aggiuntiva dal tuo server .
  6. Il sito Web viene visualizzato nel browser. Wow! Dopo tutto ciò, il tuo sito Web è stato ora trasformato (reso) da codice a ciò che vedi nel tuo browser.

Parla con i tuoi sviluppatori di asincrono!

Qualcosa che puoi mettere in evidenza con i tuoi sviluppatori sta accorciando il percorso di rendering critico impostando gli script su “asincroni” quando non sono necessari per rendere il contenuto above the fold, il che può rendere più veloce il caricamento delle tue pagine web. Async dice al DOM che può continuare ad essere assemblato mentre il browser sta recuperando gli script necessari per visualizzare la tua pagina web. Se il DOM deve mettere in pausa l’assemblaggio ogni volta che il browser recupera uno script (chiamato “script di blocco del rendering”), può rallentare notevolmente il caricamento della pagina. Sarebbe come uscire a mangiare con i tuoi amici e dover mettere in pausa la conversazione ogni volta che uno di voi va al bancone per ordinare, riprendendo solo una volta tornati. Con async, tu e i tuoi amici potete continuare a chattare anche quando uno di voi sta ordinando. Potresti anche voler far apparire altre ottimizzazioni che gli sviluppatori possono implementare per abbreviare il percorso di rendering critico, come rimuovere completamente gli script non necessari, come i vecchi script di tracciamento.

Ora che sai come appare un sito Web in un browser, ci concentreremo su ciò di cui è fatto un sito Web, in altre parole, il codice (linguaggi di programmazione) utilizzato per costruire quelle pagine web.

I tre più comuni sono:

  • HTML: cosa dice un sito web (titoli, contenuto del corpo, ecc.)
  • CSS – Come appare un sito Web (colore, caratteri, ecc.)
  • JavaScript: come si comporta (interattivo, dinamico, ecc.)

HTML: cosa dice un sito web

HTML è l’acronimo di hypertext markup language e funge da spina dorsale di un sito Web. Elementi come titoli, paragrafi, elenchi e contenuti sono tutti definiti nell’HTML.

Ecco un esempio di una pagina web e come appare il suo HTML corrispondente:

HTML

L’HTML è importante che i SEO sappiano perché è ciò che vive “sotto il cofano” di qualsiasi pagina che creano o su cui lavorano. Sebbene il tuo CMS probabilmente non richieda di scrivere le tue pagine in HTML (es: selezionando “collegamento ipertestuale” ti consentirà di creare un collegamento senza dover digitare “a href =”), è ciò che stai modificando ogni volta che fai qualcosa in una pagina web come aggiungere contenuti, cambiare il testo di ancoraggio dei collegamenti interni e così via. Google esegue la scansione di questi elementi HTML per determinare la pertinenza del documento per una determinata query. In altre parole, ciò che è nel tuo HTML gioca un ruolo enorme nel modo in cui la tua pagina web si posiziona nella ricerca organica di Google!

CSS: come appare un sito web

CSS sta per “fogli di stile a cascata” e questo è ciò che fa sì che le tue pagine web assumano determinati caratteri, colori e layout. L’HTML è stato creato per descrivere il contenuto, piuttosto che per modellarlo, quindi quando i CSS sono entrati in scena, hanno cambiato le carte in tavola. Con i CSS, le pagine Web potrebbero essere “abbellite” senza richiedere la codifica manuale degli stili nell’HTML di ogni pagina, un processo ingombrante, specialmente per i siti di grandi dimensioni.

Non è stato fino al 2014 che il sistema di indicizzazione di Google ha iniziato a rendere le pagine web più simili a un browser reale, a differenza di un browser di solo testo. Una pratica SEO black-hat che ha cercato di trarre vantaggio dal vecchio sistema di indicizzazione di Google stava nascondendo testo e link tramite CSS allo scopo di manipolare il posizionamento nei motori di ricerca. Questa pratica di “testo nascosto e link” costituisce una violazione delle linee guida sulla qualità di Google.

Componenti di CSS di cui i SEO, in particolare, dovrebbero preoccuparsi:

  • Poiché le direttive di stile possono vivere in file di fogli di stile esterni (file CSS) invece che nell’HTML della tua pagina, rendono la tua pagina meno pesante, riducendo le dimensioni del trasferimento di file e velocizzando i tempi di caricamento.
  • I browser devono ancora scaricare risorse come il tuo file CSS, quindi comprimerle può caricare più velocemente le tue pagine web e la velocità delle pagine è un fattore di classificazione.
  • Avere le tue pagine più ricche di contenuti che ricche di codice può portare a una migliore indicizzazione dei contenuti del tuo sito.
  • L’uso dei CSS per nascondere link e contenuti può far penalizzare e rimuovere manualmente il tuo sito Web dall’indice di Google.

JavaScript: come si comporta un sito web

Nei primi giorni di Internet, le pagine Web erano costruite con HTML. Quando è arrivato il CSS, il contenuto della pagina web ha avuto la capacità di assumere un certo stile. Quando il linguaggio di programmazione JavaScript è entrato in scena, i siti web ora non potevano solo avere struttura e stile, ma potevano essere dinamici.

JavaScript ha aperto molte opportunità per la creazione di pagine Web non statiche. Quando qualcuno tenta di accedere a una pagina migliorata con questo linguaggio di programmazione, il browser dell’utente eseguirà il JavaScript contro l’HTML statico restituito dal server, dando vita a una pagina web che prende vita con una sorta di interattività.

Hai sicuramente visto JavaScript in azione – potresti non averlo saputo! Questo perché JavaScript può fare quasi tutto per una pagina. Ad esempio, potrebbe creare un popup o richiedere la visualizzazione di risorse di terze parti come annunci sulla tua pagina.

Rendering lato client e rendering lato server

JavaScript può comportare alcuni problemi per la SEO, poiché i motori di ricerca non visualizzano JavaScript nello stesso modo dei visitatori umani. Ciò è dovuto al rendering lato client rispetto a quello lato server. La maggior parte di JavaScript viene eseguita nel browser di un client. Con il rendering lato server, invece, i file vengono eseguiti sul server e il server li invia al browser nel loro stato di rendering completo.

Gli elementi della pagina SEO-critical come testo, link e tag caricati sul lato client con JavaScript, anziché rappresentati nel codice HTML, sono invisibili dal codice della pagina fino a quando non vengono visualizzati. Ciò significa che i crawler dei motori di ricerca non vedranno cosa c’è nel tuo JavaScript, almeno non inizialmente.

Google afferma che, fintanto che non impedisci a Googlebot di eseguire la scansione dei tuoi file JavaScript, sono generalmente in grado di visualizzare e comprendere le tue pagine web proprio come un browser può, il che significa che Googlebot dovrebbe vedere le stesse cose di un utente che visualizza un sito nel loro browser. Tuttavia, a causa di questa “seconda ondata di indicizzazione” per JavaScript lato client, Google può perdere alcuni elementi che sono disponibili solo una volta eseguito JavaScript.

Ci sono anche altre cose che potrebbero andare storte durante il processo di rendering delle tue pagine web da parte di Googlebot, che possono impedire a Google di capire cosa è contenuto nel tuo JavaScript:

  • Hai bloccato Googlebot dalle risorse JavaScript (ad es. Con robots.txt, come abbiamo appreso nel capitolo 2)
  • Il tuo server non è in grado di gestire tutte le richieste di scansione dei tuoi contenuti
  • JavaScript è troppo complesso o obsoleto per essere compreso da Googlebot
  • JavaScript non “carica in modo pigro” i contenuti nella pagina fino a quando il crawler non ha terminato la pagina e è passato.
  • Inutile dire che, sebbene JavaScript offra molte possibilità per la creazione di pagine Web, può anche avere alcune gravi conseguenze per il tuo SEO se non stai attento.

Per fortuna, c’è un modo per verificare se Google vede la stessa cosa dei tuoi visitatori. Per vedere una pagina in cui Googlebot visualizza la tua pagina, utilizza lo strumento “Controllo URL” di Google Search Console. Basta incollare l’URL della tua pagina nella barra di ricerca GSC:

Da qui, fai clic su “Prova URL live”.

Test Live URL Search Console

Dopo che Googlebot ha ripetuto la scansione del tuo URL, fai clic su “Visualizza pagina testata” per vedere come viene eseguita la scansione e il rendering della tua pagina.

URL analytics

Facendo clic sulla scheda “Screenshot” accanto a “HTML” viene mostrato come lo smartphone Googlebot esegue il rendering della tua pagina.

Page Speed Optimization

In cambio, vedrai come Googlebot vede la tua pagina rispetto a come un visitatore (o tu) potresti vedere la pagina. Nella scheda “Ulteriori informazioni”, Google ti mostrerà anche un elenco di tutte le risorse che potrebbero non essere state in grado di ottenere per l’URL inserito.

Comprendere il modo in cui funzionano i siti Web costituisce un’ottima base per ciò di cui parleremo in seguito: ottimizzazioni tecniche per aiutare Google a comprendere meglio le pagine del tuo sito Web.

Come i motori di ricerca comprendono i siti Web

Immagina di essere un crawler di un motore di ricerca che scansiona un articolo di 10.000 parole su come cuocere una torta. Come si identificano l’autore, la ricetta, gli ingredienti o i passaggi necessari per cuocere una torta? È qui che entra in gioco il markup dello schema. Ti consente di fornire ai motori di ricerca classificazioni più specifiche per il tipo di informazioni presenti sulla tua pagina.

Lo schema è un modo per etichettare o organizzare i tuoi contenuti in modo che i motori di ricerca abbiano una migliore comprensione di quali sono determinati elementi nelle tue pagine web. Questo codice fornisce una struttura ai dati, motivo per cui lo schema viene spesso definito “dati strutturati”. Il processo di strutturazione dei dati viene spesso definito “markup” perché si esegue il markup dei contenuti con il codice organizzativo.

JSON-LD è il markup dello schema preferito di Google (annunciato nel maggio ’16), che supporta anche Bing. Per visualizzare un elenco completo delle migliaia di markup dello schema disponibili, visitare Schema.org o visualizzare l’Introduzione ai dati strutturati di Google Developers per ulteriori informazioni su come implementare i dati strutturati. Dopo aver implementato i dati strutturati più adatti alle tue pagine web, puoi testare il markup con lo strumento di test per i dati strutturati di Google.

Oltre ad aiutare i robot come Google a capire di cosa tratta un determinato contenuto, il markup dello schema può anche abilitare funzioni speciali per accompagnare le tue pagine nelle SERP. Queste funzioni speciali vengono definite “rich snippet” e probabilmente le hai viste in azione. Sono cose come:

  • Carosello
  • Recensione a Stelle
  • Caselle di ricerca dei sitelink
  • Ricette

Ricorda, l’utilizzo di dati strutturati può aiutare a consentire la presenza di un rich snippet, ma non lo garantisce. Altri tipi di rich snippet verranno probabilmente aggiunti in futuro con l’aumentare dell’uso del markup dello schema.

Alcune ultime parole di consiglio per il successo dello schema:

  • È possibile utilizzare più tipi di markup dello schema su una pagina. Tuttavia, se esegui il markup di un elemento, ad esempio un prodotto, e nella pagina sono elencati altri prodotti, devi anche contrassegnare quei prodotti.
  • Non contrassegnare i contenuti che non sono visibili ai visitatori e seguire le Linee guida sulla qualità di Google. Ad esempio, se aggiungi markup strutturato delle recensioni a una pagina, assicurati che tali recensioni siano effettivamente visibili su quella pagina.
  • Se hai pagine duplicate, Google ti chiede di contrassegnare ogni pagina duplicata con il tuo markup strutturato, non solo con la versione canonica.
  • Fornisci contenuti originali e aggiornati (se applicabile) sulle tue pagine di dati strutturati.
  • Il markup strutturato dovrebbe essere un riflesso accurato della tua pagina.
  • Prova a utilizzare il tipo più specifico di markup dello schema per i tuoi contenuti.
  • Le recensioni con markup non devono essere scritte dall’azienda. Dovrebbero essere autentiche recensioni aziendali non pagate da clienti reali.

Racconta ai motori di ricerca le tue pagine preferite con la canonicalizzazione

Quando Google esegue la scansione dello stesso contenuto su pagine web diverse, a volte non sa quale pagina indicizzare nei risultati di ricerca. Ecco perché è stato inventato il tag rel = “canonical”: per aiutare i motori di ricerca a indicizzare meglio la versione preferita del contenuto e non tutti i suoi duplicati.

Il tag rel = “canonical” ti permette di dire ai motori di ricerca dove si trova la versione originale originale di un contenuto. Stai essenzialmente dicendo: “Ehi motore di ricerca! Non indicizzare questo, indicizza invece questa pagina di origine.” Quindi, se vuoi ripubblicare un contenuto, che sia esattamente o leggermente modificato, ma non vuoi rischiare di creare contenuti duplicati, il tag canonico è qui per salvare la situazione.

La corretta canonicalizzazione garantisce che ogni contenuto unico del tuo sito web abbia un solo URL. Per impedire ai motori di ricerca di indicizzare più versioni di una singola pagina, Google consiglia di avere un tag canonico autoreferenziale su ogni pagina del tuo sito. Senza un tag canonico che indica a Google quale versione della tua pagina web è quella preferita, https://www.example.com potrebbe essere indicizzato separatamente da https://example.com, creando duplicati.

“Evita i contenuti duplicati” è una verità lapalissiana di Internet, e per una buona ragione! Google vuole premiare i siti con contenuti unici e preziosi, non contenuti presi da altre fonti e ripetuti su più pagine. Poiché i motori vogliono offrire la migliore esperienza di ricerca, raramente mostreranno più versioni dello stesso contenuto, optando invece per mostrare solo la versione canonizzata o se non esiste un tag canonico, qualunque versione ritengano più probabile che sia l’originale.

Distinguere tra filtro contenuti e penalità contenuto

Non esiste una penalità di contenuto duplicato. Tuttavia, dovresti cercare di evitare che i contenuti duplicati causino problemi di indicizzazione utilizzando il tag rel = “canonical” quando possibile. Quando esistono duplicati di una pagina, Google sceglierà un canonico e filtrerà gli altri dai risultati di ricerca. Ciò non significa che sei stato penalizzato. Significa solo che Google vuole mostrare solo una versione dei tuoi contenuti.

È anche molto comune per i siti Web avere più pagine duplicate a causa delle opzioni di ordinamento e filtro. Ad esempio, su un sito di e-commerce, potresti avere quella che viene chiamata una navigazione sfaccettata che consente ai visitatori di restringere i prodotti per trovare esattamente quello che stanno cercando, come una funzione “ordina per” che riordina i risultati per categoria di prodotto pagina dal prezzo più basso al più alto. Questo potrebbe creare un URL simile a questo: example.com/mens-shirts?sort=price_ascending. Aggiungi più opzioni di ordinamento / filtro come colore, dimensioni, materiale, marchio, ecc. E pensa solo a tutte le varianti della tua pagina principale di categoria di prodotti che ciò creerebbe!

Per saperne di più sui diversi tipi di contenuto duplicato, questo post del Dr. Pete aiuta a distillare le diverse sfumature.

Come gli utenti interagiscono con i siti Web

Nel Capitolo 1, abbiamo detto che nonostante SEO stia per ottimizzazione dei motori di ricerca, il SEO riguarda tanto le persone quanto i motori di ricerca stessi. Questo perché esistono motori di ricerca per servire i ricercatori. Questo obiettivo aiuta a spiegare perché l’algoritmo di Google premia i siti Web che offrono le migliori esperienze possibili ai ricercatori e perché alcuni siti Web, pur avendo qualità come robusti profili di backlink, potrebbero non funzionare bene nella ricerca.

Quando capiamo cosa rende ottimale la loro esperienza di navigazione web, possiamo creare quelle esperienze per le massime prestazioni di ricerca.

Garantire un’esperienza positiva ai tuoi visitatori mobili

Dato che oggi oltre la metà di tutto il traffico web proviene da dispositivi mobili, è sicuro affermare che il tuo sito Web dovrebbe essere accessibile e facile da navigare per i visitatori mobili. Nell’aprile 2015, Google ha implementato un aggiornamento del suo algoritmo che promuoveva le pagine ottimizzate per i dispositivi mobili rispetto alle pagine non ottimizzate per i dispositivi mobili. Quindi, come puoi assicurarti che il tuo sito web sia ottimizzato per i dispositivi mobili? Sebbene ci siano tre modi principali per configurare il tuo sito Web per dispositivi mobili, Google consiglia un design web reattivo.

Design reattivo

I siti Web responsive sono progettati per adattarsi allo schermo di qualunque tipo di dispositivo utilizzino i tuoi visitatori. È possibile utilizzare i CSS per far “rispondere” alla pagina Web alle dimensioni del dispositivo. Questo è l’ideale perché impedisce ai visitatori di toccare due volte o pizzicare e ingrandire per visualizzare il contenuto delle pagine. Non sei sicuro che le tue pagine web siano ottimizzate per i dispositivi mobili? Puoi utilizzare il test ottimizzato per dispositivi mobili di Google per verificare!

AMP

AMP è l’acronimo di Accelerated Mobile Pages ed è utilizzato per fornire contenuti ai visitatori mobili a velocità molto maggiori rispetto alla consegna non AMP. AMP è in grado di fornire contenuti così velocemente perché fornisce contenuti dai suoi server cache (non dal sito originale) e utilizza una versione AMP speciale di HTML e JavaScript.

Indicizzazione mobile-first

A partire dal 2018, Google ha iniziato a passare ai siti Web all’indicizzazione mobile-first. Quel cambiamento ha suscitato un po ‘di confusione tra ottimizzazione e ottimizzazione dei dispositivi mobili, quindi è utile chiarire le ambiguità. Con l’indicizzazione mobile-first, Google esegue la scansione e l’indicizzazione della versione mobile delle tue pagine Web. Rendere il tuo sito Web compatibile con gli schermi mobili è un vantaggio per gli utenti e le tue prestazioni nella ricerca, ma l’indicizzazione mobile-first avviene indipendentemente dalla compatibilità con i dispositivi mobili.

Ciò ha sollevato alcune preoccupazioni per i siti Web che mancano di parità tra le versioni mobili e desktop, come la visualizzazione di contenuti diversi, navigazione, collegamenti, ecc. Un sito mobile con collegamenti diversi, ad esempio, modificherà il modo in cui Googlebot (mobile) esegue la scansione del tuo sito e invia l’equità del collegamento alle altre pagine.

Migliorare la velocità della pagina per mitigare la frustrazione dei visitatori

Google vuole pubblicare contenuti che si caricano alla velocità della luce per gli utenti. Ci aspettiamo risultati a caricamento rapido e quando non li otteniamo, torneremo rapidamente alla SERP alla ricerca di una pagina migliore e più veloce. Questo è il motivo per cui la velocità della pagina è un aspetto cruciale della SEO in loco. Possiamo migliorare la velocità delle nostre pagine web sfruttando strumenti come quelli che abbiamo menzionato di seguito. Fai clic sui link per saperne di più su ciascuno di essi.

  • Lo strumento PageSpeed ​​Insights di Google e la documentazione sulle best practice
  • Come pensare agli strumenti di velocità
  • GTMetrix
  • Tester di velocità e prestazioni del sito Web mobile di Google
  • Google Lighthouse
  • Chrome DevTools e tutorial

Le immagini sono uno dei principali colpevoli di pagine lente!

Come discusso nel Capitolo 4, le immagini sono uno dei motivi principali per le pagine Web a caricamento lento! Oltre alla compressione dell’immagine, all’ottimizzazione del testo alternativo dell’immagine, alla scelta del giusto formato immagine e all’invio di sitemap immagine, esistono altri modi tecnici per ottimizzare la velocità e il modo in cui le immagini vengono mostrate ai tuoi utenti. Alcuni modi principali per migliorare la consegna delle immagini sono i seguenti:

1. SRCSET: come offrire la migliore dimensione dell’immagine per ciascun dispositivo

L’attributo SRCSET consente di avere più versioni dell’immagine e quindi specificare quale versione deve essere utilizzata in diverse situazioni. Questo pezzo di codice viene aggiunto al tag (dove si trova la tua immagine nell’HTML) per fornire immagini uniche per dispositivi di dimensioni specifiche.

Questo è come il concetto di responsive design di cui abbiamo discusso in precedenza, ad eccezione delle immagini!

Questo non solo accelera il tempo di caricamento delle immagini, ma è anche un modo unico per migliorare la tua esperienza utente on-page fornendo immagini diverse e ottimali a diversi tipi di dispositivi.

Responsive

2. Mostra ai visitatori che il caricamento dell’immagine è in corso con caricamento lento

Il caricamento lento si verifica quando si accede a una pagina Web e, invece di vedere uno spazio bianco vuoto per dove si troverà un’immagine, una versione sfocata leggera dell’immagine o una scatola colorata al suo posto appare mentre viene caricato il testo circostante. Dopo pochi secondi, l’immagine viene caricata chiaramente a piena risoluzione. La famosa piattaforma di blogging Medium lo fa davvero bene.

Viene inizialmente caricata la versione a bassa risoluzione, quindi la versione ad alta risoluzione. Questo aiuta anche a ottimizzare il tuo percorso di rendering critico! Quindi, mentre tutte le altre risorse della pagina vengono scaricate, stai mostrando un’immagine teaser a bassa risoluzione che aiuta a dire agli utenti che le cose stanno accadendo / stanno caricando. Per ulteriori informazioni su come caricare le immagini in modo pigro, consulta la Guida al caricamento lento di Google.

Migliora la velocità condensando e raggruppando i tuoi file

I controlli della velocità delle pagine spesso forniscono consigli come “minimizza le risorse”, ma cosa significa effettivamente? La minimizzazione condensa un file di codice rimuovendo elementi come le interruzioni di riga e gli spazi, nonché abbreviando i nomi delle variabili di codice ove possibile.

“Raggruppamento” è un altro termine comune che sentirai in riferimento al miglioramento della velocità della pagina. Il processo di raggruppamento combina un gruppo di file della stessa lingua di codifica in un unico file. Ad esempio, un gruppo di file JavaScript può essere inserito in un file più grande per ridurre la quantità di file JavaScript per un browser.

Riducendo al minimo e raggruppando i file necessari per costruire la tua pagina web, acceleri il tuo sito web e riduci il numero delle tue richieste HTTP (file).

Migliorare l’esperienza per il pubblico internazionale

I siti web che si rivolgono a un pubblico di più paesi dovrebbero familiarizzare con le migliori pratiche SEO internazionali al fine di offrire le esperienze più rilevanti. Senza queste ottimizzazioni, i visitatori internazionali potrebbero avere difficoltà a trovare la versione del tuo sito adatta a loro.

Ci sono due modi principali in cui un sito web può essere internazionalizzato:

  • Linguaggio
    I siti che si rivolgono a parlanti di più lingue sono considerati siti Web multilingue. Questi siti dovrebbero aggiungere qualcosa chiamato tag hreflang per mostrare a Google che la tua pagina ha una copia per un’altra lingua. Ulteriori informazioni su hreflang.
  • Nazione
    I siti che indirizzano il pubblico in più paesi sono chiamati siti Web multiregionali e dovrebbero scegliere una struttura di URL che semplifichi il targeting del proprio dominio o delle proprie pagine a paesi specifici. Ciò può includere l’uso di un dominio di primo livello (ccTLD) con codice paese come “.ca” per il Canada o di un dominio di primo livello generico (gTLD) con una sottocartella specifica per paese come “esempio.com/ca” per Canada. Ulteriori informazioni sugli URL specifici delle impostazioni locali.

Hai effettuato ricerche, scritto e ottimizzato il tuo sito Web per i motori di ricerca e l’esperienza utente. Il prossimo pezzo del puzzle SEO è grande: stabilire l’autorità in modo che le tue pagine si posizionino in alto nei risultati di ricerca. Successivamente, al capitolo 6 (Link Building & Establishment Authority)!