Devlancer Blog

SEO On page: Che cos’è e come farla bene

Per quanto riguarda la SEO moderna, sono i contenuti a farla da padrone dato che i motori di ricerca più evoluti, come ad esempio Google, riescono a leggere ed esaminare i contenuti testuali presenti nelle pagine di un sito web.

Non solo, questi motori di ricerca sono addirittura in grado di capire quanto pertinenti siano i nostri testi rispetto alle query (richieste fatte sulla barra di ricerca) inviate dall’utente e, in base al punteggio che i nostri contenuti ottengono, verremo poi posizionati più in alto o più in basso tra i risultati di ricerca offerti.

Fattori chiave

È opportuno quindi fare dell’ottimo Copywriting SEO (scrittura di contenuti originali tenendo conto delle regole SEO per la scrittura) assicurandosi di individuare le giuste keywords (parole chiave, le parole con le quale un utente può cercarci sul web, es: Hotel economico a Venezia) per fare in modo che ciò che si scrive sia pertinente con il proprio pubblico attuale e potenziale, così da essere poi trovati tramite le ricerche che questi ultimi potrebbero effettuare nei motori di ricerca.

Vediamo alcuni dei fattori di SEO on page sui quali possiamo intervenire.

HTML

Il codice HTML sta alla base di qualsiasi pagina web. Anche quando il nostro server lavora con il codice PHP, l’output finale deve essere in HTML. È importante stare al passo con le regole date dal W3C (World Wide Web Consortium) e rispettare la corretta semantica del codice.

Google infatti è molto attento a questi aspetti tecnici che spesso vengono trascurati per lasciare spazio soltanto alla creatività e al design del sito. Ecco perché dovremmo scrivere contenuti originali tenendo conto delle regole per la scrittura dei testi.

Cosa significa questo per il nostro sito web?

  • Usare le intestazioni e i titoli giusti: h1, h2, h3, h4, h5, h6 dovrebbero essere usati secondo l’ordine gerarchico, evitando di saltare da un livello all’altro, ad esempio inserire un h2 e poi un h5;
  • Utilizzare i tag HTML corretti: questo vale per il template grafico del sito, ma anche per i testi, con occhio di riguardo per i tag semantici.

Esempi:

  • Se usiamo un H1 e subito dopo un H4, questo può essere un errore, perché le buone pratiche per l’HTML prevedono di rispettare l’ordine gerarchico delle intestazioni h1-h6.
  • Se invece di usare le liste (tag ul e ol dell’HTML) usiamo i normali paragrafi, il testo sarà meno comprensibile dall’utente e anche meno utile per i crawler dei motori di ricerca.
  • Le immagini (tag <img>) devono contenere un attributo “alt”, anche vuoto, per il testo alternativo. Riuscire a descrivere l’immagine è utile sia per la SEO sia per l’accessibilità, anche se è facoltativo e, anzi, poco utile nel caso di immagini decorative, come icone o sfondi.

Ecco uno screenshot dell’editor di testo Tinymce, molto diffuso nella creazione di contenuti web, che permette di formattare il testo di una pagina come abbiamo descritto:

Finestra dell’editor Tinymce, che permette di formattare il testo di una pagina web

Questo editor si può usare anche su WordPress usando il plugin Classic Editor, sebbene sia ristretto alla versione 4.9 di TinyMCE, ed è possibile avere accesso ad alcune funzionalità avanzate con plugin quali Advanced Editor Tools e Advanced Tinymce Configuration.

Le tecniche adottate in questi casi rientrano nella “SEO on page” perché sono quell’insieme di elementi che intervengono direttamente sulla pagina web stessa, comprendendo quindi i tag html, il contenuto testuale, le immagini, le prestazioni e i tempi di caricamento, i link interni e via dicendo.

Ma quindi, oltre alla scrittura dei contenuti, alla formattazione dei testi usando i tag HTML corretti, alla link building e all’uso di parole chiave rilevanti, oltre alla corretta scrittura di titoli e snippet, possiamo fare altro? Qui si entra in argomenti più tecnici, che avremo modo di approfondire parlando dei Core Web Vitals. Per ora vediamo alcuni aspetti basilari.

Sicurezza e Performance

La sicurezza, la velocità e la capacità di un sito web di adattarsi ad ogni dispositivo sono tre importanti elementi che influenzano il ranking del sito web.

