Come si crea un link (anche in HTML) e collegare due pagine web

Di Riccardo Esposito | Pubblicato il - Aggiornato il

Per creare un link devi decidere l’anchor text, usare il tag HTML <a> e aggiungere l’URL di destinazione. Se usi un editor WYSIWYG tipo WordPress basta evidenziare il testo da rendere cliccabile e usare il comando per hyperlink.


La creazione di un link, ovvero di un collegamento ipertestuale da una pagina all’altra, è uno dei passi fondamentali per ottenere un documento web degno di questo nome. Non esiste internet senza la rete di menzioni e connessioni da un punto all’altro.

come creare un link

Ma è vero che per generare un link cliccabile, per quanto l’operazione sia semplice, devi mettere in pratica una serie di accorgimenti. Sono i dettagli che fanno al differenza quando lavori su questo fronte. E, ad esempio, devi inserire un link MAILTO.

O magari un salto di pagina con ancora interna. Banalizzare il lavoro per inserire un link cliccabile da una pagina web a un’altra è un errore. Ecco una guida che ti spiega come generare un collegamento ipertestuale funzionante. E allineato alle regole SEO/UX.

Cos’è un link cliccabile e a cosa serve

Quello che viene definito link, hyperlink o collegamento ipertestuale è una stringa di contenuto o un’immagine che contiene un tag HTML che consente di raggiungere una seconda risorsa. Che può essere una pagina web interna o esterna. Qui abbiamo:

Possiamo realizzare link cliccabili anche verso file da scaricare o numeri di telefono o ancora per aprire un client e mandale un’email. Questi link hanno un valore in termini di user experience ma possono influenzare anche la SEO se non hanno l’attributo nofollow.

esempio link cliccabile
Esempio di link ipertestuale da cliccare.

Da leggere: fare un link personalizzato con TinyURL

Come creare un link HTML da cliccare

Il metodo per realizzare un link da selezionare e cliccare con cursore del mouse o con le dita su uno smartphone: HTML. Si tratta di un’operazione che gli editor e i CMS permettono di fare con comandi rapidi ma è utile sapere come si inserisce un link.

  1. Decidi il testo da collegare: scegli l’anchor text che testo vuoi utilizzare per il tuo link. In questa fase stai scegliendo ciò che le persone vedranno e su cui cliccheranno.
  2. Crea il tag HTML del link: usa l’elemento HTML <a> (anchor, ancora in italiano) per creare il link. Ricorda che href è l’attributo che specifica il permalink che ti interessa.
  3. Inserisci l’URL: metti l’indirizzo web della pagina o della risorsa a cui desideri collegarti. Assicurati che l’URL sia completo e inizi con https:// per il protocollo.
  4. Completa il tag di chiusura: chiudi il tag <a> dopo il testo del link utilizzando </a>. In questo modo hai creato il tuo collegamento ipertestuale su una pagina web.

Lavorando sul codice puoi creare link HTML con funzioni diverse. Ad esempio, con il target _blank puoi far aprire il link in una nuova finestra mentre se aggiungi il nofollow quel collegamento non ha valore SEO. Esempi per creare in HTML un link cliccabile:

<a href="mailto:email@esempio.com">Link a email</a>
<a href="tel:+4733378901">+47 333 78 901</a>
<a href="#sezione2">Link alla sezione 2</a>

Nel primo caso puoi creare un link cliccabile a un’email, nel secondo a un numero di telefono. Nel terzo, invece, hai la possibilità di realizzare un salto di pagina con ancora interna. Questo può essere utile per realizzare un menu interno o una landing page.

creare link con chatgpt
Come creare un link su ChatGPT.

Ricorda che per semplificare il lavoro di creazione dei link su una pagina in HTML puoi utilizzare anche ChatGPT o Google Gemini. Basta scrivere un prompt per descrivere le tue esigenze e ottieni una stringa di codice da copiare e incollare dove serve.

Attributi HTML rel e target dei link

L’attributo rel definisce la relazione tra la pagina corrente e la destinazione del link. Il target indica in quale finestra o scheda deve aprirsi il link. Ecco alcuni valori comuni:

