TechBlogSD - Tutto per WordPress e sviluppo WEB
Istruzioni WEB e WordPress, notizie, recensioni di temi e plugin

Impara le basi dei collegamenti ipertestuali

7

Il collegamento o collegamento ipertestuale è un’associazione che collega una pagina Web a un’altra. È molto importante collegare le tue pagine in modo che gli utenti e i motori di ricerca possano comprendere la pertinenza della pagina correlata. Oltre a collegare le proprie pagine web potrebbe essere necessario anche collegarsi a siti esterni per fornire maggiori informazioni sui relativi contenuti.

Questo articolo spiega le basi della struttura dei collegamenti ipertestuali, il tipo di collegamenti e i punti da considerare durante il collegamento delle pagine web.

Struttura del collegamento ipertestuale

Un collegamento ipertestuale è costituito da due semplici parti:

  • Un URL chiamato Uniform Resource Locator che non è altro che l’indirizzo della pagina Web che si desidera collegare.
  • Testo di ancoraggio che è il testo visibile agli utenti nella finestra del browser.

Impara le basi dei collegamenti ipertestuali

Struttura del collegamento ipertestuale

Tipo di collegamenti ipertestuali

In base all’utilizzo in una pagina Web, un collegamento ipertestuale può essere classificato in una delle seguenti categorie:

  • Collegamento testuale
  • Collegamento immagine
  • Collegamento a un file
  • Link a un ID e-mail

Creazione di collegamenti ipertestuali di testo

La maggior parte della navigazione del sito consiste in un collegamento ipertestuale che include menu e breadcrumb. Per creare un collegamento ipertestuale è necessario utilizzare l’anchor tag HTML. Il codice di esempio per creare un collegamento di testo è il seguente:

Codice

<a href="https://www.webnots.com">A Knowledge Sharing Platform for Webmasters</a>

Href è l’attributo chiamato riferimento collegamento ipertestuale utilizzato per collegare la risorsa richiesta e la risorsa potrebbe essere una pagina Web, un file o un ID di posta elettronica. Gli utenti vedranno solo il testo di ancoraggio nel contenuto e l’URL del collegamento verrà visualizzato nell’angolo inferiore destro o sinistro del browser (o nella barra di stato in caso di Internet Explorer) quando si sposta il mouse sul testo di ancoraggio come mostrato nell’immagine sottostante.

Impara le basi dei collegamenti ipertestuali

Esempio di collegamento testuale

Link immagine

Simile ai collegamenti di testo, puoi collegare le immagini per navigare in qualsiasi altra pagina Web e di seguito è riportato il codice di esempio per collegare un’immagine a una pagina Web.

Come appare

Impara le basi dei collegamenti ipertestuali

Invio al motore di ricerca

Il testo alternativo è un elemento importante nelle immagini che verrà utilizzato dai motori di ricerca per comprendere le immagini. I browser Web visualizzeranno il testo alternativo nel caso in cui l’immagine non sia supportata.

Collegamento a un file

Un altro uso importante del collegamento è quello di collegare un testo o un’immagine a un file caricato nel server web. Ad esempio, di seguito è riportato il codice di esempio utilizzato con il tag del pulsante HTML per creare un collegamento di testo che scaricherà un file PDF.

Codice

<button> <a href="https://img.webnots.com/2014/05/Submit-Site-to-Search-Engines.pdf"> Download Site Submission Guide for Search Engines</a> </button>

Collegamento a un ID e-mail

Un ID e-mail può anche essere collegato a un testo o a un’immagine per consentire all’utente di inviare posta facendo clic sul testo o sull’immagine. Di seguito è riportato il codice di esempio per collegare un ID e-mail a un testo. Facendo clic sul testo di ancoraggio si aprirà il programma di posta elettronica predefinito sul computer con l’ID e-mail di riferimento del collegamento ipertestuale menzionato nell’indirizzo "A".

Codice

<a href="mailto:contact@webnots.com">Contact Us</a>

Colori predefiniti dei collegamenti ipertestuali

I collegamenti ipertestuali per impostazione predefinita vengono visualizzati nei seguenti colori:

Collegamento Colore
Link non visitato Blu
Link visitato Viola
Collegamento attivo rosso

Tutte le proprietà dei collegamenti possono essere modificate direttamente nel contenuto HTML di qualsiasi pagina Web particolare o modificate utilizzando CSS per riflettere tutte le tue pagine.

La pagina che stai collegando per impostazione predefinita si apre nella stessa finestra che può essere modificata per aprirsi in una nuova finestra utilizzando l’attributo di destinazione come mostrato di seguito:

<a href="https://www.webnots.com" target="_blank"> A Knowledge Sharing Platform for Webmasters </a>

Fonte di registrazione: www.webnots.com
Lascia una risposta

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More