Chi gestisce un sito web dovrebbe porsi queste importanti domande:

  1. Il sito si carica in modo veloce?
  2. Possiamo ottimizzare immagini o altre risorse?
  3. Dispone del protocollo di sicurezza HTTPS?
  4. Si presentano fenomeni di Cloacking?

Per fare alcuni test utili possiamo usare degli strumenti automatici come PageSpeed Insights o WebPageTest, che ci forniscono già dei consigli in merito alle immagini e alle altre risorse.

HTTPS

In merito all’HTTPS, se non sappiamo come installarlo possiamo rivolgerci al nostro fornitore del servizio hosting. Spesso usando pannelli come cPanel o Plesk è possibile agire in autonomia. Al giorno d’oggi è pressoché essenziale che il proprio sito web sia disponibile in HTTPS di default (con HTTP che rimanda alla versione sicura HTTPS).

Per spiegare brevemente la questione tecnica, in genere la comunicazione HTTP avviene sulla porta 80 del server, mentre la HTTPS avviene sulla 443. Possono anche esserci dei reverse proxy di mezzo, ma in buona sostanza quando installiamo un certificato SSL, come quello fornito da Let’s Encrypt gratuitamente, stiamo dicendo al browser dell’utente di comunicare col nostro server in modo sicuro e crittografato, anziché “in chiaro” come avviene con la comunicazione HTTP standard.

Questo aiuta a prevenire attacchi MitM (Man in the Middle), una tecnica per la quale un eventuale hacker potrebbe carpire informazioni sulla comunicazione tra browser e server, con dati quali password e nomi utente trasmessi in modo chiaro senza crittografia.

Cloacking

Il Cloacking è una tecnica informatica di tipo Black Hat SEO per la quale il motore di ricerca vede dei contenuti diversi rispetto a quelli che vedono le persone quando ci navigano normalmente, questo sistema può per un breve periodo migliorare il proprio posizionamento organico, ma nel lungo termine può portare a far bannare il sito web dagli indici di ricerca perché considerato non affidabile.

Ad esempio, potremmo analizzare alcuni header HTTP per identificare se il browser possa essere di un crawler, e in tal caso mostrare dei contenuti diversi rispetto a quelli che mostreremmo agli utenti normali.

Per altri dettagli: SEOZoom Cloaking

Title e Meta Description

Una strategia che vale assolutamente la pena tenere presente come tecnica di SEO on page, riguarda la scrittura di titoli e meta description.

Il <title> è un tag HTML univoco che viene inserito all’interno dell’<head> di un documento HTML. Viene usato per determinare il titolo principale della pagina, che viene poi visualizzato nella scheda del browser:

Il tag “title” è inserito nel codice HTML della pagina

È importante che sia scritto bene e riassuma il contesto del contenuto della pagina: in genere si consiglia di tenere una lunghezza di 50-60 caratteri per questo titolo, ma anche se fosse qualche carattere in più non è detto che sia un problema. Evitiamo però titoli troppo lunghi di 100 o più caratteri.

La “description” è un “meta tag”, cioè un tag HTML che non ha un reale peso nella pagina, ma viene usato dai crawler per creare uno “snippet”, cioè il testo di anteprima che si visualizza nella pagina dei risultati di ricerca (SERP). Si consiglia di tenere una lunghezza massima di 155 caratteri, anche se avere una lunghezza maggiore non rappresenta un problema.

Uso della meta description in HTML e nella SERP Google

È bene sapere però che non è detto che questo testo venga realmente utilizzato, infatti il motore di ricerca, al momento della richiesta da parte dell’utente, potrebbe usare un altro testo presente nella pagina per generare lo snippet, qualora lo ritenesse più opportuno per le parole chiave ricercate.

Questo è spiegato meglio proprio da Google:

A volte Google usa il tag <meta name=”description”> di una pagina per generare lo snippet nei risultati di ricerca, se ritiene che fornisca agli utenti una descrizione più accurata di quella derivata unicamente dai contenuti nella pagina. Un tag della meta descrizione in generale informa gli utenti e suscita il loro interesse con un breve riepilogo pertinente del tema di una determinata pagina. È come una presentazione per convincere l’utente che la pagina contiene esattamente quello che cerca. Non esistono limiti di lunghezza per una meta descrizione, ma lo snippet viene troncato nei risultati della Ricerca Google a seconda delle necessità, in genere per adattarlo alla larghezza dei dispositivi.

