
[vc_row][vc_column][vc_column_text]Oramai è un argomento all'ordine del giorno: in un prossimo futuro inserire un link a un contenuto esterno al sito (e ancor peggio venderli) potrebbe comportare penalizzazione se non effettuato mediante attributo nofollow.
Incominciamo quindi a prepararci a questa eventualità e iniziamo a vedere come effettuare le modifiche.
Ma prima facciamo un passo indietro, per chi non conosce l'uso dell'attributo "nofollow" nei link vediamolo nel dettaglio e ancor prima analizziamo la sintassi per comprendere in generale la terminologia legata ai tag HTML.
Premessa
L'HTML (o HyperText Markup Language) è un linguaggio di Markup (e non di programmazione!) utilizzato per scrivere ipertesti e diffonderli mezzo Web. e nel corso degli anni si è evoluto su più fronti e ha incominciato a venir utilizzato in altri ambiti oltre al Web.
Il primo grosso passo è stata la separazione dal codice relativo al contenuto (rimasto l'HTML) a quello relativo agli stili di impaginazione (i CSS o Cascading Style Sheets) un enorme passo avanti per preparare contenuto dedicato a varie visualizzazioni. Ancor oggi infatti preparando un file CSS per la visualizzazione a monitor e uno ottimizzato per la stampa possiamo, mediante i metatag, formattare il contenuto in maniera diversa in funzione che sia indirizzato alla visualizzazione su schermo piuttosto che su carta una volta stampato. A metà 2007 siamo poi giunti all'HTML 5 dedicato allo sviluppo delle applicazioni.
Con il passsare degli anni la sintassi con cui riferirsi ai selettori HTML o meglio definiti TAG HTML è rimasta la stessa.
Con TAG HTML andiamo quindi a riferirci ai selettori che vanno a costituire le pagine in cui inseriamo i nostri contenuti. In funzione del tag html che scegliamo di usare la sintassi con cui scriverlo varierà.
In particolare, nel caso dei link a siti esterni o pagine interne al sito, il tag html da utilizzare è il classico <a href=""></a>
e che a differenza, ad esempio dei tag html <img>
o <hr/>
per poter funzionare si deve dichiarare nella forma: <a> testo del link </a>
.
Ogni qual volta, utilizzando un editor visuale oramai onnipresente nei blog, in Wordpress o nei social network andiamo ad inserire un link con l'universale icona della catenella:andiamo in realtà ad inserire un link in questo formato.
I tag html supportano degli attributi per specificare meglio come quel determinato selettore deve funzionare.
Per comprendere meglio vi rimando all'organo che sovrintende e stabilisce gli standard tecnici per il World Wide Web: la W3C o World Wide Web Consortium.
Il tag Link
Analizziamo ora il formato con cui si deve esprimere un link e quali attributi possiamo utilizzare e nello specifico l'attributo "nofollow".
Gli attributi, all'interno di un tag HTML si possono utilizzare nell'ordine in cui si vuole, non cambia nulla sia nella renderizzazione che in termini di SEO.
Un link, come detto nel precedente paragrafo, va espresso in questa maniera: <a href="http://www.sito.com">testo del link</a>
e supporta vari attributi per specificare comportamento e stile:
- URL espresso con
href="link"
dove link può essere un url assoluto che punta ad un altro sito web(ad esempio: href="http://www.sito.com"), un url relativo che punta ad una pagina nello stesso sito (href="nomepagina.htm"), un'ancora nella pagina (href="#nomeancora"), un javascript (href="javascript:alert('Ciao');") o un protocollo diverso dai precedenti (ftp://, mailto:, https://)
Scrivetemi alla mia email <a href="mailto:cippa@lippa.net">cippa@lippa.net</a>
Permette di far aprire il proprio client di posta elettronica, se configurato, e farlo puntare direttamente a questo indirizzo email
Visita il link dedicato al <a href="seo-organico.html">SEO organico</a> presente in questo sito
Effettuerà un link alla pagina seo-organico.html presente nello stesso sito - target: serve a specificare in quale finestra si deve aprire il nostro link. Se non specifichiamo niente infatti il nostro link si aprirà nella stessa pagina. Il valore di questo attributo può essere: _blank (apri il collegamento in nuova finestra), _self (apri il collegamento nella finestra in cui è presente il link), _parent (apri il collegamento sul frame di origine o in quello corrente) e _top (apri il collegamento al livello superiore).
Il link apre in una nuova <a href="newpage.htm" target="_blank">pagina</a>
Aprirà il link newpage.htm in una nuova pagina mantenendo aperta quella di partenza. Di mio ogni volta che inserisco un link ad un sito esterno aggiungo questo attributo per limitare che l'utenza se ne vada. - title: un attributo dei link molto importante per aumentare l'accessibilità del nostro sito internet. E' il testo alternativo al link, quel tooltip che compare quando vi fermate con il mouse sopra ad un link e viene letto dai reader delle persone cieche per descrivere il link e dar un'idea a chi ha una disabilità e non può vedere di dove punta un determinato link.
Visitate una nuova pagina dedicata al
Avvertirà i non vedenti che quel link punta ad una pagina con argomento il SEO per i non vedenti.
<a href="seo-per-non-vedenti.htm" title="il SEO per i non vedenti">SEO per i non vedenti</a> - rel: attributo di relazione che può valere nofollow, lo vediamo a seguire nello specifico.
- Vi sono ancora hreflang (per specificare la lingua del collegamento) e accesskey per associare un tasto di scelta rapida per il link, ma non vengono molto utilizzate e se interessati a voi il compito di esplorare l'uso di questi attributi.
Un uso un po' diverso del link si può applicare quando vogliamo indirizzare ad una determinato punto di una determinata pagina mediante l'utilizzo di ancore ipertestuali (oggi molto utilizzate nei layout onepage) espressi in questo formato:
<a name="paragrafo1">Vai al paragrafo 1</a>
Inserendo poi l'ancora, come accennato nell'attributo URL, possiamo inserire il punto di arrivo:
<a href="#paragrafo1">Sezione 1</a>
Un esempio pratico in questo sito sono varie ancore inserite nella pagina dedicata alle figure retoriche nel SEO. Se vogliamo quindi è possibile inviare l'utente a leggere direttamente cos'è una metafora.
[bctt tweet="Come e quando utilizzare gli attributi dei link e in particolare il nofollow?"]
L'attributo rel="nofollow"
Nell'ottica di incominciare a far valere sempre meno il peso dei link nei collegamenti ipertestuali e per penalizzare le aziende che vendono link Google ha introdotto un nuovo attributo per i link, come accennato nel precedente paragrafo: l'attributo nofollow.
Associato ad un link va a specificare a Google (e ai vari motori di ricerca che rispettano questo standard) di "Non seguire questo link".
In particolare nel caso volessimo quindi fare un link ad un sito esterno il nuovo formato in cui andarlo ad esprimere sarà:
Visita il <a href="http://www.sitoesterno.com" rel="nofollow">sito esterno</a> del mio amico!
[/vc_column_text][vc_cta h2="Un link ``nofollow`` a cosa serve nella SEO?" add_button="bottom" btn_title="Leggi l'articolo" btn_color="success" btn_align="center" btn_link="url:https%3A%2F%2Fwww.posizionamento-seo.com%2Fsearch-engine-optimization%2Fottimizzazione-sito-internet%2Flink-nofollow-seo%2F||target:%20_blank" btn_button_block="true"]In un nuovo articolo vi spiego le potenzialità dei link con attributo "nofollow"[/vc_cta][vc_column_text css_animation="top-to-bottom"]
Ma come faccio a modificare tutti i link del mio sito?
Beh in questo caso se siamo su piattaforma Wordpress ci viene in aiuto Broken Link Checker.
Una volta installato possiamo andare sotto alla voce del menù di amministrazione: Strumenti >> Link Rotti e selezionare Tutti e poi armarci di santa pazienza e inserire l'attributo rel="nofollow" nei link che puntato a siti esterni utilizzando la vista Codice.
Per quanto riguarda i link nei commenti non dobbiamo preoccuparci in quanto Wordpress in automatico inserisce l'attributo nofollow.
Attenzione però alle plugin che inseriamo nella Widget Bar, nel caso facciano link esterni ai social network anche loro dovranno essere nofollow!
Come inserire l'attributo "nofollow" nella vista codice
Per aggiungere l'attributo "nofollow" ai nostri link è necessario entrare nella vista codice, del nostro contenuto, mediante l'editor visuale fornito da Wordpress.
Per farlo, dopo che abbiamo aperto il nostro post dal pannello di amministrazione, premiamo sul bottone "Testo" in alto sulla sinistra.
Il contenuto del nostro editor si trasformerà e ci mostrerà il codice HTML del nostro post.
Dobbiamo quindi cercare la parte relativa ai nostri link e aggiungere a manina l'attributo "nofollow" al testo (prima della chiusura del tag <a href>).
[/vc_column_text][vc_cta h2="L'evoluzione del WEB" add_button="bottom" btn_title="Scopri l'animazione" btn_color="primary" btn_align="center" btn_link="url:http%3A%2F%2Fwww.evolutionoftheweb.com%2F%3Fhl%3Dit||target:%20_blank" btn_button_block="true"]
Dagli albori del 1995 ai giorni nostri in una splendida animazione interattiva.
[/vc_cta][/vc_column][/vc_row]
pino
Nato con la passione per l'informatica da mamma Access e papà ASP nel 2002 rinnego repentinamente la mia paternità facendomi adottare da papà PHP e mamma SQL.
Allevo HTML e correlati fiori in CSS mentre vedo i frutti del mio orticello SEO crescere grazie alla passione e alla dedizione della coltura biodinamica; perchè il biologico è fin troppo artificiale.
Realizzo siti internet a tempo pieno, nei restanti momenti mi occupo di redigere articoli per questo sito e saltuariamente far esperimento nel mare che è internet.