AttributoValoreCosa fa
Rel
nofollowIndica ai motori di ricerca di non seguire il link.
noopenerApre il link senza privilegi di accesso alla pagina.
noreferrerElimina informazioni di riferimento dalla pagina.
alternateIndica una lingua diversa o con un formato diverso.
authorSuggerisce l’autore della pagina collegata.
bookmarkDefinisce un segnalibro all’interno della pagina.
externalIndica che il link punta a un sito web esterno.
licenseIndica la licenza della pagina collegata.
nextLa pagina successiva in una paginazione.
prevLa pagina precedente in una paginazione.
Target
_blankApre il link in una nuova scheda.
_topApre il link nella finestra principale del browser.
_selfApre il link nella stessa scheda.

Come fare un link su una pagina web

Ci sono diversi modi per ottenere un link da evidenziare o cliccare su una pagina internet. Il primo è quello appena descritto, attraverso il codice HTML. Se utilizziamo WordPress, dobbiamo andare nell’editor cliccando sui tre punti in alto a destra.

Come fare un link su una pagina web
Come fare un link con WordPress.

A questo punto, inserisci i tag HTML e copia l’URL che vuoi linkare. Se non vuoi procedere in questo modo ti basta usare i blocchi di WordPress Gutenberg, aggiungendo il semplice paragrafo hai gli strumenti della formattazione, compreso il comando link:

  • Aggiungi il blocco paragrafo.
  • Scrivi il tuo testo di ancora.
  • Evidenzia l’anchor text.
  • Clicca sul simbolo della catena.
  • Incolla l’URL di destinazione.
  • Salva il lavoro svolto.

Queste regole valgono in qualsiasi condizione, anche quando vuoi inviare un link via email. La maggior parte dei client di posta hanno un editor simile a quello di WordPress.

In ogni caso, per inserire un collegamento nella posta elettronica basta copiare e incollare l’URL e poi premere al barra spazio per renderlo cliccabile. Un po’ come puoi fare per trovare il link Facebook del tuo profilo personale o della pagina aziendale.

Come aggiungere un link a un’immagine?

Un secondo modo per creare un link cliccabile su un CMS come WordPress: utilizzare come elemento selezionabile dall’utente un’immagine. Esatto, puoi inserire un link in una foto o in un qualsiasi elemento grafico come ad esempio un banner ADV.

mettere link su immagine
Come rendere un’immagine cliccabile.

Carica o inserisci l’immagine nella tua pagina web o nel tuo articolo. Puoi farlo tramite l’opzione di caricamento nell’editor, o trascinando il contenuto dove serve (se il CMS consente, WordPress sì). A questo punto devi seguire una serie di punti:

  • Posiziona il cursore sopra l’immagine
  • Cerca l’opzione per inserire un link
  • Incolla l’URL per il link dell’immagine.
  • Premi ok e conferma il lavoro.

Scegli il testo alternative dell’immagine perché, in termini tecnici, corrisponde all’anchor text che utilizzi quando inserisci un link standard utilizzando stringhe di testo.

< a href="https://www.mysocialweb.it/><img src="https://www.mysocialweb.it/immagine.jpg" alt="My Social Web"></a>

Quando lavori alla tua attività di link building assicurati di avere anche dei backlink che arrivano dalle immagini per variare l profilo dei collegamenti ipertestuali in entrata.

Come inserire un link su un bottone HTML.

Puoi creare dei link cliccabili anche con dei bottoni. Il tutorial lo puoi trovare in questo video. In sintesi, devi aggiungere un blocco Gutenberg specifico, quello dedicato ai pulsanti. Poi non ti resta che copiare e incollare l’URL nel campo, per approfondire puoi leggere questo articolo dedicato a come creare un bottone con link su WordPress.

Da leggere: come creare link su Instagram

Come mettere un link su editor di testo

Impossibile dimenticare che i link non si mettono solo nelle pagine web o sui social ma anche su documenti di testo creati con editor e software di video scrittura. Che usiamo tutti i giorni per realizzare i nostri lavori di content marketing. Vuoi approfondire?

Word