Fonte: Controllare gli snippet nei risultati di ricerca

Quindi quello che possiamo fare è suggerire al motore di ricerca il testo che vogliamo venga usato come base per creare gli snippet, ma sta poi ad esso decidere cosa mostrare realmente.

E il buon vecchio meta tag keywords?

Probabilmente più di qualcuno ricorda che si usava il meta tag “keywords” per indicare a Google quali parole chiave sono da ritenere più importanti per l’indicizzazione. Ebbene, questo tag ufficialmente non è più supportato, possiamo averne la certezza leggendo questa pagina: meta tag e attributi supportati da Google al paragrafo “Tag e attributi non supportati”.

Allo stesso modo, per completezza d’informazione, ufficialmente non vengono presi in considerazione da Google a fini SEO nemmeno gli attributi “lang”, “rel next”, “rel prev”.

Usiamo il nofollow nei link quando necessario

Assolutamente una ottima pratica invece è quella di usare l’attributo “rel nofollow” sui link quando opportuno, in genere quando pubblichiamo link esterni nella nostra pagina web. In questo modo, stiamo dicendo ai crawler di “non seguire” il link e quindi comunichiamo la nostra intenzione di volerci “estraniare” dal contenuto esterno.

È un po’ come dire “io ho inserito qui questo link esterno, però non ne sono responsabile e non voglio che questo sito esterno venga associato a me”. In sostanza, ciò che dovrebbe accadere è che usando il nofollow evitiamo di trasferire parte del nostro “ranking” al sito in uscita.

In questo modo, quando il crawler rileva un link con nofollow, dovrebbe tenere in considerazione che noi non vogliamo che il sito esterno riceva un punteggio migliore grazie a noi. Questo è utile quando ad esempio vogliamo pubblicare in un articolo le fonti che abbiamo usato, senza però dare a queste fonti il nostro supporto in termini di ranking.

Lasciare il “dofollow” (che equivale a non inserire il nofollow nel link) può essere un modo per ringraziare e dare credito al sito esterno, ma può anche essere controproducente se non conosciamo bene il sito di destinazione, che nel tempo potrebbe venire hackerato o completamente cambiato in peggio. È quindi utile stabilire uno standard o una linea guida da seguire.

Il mio suggerimento è quello di inserire il nofollow per tutti quei siti esterni che non controlliamo in alcun modo, e ometterlo quando invece stiamo linkando siti partner o a noi affiliati.

Per approfondire: When to Use Nofollow on Links & When Not To

Come usare invece noopener e noreferrer?

Quando usiamo “nofollow”, il sito di destinazione potrebbe ancora venire collegato a noi tramite l’header HTTP Referer, che indica il sito di provenienza. Non è detto che questo header sia sempre presente, dipende anche dalle impostazioni del browser dell’utente.

Quando clicchiamo un risultato dalla SERP di Google, il sito di destinazione avrà come “referer”, cioè come sito di provenienza, www.google.it o www.google.com. In questo modo, è possibile sapere da dove ha avuto origine una visita inizialmente.

Se all’interno del link, cioè del tag <a href> inseriamo rel=”noreferrer”, stiamo dicendo al browser di omettere, e quindi di rendere vuoto l’header HTTP Referer, così il sito di destinazione non sarà da dove è arrivato l’utente, che quindi risulterà come un “accesso diretto”.

Questo è molto importante da sapere anche per capire come mai a volte ci risultano così tanti “Accessi diretti” su Google Analytics o altri strumenti di analisi del traffico: potrebbe essere uno dei motivi.

Per approfondire: All You Need to Know About rel=“noopener noreferrer” links

Il rel=”noopener” si usa soprattutto per evitare una vecchia vulnerabilità, nota come Reverse tabnabbing e ormai praticamente scomparsa, che avviene quando si usa target=”blank” per aprire un link in una nuova scheda.

Senza entrare negli aspetti puramente tecnici, è utile usarlo come buona pratica, anche se nei browser moderni questa vulnerabilità non dovrebbe più verificarsi.

Link utili

Leggi anche