Prima di parlare del codice HTML per l’ottimizzazione On Page, preme dare una
piccola spiegazione su cosa sia questo tipo di ottimizzazione e in cosa differisce da quella Off Page. L’ottimizzazione On page comprende quelle tecniche che agiscono sul codice del sito web (codice html come tag title, h1,h2, metatag ecc) e la crezione dei files robots.txt e sitemap.xml, l’url rewriting e lo status 301.
L’ottimizzazione On Page quindi comprende le tecniche che vengono effettuate per la
“scrittura” del sito web. L’ottimizzazione Off Page invece comprende le tecniche che non hanno nulla a che vedere con il codice o la creazione dei files sopracitati, ma si parla di tecniche come link building e link popularity oppure sfruttare i social.
Il tag title, che stabilisce il titolo della pagina, si inserisce nel tag head della pagina, in questo modo:
<html>
<head>
<title>Titolo della mia pagina</title>
</head>
Il Tag title deve essere utilizzato in ottica SEO: dovrebbe comprendere il titolo della pagina e una breve descrizione della pagina stessa, inserendo, dove e quanto possibile, le parole chiave più importanti che rispecchiano il contenuto della pagina.
Esempio:
<title>Lavastoviglie – Le migliori lavastoviglie economiche. I prezzi più bassi del web</title>
Il title non dovrebbe avere più di 70 caratteri, in quanto mediamente un broswer riesce a visualizzare non più di questa quantità. Nel tag title può essere buona norma inserire a
fine (o inizio) il nome del sito per aumentare l’effetto “brand“.
I tag <h1> e <h2> (fino a h6) hanno un’importanza fondamentale per quanto riguarda il SEO. In Essi, dovrebbero essere inseriti i “titoli” e “sottotitoli” degli articoli di una pagina (o comunque dei contenuti). Anche qui, come in tutti i tag che spiegheremo, dovranno essere sempre inserite le parole chiave sulle quali si vuole ottimizzare il sito e
che rispecchiano il contenuto della pagina.
Esempio di un tag h1 e h2:
<h1>Le 10 caratteristiche che una lavastoviglie deve possedere</h1>
<h2>Scopri i 10 punti che una lavastoglie deve avere per essere definita un buon
elettrodomestico</h2>
—–
Contenuto dell’articolo
——
I tag <b> e <strong> sostanzialmente producono lo stesso effetto; ovvero, “marcano”
in grassetto il testo. Vanno utilizzati per marcare le parole chiave nel testo o nel contenuto di una pagina, sempre tenendo conto delle keywords su cui si vuole
ottimizzare e che racchiudono il contenuto della pagina. Anche se hanno lo stesso effetto, si consiglia di utilizzare <strong> se si vogliono marcare le parole chiave.
Quando uno spider rileva questi due tag, capisce che il webmaster o il creatore del
contenuto vuole marcare quella parola in quanto sia importante per l’articolo (o pagina).
Ovviamente, come tutti i tag, non bisogna farne un uso spropositato, perchè i motori di ricerca capiscono se realmente i tag rispecchiano il contenuto o no. Quindi, per evitare
penalizzazioni, bisogna usarlo con attenzione.
Anche il tag <em>, seppur si pensi con meno importanza, va a “marcare” l’importanza delle parole chiave. Per quanto riguarda la formattazione del testo, provoca lo stesso effetto del tag <i>, ovvero serve per scrivere testi in corsivo. Ma il tag <em> va considerato come un tag di maggior importanza rispetto al tag <i>.
I meta tag sono dei tag che vengono utilizzati nell’HTML per definire particolari metadati, che non restituiscono alcun output nella pagina (non sono quindi visualizzabili dall’utente attraverso il browser, a meno che l’utente non visualizzi il codice sorgente della pagina).
I meta tag, tutti, devono essere inseriti nell’head della pagina (<head></head>). I principali meta tag sono:
-Meta Description
-Meta Classification;
-Meta Keywords,
-Meta Robots
Il tag meta description, come dice la parola in inglese, ci fornisce una “descrizione” della pagina, che verrà visualizzata nei motori di ricerca, piu precisamente nei risultati della SERP <meta name=”description” content=”Lavastoviglie.it è un sito ecommerce per la vedita di lavastoviglie economiche a prezzi vantaggiosi. Le migliori lavastoviglie con i prezzi più bassi del web!”>
Serve quindi a riassumere brevemente il contenuto della pagina (in questo caso l’home
page) di un sito, per permettere una migliore scelta nella navigazione dell’utente e inoltre aiuta anche a fornire una buona ottimizzazione SEO in quanto dovrebbe contenere anche le parole chiavi dei contenuti della pagina.
Il tag meta Keywords, serve a indicare una serie di parole chiave su cui vogliamo ottimizzare la nostra pagina. In tempi passati, questo meta tag era importante ma col passare degli anni i motori di ricerca hanno dato sempre meno importanza a questo tag in quanto è stato utilizzato in modo scorretto: i webmaster lo utilizzavano inserendo parole chiave che non avevano alcuna relazione col contenuto della pagina col solo scopo di far entrare nel proprio sito web utenti che scrivevano altre parole chiave.
Tuttavia è ancora utilizzato dalla maggior parte dei webmaster, anzi, alcuni motori di ricerca, anche se con poca rilevanza hanno affermato di tenerne ancora conto (anche se in minimissima parte). Tuttavia, inserirlo nel nostro sito web, non guasta, l’importante è ricordarsi di non esagerare con le parole e di centrare e scrivere soltanto le parole chiavi e più attinenti alla nostra pagina, onde evitare penalizzazioni dai motori di ricerca.
Esempio di tag Meta Keywords: <meta name=”keywords” content=”informatica, guide informatica, guida seo, guida php, articoli informatica”>
Il meta tag classification è poco utilizzato, e anche poco tenuto conto dai motori di ricerca. Consiste nello specificare l’argomento del nostro sito web o della pagina.
<meta name=”classification” content=”elettrodomestici”>
Altri meta tag minori sono quelli che vengono utilizzati per i robots, o quelli che servono per gestire i caratteri Iso della lingua, o il meta tag “author” per indicare l’autore oppure il meta tag “generator” che ha lo scopo di indicare il software che ha prodotto la pagina web. Esempio di meta tag robots: <meta name=”robots” content=”index, nofollow”>
Con questo meta tag indichiamo al robots di non seguire e indicizzare la pagina dove è inserito questo meta tag. Questo è un esempio per la gestione dell’iso e
della lingua: <meta http-equiv=”content-type” content=”text/html; charset=iso-8859-1″> <meta http-equiv=”content-language” content=”it”>
Ricordiamo che tutti i meta tag devono essere inseriti nell’head della pagina.
Ottimizzare le immagini con gli attributi alt e title è importante dal punto di vista SEO.
L’attributo Alt, che sta per “alternative text” è un testo alternativo che viene assegnato ad un’immagine descrivendone il significato. O meglio, si dovrebbe descrivere il significato
dell’immagine.
Vediamo un esempio di un attributo alt di un’immagine in cui è presente una mela:
<img src=”fotomela.jpeg” alt=”mela”> Oppure un attributo alt più lungo:
<img src=”fotomela.jpeg” alt=”Questa è una mela verde”>
L’attributo alt ha un duplice scopo: quello di rendere un’immagine più accessibile agli utenti nel caso in cui l’immagine per qualsiasi motivo non venisse caricata, l’altro è quella di renderla ottimizzata per i motori di ricerca: infatti, l’immagine potrà essere inserita nei risultati delle “immagini” dei motori di ricerca, come Google immagini. Lo spider inoltre, non riesce a “vedere” le immagini e quindi indicare il significato dell’immagine potrà aiutare nell’ottimizzazione seo.
L’attributo title per le immagini, contiene una descrizione dell’immagine. È quella descrizione che appare quando rilasciamo il mouse su una immagine.
Esempio:
<img src=”percorsoimg.jpeg” title=”questa è una mela rossa anzi rossissima”>
Anche in questo caso possiamo inserire delle keywords su cui vogliamo effettuare
l’ottimizzazione.
SLR Web Marketing '93 
1 pensiero su “Ottimizzazione On Page”