La creazione link su Word è piuttosto semplice, permette a chi lavora su questo programma di videoscrittura – perfetto per scrivere testi descrittivi e informativi ma anche racconti, relazioni, saggi – di immettere un URL con semplicità sulla pagina:

  • Seleziona il testo o l’immagine a cui collegare il link.
  • Nella barra menu di Word seleziona Inserisci.
  • Clicca su Link o Collegamento ipertestuale.
  • Nella finestra di dialogo inserisci l’URL completo.
  • Puoi anche selezionare un documento cliccando su Sfoglia.
  • Fai clic su OK per confermare e creare il link.

Come rinominare un link su Word? Nella finestra di dialogo che hai aperto inserendo il link c’è una casella: Testo visualizzato. Vale a dire l’anchor text sul documento. Usa questo campo per rinominare il collegamento ipertestuale che stai generando su Word.

Google Docs

Per mettere e creare link diretto da cliccare su Google Docs puoi utilizzare la semplice scorciatoia che trovi nel pannello di controllo. La clicchi e trovi un menu che ti permettere di inserire link a file di Google Drive o copiare l’URL che vuoi raggiungere.

link su google docs
Come generare un link su Google Docs.

Oppure, puoi semplicemente copiare e incollare l’URL nel documento. come fare a rendere un link cliccabile? Basta premere la barra spazio per farlo diventare blu, quindi attivo. Poi hai la possibilità di modificare il link in termini di URL e anchor text. Basta cliccare sopra allo slug (l’indirizzo web) copiato sul documento per aprire il tool.

Pages

Per collegare un link su Pages devi selezionare il testo o l’immagine che ti interessa e cliccare sul tasto destro. Qui si apre un menu dove trovi la voce specifica e un altro selezionatore per scegliere se inserire link a pagina web, email, segnalibro o telefono.

mettere link su pages
Come linkare su Pages.

Da qui hai la possibilità di modificare l’URL, l’etichetta e altri parametri in modo da realizzare la migliore esperienza di navigazione per chi legge il tuo documento.

Come si crea un link efficace

Ovvero, come si crea un link capace di essere letto come tale? La scelta dell’anchor test è decisiva ma devi rispettare una serie di elementi: il link deve essere di colore diverso dal font, cambiare aspetto quando viene toccato dal cursore del mouse

Deve anche assumere un altro colore quando viene cliccato. In questo modo il lettore sa cosa ha già visitato. Di default queste caratteristiche sono decise dal tema, quindi assicurati di avere le carte in regola e scegli un buon template WordPress.

Altro aspetto da considerare: devi monitorare il buon funzionamento dei collegamenti ipertestuali. In che modo? Puoi usare un software come Xenu, l’applicazione di Screaming Frog o un plugin come Broken Link Checker: in questo modo curi la qualità della pagina web da una prospettiva utente e motore di ricerca.

Scegli un anchor text parlante

La regola fondamentale per lavorare a favore della leggibilità senza dimenticare il mondo SEO copywriting: l’anchor text deve essere parlane. Ovvero deve spiegare il contenuto della risorsa di atterraggio senza aver bisogno d’altro. Vuoi linkare una fonte?

Leggendo l’anchor text devo capire dove arriverò. Quindi niente clicca qui, vai, vedi, etc. Attenzione ai link in uscita: non usare keyword troppo performanti, in questi casi lavora con nome brand o URL. È più sicuro e altrettanto corretto in termini di UX.

Il fattore di innaturalezza risiede nel fatto che un blogger o webmaster difficilmente andrebbe a linkare spontaneamente ad una pagina prodotto utilizzando una money keyword (…). Per la link building, come anchor text verrebbe poi utilizzata una branded keyword o una key generica e quasi mai una money keyword.Dario Ciracì sul blog di Semrush.

Sono d’accordo su questo consiglio di lavorare in modo pulito ma al tempo stesso di rispettare la leggibilità del testo. Usare un anchor text muto vuol dire impedire al pubblico di capire. Lo stesso però vale anche per lo spider di Google che analizza la pagina.

Chiedere il permesso per inserire link

No, non è necessario chiedere il permesso per inserire un link dal proprio sito verso una risorsa pubblica. Se è tale, raggiungibile da tutti attraverso il browser, non c’è bisogno di permesso. Situazione diversa se, ad esempio, si tratta di una pagina protetta.

Posso usare il target=”_blank”?

Prima di tutto, a cosa serve il target=”_blank”? A fare in modo che il link HTML cliccabile si apra in una nuova scheda del browser. Viene usato spesso dai blogger che vogliono mantenere il lettore sul sito: ogni click può essere fatale per la tua pagina web.

target blank wordpress
Come attivare il Target Blank su WordPress.

Il target=”_blank”, che si inserisce con una spunta nell’inserimento link di WordPress, risolve il problema. Ma non dimenticare che può essere un errore: gli standard HTML deprecano l’uso di questa soluzione perché viene riconosciuta come forzatura.

Le persone non si aspettano di aprire link in una nuova scheda. Evitare il target=”_blank” è la base. C’è chi lavora con una via di mezzo: stessa scheda per i link interni, nuova scheda per quelli in uscita. Per me può essere una soluzione.

Come mettere i link interni

I link interni permettono al lettore di scoprire nuove risorse e aiutano il posizionamento dei contenuti. Ma devono essere seguiti con cura. In primo luogo non devono essere messi a caso ma essere utili, contestualizzati, decisivi per aggiungere valore alla pagina.

come creare un link
L’arte di inserire un buon link.

Inoltre devono seguire una strategia. Lavoro così: concentro i link interni sulla risorsa più conveniente. Devo spingere un articolo per la keyword Inbound Marketing? Tutti i collegamenti ipertestuali vanno verso quella risorsa specifica per posizionarla su Google.

Ma come si creano link interni su WordPress? Basta andare sulla parola che ti interessa, la selezioni e clicchi sull’icona della catena: qui appare un campo dove puoi scrivere una parola di riferimento e ti escono le varie opzioni. Scegli l’URL e aggiungi il link.

Un altro modo per ottimizzare i collegamenti: creare delle ancore interne HTML per generare un indice. Proprio come ho fatto in questo post. Per ottenere un menu interno su WordPress del genere puoi lavorare con il codice, ma è più semplice usare il plugin Table Of Content Plus.In questo modo è più facile creare link con salti di pagina.

Da leggere: come pubblicare i link su Facebook

Domande e risposte rapide per i tuoi link

Ora, il mondo dei link ipertestuali è articolato. non è facile rispondere a tutti i dubbi per aiutarti a lavorare su questo fronte: per questo voglio rispondere alle principali domande che spesso mi rivolgono clienti e lettori rispetto al buon uso dei collegamenti.

Come copiare un link e renderlo attivo?

Posiziona il cursore sul link. Fai click con il tasto destro del mouse e poi su Copia (Ctrl+C su Windows o Command+C su Mac). Da smartphone, tocca e tieni premuto il link, quando appare il menu seleziona copia. Per incollare, vai nel punto dove inserire il link, fai click con il tasto destro e seleziona Incolla (Ctrl+V su Windows o Command+V su Mac). Come si fa a rendere un link cliccabile? Premi il tasto della barra spaziatrice e diventa blu.

Come mandare un link su WhatsApp

Tocca l’icona della graffetta mentre scrivi il messaggio, Seleziona Link, Incolla l’URL nel campo di testo. Ora aggiungi un messaggio facoltativo. Se il link è troppo lungo, puoi accorciarlo usando un servizio di accorciamento URL come Bitly o TinyURL.

Come fare un link esterno e uno interno?

La differenza tra un link interno e uno in uscita su una pagina web riguarda solo l’URL di destinazione. Nel primo caso inserisci un permalink che porta a una pagina dello stesso sito web, nel secondo caso invece punti verso un altro progetto. Spesso in questi casi si utilizzano attributi tipo nofollow, sponsored e UGC per i contenuti degli utenti.

Come generare un link di un file

Carica il file su un server, come ad esempio nella sezione media di WordPress. Ottieni l’URL assoluto del documento sul web e usalo come un qualsiasi indirizzo web da linkare. Puoi fare questo con file PDF, Word, Excel, Power Point, JPG, PNG e altro ancora.

Riccardo Esposito

Sono un web writer freelance. Mi occupo di scrittura online dal 2009, mi sono specializzato nella stesura di piani editoriali per blog aziendali. Ho scritto 3 libri dedicati al mondo del blogging e della scrittura online (bio di Riccardo Esposito).

Categoria: Guide per webmaster

1 commento su “Come si crea un link (anche in HTML) e collegare due pagine web”

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Torna in alto