Ad esempio, forse il tuo sito web \u00e8 cos\u00ec ben progettato che gli utenti ottengono rapidamente le informazioni di cui hanno bisogno e se ne vanno. Questo conta ancora come un rimbalzo. <\/p>\n\n
Ma troppi rimbalzi potrebbero anche indicare un sito web mal strutturato, quindi \u00e8 una buona idea migliorare il pi\u00f9 possibile questa metrica.<\/p>\n\n
Migliorare l’esperienza utente<\/a> (UX) \u00e8 un modo infallibile per ridurre la frequenza di rimbalzo e l’aggiunta di link di ancoraggio \u00e8 un modo sorprendentemente efficace per farlo.<\/p>\n\n Prima di parlare di pi\u00f9 sui link di ancoraggio, dobbiamo esaminare cos’\u00e8 un collegamento ipertestuale.<\/p>\n\n Probabilmente conosci gi\u00e0 questi link: testo colorato o sottolineato che, se cliccato, ti trasporta su un’altra pagina web. Questi si differenziano per i link interni<\/a>, che rimandano allo stesso sito web, e per i link esterni, che rimandano a un sito web separato. <\/p>\n\n L’anatomia di un collegamento ipertestuale include il testo visibile, noto come testo di ancoraggio, e l’URL (Uniform Resource Locator<\/a> ) a cui si collega. Ad esempio, nella frase “visita Bluehost<\/a> per un web hosting veloce”, la frase sottolineata “visita Bluehost” \u00e8 il testo di ancoraggio. <\/p>\n\n In HyperText Markup Language (HTML), quel collegamento ipertestuale sarebbe simile al seguente:<\/p>\n\n <a href=”https:\/\/www.bluehost.com\/”>visita Bluehost<\/a> <\/strong><\/p>\n\n I link di ancoraggio, spesso chiamati salti di pagina o link di salto, possono aiutare gli utenti a navigare rapidamente in una pagina. A differenza dei link interni ed esterni, i link di ancoraggio ti mantengono sulla stessa pagina mentre ti spostano in una sezione specifica. <\/p>\n\n L’anatomia di un collegamento di ancoraggio \u00e8 molto simile a quella di un tipico collegamento ipertestuale. Anche se in seguito approfondiremo come creare manualmente un link di ancoraggio, ecco un esempio di link di ancoraggio in azione dal nostro articolo su come strutturare un sito web<\/a>: <\/p>\n\n Dopo aver fatto clic su un collegamento nell’indice, passerai direttamente a quella sezione della pagina e vedrai cambiare l’URL nella barra degli indirizzi. In questo esempio, facendo clic sul link di ancoraggio “Che cos’\u00e8 la struttura del sito web” si cambia l’URL da https:\/\/www.bluehost.com\/blog\/website-structuring a https:\/\/www.bluehost.com\/blog\/website-structuring\/#What-Website-Structure-Is. <\/p>\n\n L’inclusione di link di ancoraggio negli articoli e nelle pagine \u00e8 una piccola modifica, ma pu\u00f2 avere un impatto significativo. Ecco solo alcuni dei vantaggi: <\/p>\n\n In breve, i link di ancoraggio aumentano il coinvolgimento e la soddisfazione degli utenti, portando potenzialmente a pi\u00f9 tempo trascorso a navigare sul tuo sito web e a una frequenza di rimbalzo ridotta.<\/p><\/blockquote><\/figure>\n\n Hai bisogno di aiuto per determinare dove posizionare i link di ancoraggio sul tuo sito web? Ecco alcune idee: <\/p>\n\n Sebbene i link di ancoraggio siano utili, \u00e8 necessario implementarli correttamente o si rischia di avere un impatto su UX, SEO e accessibilit\u00e0. Fai attenzione a questi potenziali problemi: <\/p>\n\n Fortunatamente, molti di questi problemi hanno soluzioni facili. Tienili a mente quando aggiungi link di ancoraggio al tuo sito web. <\/p>\n\n Esistono diversi modi per aggiungere link di ancoraggio in WordPress, dalla creazione manuale con HTML al semplice utilizzo degli editor integrati. Ecco diversi tutorial per guidarti attraverso di esso. <\/p>\n\n Per prima cosa, creiamo un link di ancoraggio utilizzando l’editor a blocchi di Gutenberg, passo dopo passo.<\/p>\n\n Pu\u00f2 trattarsi di un’intestazione, di un blocco di paragrafo, di un’immagine o di qualsiasi altra cosa.<\/p>\n\n Puoi trovare la scheda Impostazioni<\/strong> nell’angolo in alto a destra e il menu a discesa Avanzate<\/strong> nel pannello aperto.<\/p>\n\n Questo sar\u00e0 nella scheda Avanzate. Se non lo vedi, prova un tipo di blocco diverso, come un’intestazione. <\/p>\n\n Digita un nome nella casella di ancoraggio HTML, assicurandoti che sia univoco rispetto a qualsiasi altro ancoraggio della pagina. Puoi anche usare alcuni simboli, come trattini e punti. Ricorda che questo apparir\u00e0 nell’URL quando si fa clic sul link di ancoraggio. <\/p>\n\n Per fare ci\u00f2, aggiungi il testo, l’immagine o il pulsante che diventer\u00e0 il tuo link di salto cliccabile.<\/p>\n\n Evidenzialo, seleziona il pulsante di collegamento e digita l’ancora HTML che hai impostato in precedenza, con un hashtag davanti. Se il tag di ancoraggio era “esempio”, digita “#example”. <\/p>\n\n Provalo in un’anteprima e dovresti saltare immediatamente al punto di ancoraggio che hai impostato.<\/p>\n\n Se preferisci l’editor classico, qui \u00e8 possibile creare anche link di ancoraggio in WordPress. Il processo \u00e8 un po’ pi\u00f9 complicato ma comunque relativamente semplice. <\/p>\n\n Nell’angolo in alto a destra dell’area di modifica, vedrai due schede, Visivo<\/strong> e Testo<\/strong>. Fare clic su Testo<\/strong> per passare da un all’altro. <\/p>\n\n Trova l’elemento a cui desideri saltare. In questo esempio, stiamo utilizzando un’intestazione simile alla seguente: <\/p>\n\n Aggiungi un tag “id” con il nome desiderato per l’ancoraggio. Ecco come dovrebbe apparire: <\/p>\n\n \u00c8 possibile utilizzare questo tag ID in modo simile nella maggior parte degli attributi HTML. Ecco come apparirebbe in un paragrafo tipico. <\/p>\n\n Torna all’editor visivo<\/strong> e aggiungi l’elemento su cui gli utenti faranno clic per passare alla sezione desiderata.<\/p>\n\n Evidenzialo, seleziona il pulsante di collegamento e quindi digita l’ID di ancoraggio che hai impostato in precedenza, oltre a un hashtag. In questo esempio, digitiamo “#anchor-link-two”. <\/p>\n\n Come con l’editor Gutenberg, usa la schermata di anteprima per testarlo e assicurarti che funzioni.<\/p>\n\n Analogamente all’esempio precedente, \u00e8 possibile utilizzare l’HTML per creare direttamente un link di ancoraggio. Ecco come si fa. <\/p>\n\n Innanzitutto, assegna un nome all’ancora. Puoi farlo con il tag HTML “id”, che pu\u00f2 essere posizionato quasi ovunque. Ecco alcuni esempi:<\/p>\n\n Crea un collegamento che salter\u00e0 all’ancoraggio specificato quando fai clic. Assicurati di utilizzare un simbolo hashtag davanti all’ID. Un esempio: <\/p>\n\n Crea un collegamento che salter\u00e0 all’ancoraggio specificato quando fai clic. Assicurati di utilizzare un simbolo hashtag davanti all’ID. Un esempio: <\/p>\n\n WordPress ti consente di modificare l’HTML in varie aree del tuo sito Web e i plug-in di WordPress possono offrire ancora pi\u00f9 opzioni. Abbiamo gi\u00e0 spiegato come accedere all’HTML nell’editor classico. Ci sono alcuni altri modi. <\/p>\n\n \u00c8 possibile modificare l’HTML nell’Editor blocchi aggiungendo un blocco, selezionandolo, facendo clic sui tre punti verticali e selezionando Modifica come HTML.<\/strong><\/p>\n\n \u00c8 inoltre possibile aprire l’editor di codice facendo clic sui tre punti verticali nell’angolo in alto a destra dello schermo e scegliendo l’editor dal menu a discesa.<\/p>\n\n Infine, puoi modificare l’HTML del tema accedendo a Strumenti<\/strong> > Editor di file del tema<\/strong>, anche se non \u00e8 consigliabile modificarlo direttamente. Invece, puoi impostare un tema figlio<\/a>. <\/p>\n\n \u00c8 anche possibile aggiungere link di ancoraggio a un menu di WordPress. Questi funzioneranno proprio come qualsiasi altro collegamento di salto. L’uso di questo \u00e8 alquanto limitato, ma potresti trovarlo utile su siti Web di una pagina. <\/p>\n\n La combinazione di questo con il plug-in Conditional Menus<\/a> ti consente di creare menu con link di ancoraggio su pagine specifiche, come la tua home page o le pagine di destinazione. Ecco come configurarlo: <\/p>\n\n Consulta le istruzioni riportate sopra per sapere come creare manualmente un link di ancoraggio. Trova l’intestazione, il testo o l’immagine a cui desideri passare e aggiungi l’attributo ID di ancoraggio utilizzando HTML. <\/p>\n\n Nella dashboard di WordPress, vai a Menu Aspetto<\/strong>>. Crea un menu, quindi fai clic sul menu a discesa Link personalizzati<\/strong>. Inserisci l’ID di ancoraggio che hai creato, con un hashtag davanti, quindi fai clic su Aggiungi al menu.<\/strong><\/strong> <\/p>\n\n Ricorda, questo non funzioner\u00e0 correttamente sulle pagine senza l’ID di ancoraggio, quindi creare un menu globale come questo su un sito Web multipagina non \u00e8 una buona idea.<\/p>\n\n Una volta creato il menu, fai clic sulla scheda Gestisci posizioni <\/strong>. In una delle posizioni di menu fornite, fai clic su + Menu condizionale<\/strong>, quindi su + Condizioni<\/strong>. \u00c8 possibile impostare le condizioni in modo che il menu appaia solo su determinate pagine. <\/p>\n\n Infine, puoi installare un plug-in<\/a> se tutti i metodi di cui sopra richiedono troppo tempo.<\/p>\n\n Molti plugin possono aiutarti a creare link di ancoraggio, inclusi i link di ritorno all’inizio, ma evidenziamo uno dei migliori: Easy Table of Contents<\/a>.<\/p>\n\n Questo plugin funziona con Gutenberg, l’editor classico e persino i page builder. Puoi inserire manualmente i sommari o configurarli in modo che li inserisca automaticamente in ogni post e pagina del blog. <\/p>\n\n Ora che sai come creare link di ancoraggio in WordPress, segui questi suggerimenti per implementarli bene.<\/p>\n\n Quando implementi i link di ancoraggio, inseriscili nelle pagine corrette. Che si tratti di un sommario o di un modo per sfogliare rapidamente le domande frequenti, dai la priorit\u00e0 all’UX prima di tutto. <\/p>\n\n Quando implementi i link di ancoraggio, inseriscili nelle pagine corrette. Che si tratti di un sommario o di un modo per sfogliare rapidamente le domande frequenti, dai la priorit\u00e0 all’UX prima di tutto. <\/p><\/blockquote><\/figure>\n\n Inoltre, considera l’esperienza utente su tutti i dispositivi e dove i collegamenti di ancoraggio potrebbero avvantaggiare gli utenti mobili. Qualcosa che si adatta bene al monitor di un computer pu\u00f2 sembrare molto pi\u00f9 opprimente su un telefono. <\/p>\n\n L’anchor text \u00e8 importante qui come per qualsiasi link interno o esterno. Un buon anchor text migliorer\u00e0 la SEO<\/a> aiutando i motori di ricerca a classificare la struttura della tua pagina e mantenendo le cose intuitive per i visitatori.<\/p>\n\n Usa una formulazione chiara e diretta in modo che gli utenti sappiano esattamente dove li porter\u00e0 un link di salto. Ad esempio, se stai utilizzando un sommario, usa una dicitura identica alle intestazioni a cui ogni link ti salta. Evita parole generiche come “clicca qui”. <\/p>\n\n Mantieni un layout strutturato utilizzando i link di ancoraggio per organizzare i tuoi contenuti. Resisti alla tentazione di abusare dei link di ancoraggio su pagine che non ne hanno bisogno o di utilizzare troppi link di ancoraggio su una pagina. Di solito sono sufficienti un singolo sommario e un link di ritorno all’inizio. <\/p>\n\n Inoltre, assicurati che i tuoi link di ancoraggio non si aprano in una nuova scheda, il che \u00e8 controproducente.<\/p>\n\n Testa regolarmente i tuoi link di ancoraggio, soprattutto dopo aver aggiornato i contenuti o modificato le intestazioni. Prova i link di ancoraggio su pi\u00f9 dispositivi e browser, inclusi gli screen reader. <\/p>\n\n Considera l’UX generale qui. Lo schermo sembra angusto o disordinato dopo lo scorrimento? Hai bisogno di pi\u00f9 spazi bianchi? Il testo \u00e8 nascosto sotto l’intestazione superiore adesiva? <\/p>\n\n Distingui i link di ancoraggio dai link interni o esterni attraverso l’etichettatura o lo stile. Prendi in considerazione l’impostazione di link di ancoraggio “appiccicosi” che seguono gli utenti mentre scorrono piuttosto che quelli nel contenuto stesso o la creazione di fisarmoniche che nascondono ordinatamente il tuo indice sotto un elemento cliccabile. <\/p>\n\n Nel complesso, chiarisci che questi collegamenti di salto aiutano l’utente a navigare nella pagina.<\/p>\n\n Migliorare l’UX \u00e8 sempre un buon obiettivo. Gli utenti soddisfatti rimangono pi\u00f9 a lungo, navigano pi\u00f9 pagine e, in definitiva, hanno maggiori probabilit\u00e0 di diventare clienti fedeli. <\/p>\n\n I link di ancoraggio, anche se una caratteristica minore, possono avere un impatto significativo. Questo \u00e8 solo un piccolo ma efficace modo per migliorare l’UX del tuo sito Web WordPress. <\/p>\n\n Un altro modo per migliorare l’esperienza utente \u00e8 utilizzare un provider di hosting pi\u00f9 veloce in modo che le pagine a caricamento lento non facciano s\u00ec che i visitatori facciano clic su di esso.<\/p>\n\n Bluehost offre un hosting WordPress conveniente<\/a> che include una rete di distribuzione dei contenuti<\/a> (CDN) Cloudflare per prestazioni e velocit\u00e0 massime. Offriamo anche una configurazione rapida e semplice e un’assistenza 24 ore su 24, 7 giorni su 7, in modo da avere sempre accesso all’assistenza quando ne hai bisogno. <\/p>\n","protected":false},"excerpt":{"rendered":" In qualit\u00e0 di imprenditore, sei sempre alla ricerca di modi per migliorare la soddisfazione degli utenti sul tuo sito Web WordPress. La prossima metrica nel mirino: la frequenza di rimbalzo. Un’elevata frequenza di rimbalzo potrebbe non essere un motivo di panico. La frequenza media di rimbalzo \u00e8 di circa il 50,9%, a seconda del settore. […]<\/p>\n","protected":false},"author":50,"featured_media":142341,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_yoast_wpseo_title":"Come Creare Link di Ancoraggio in WordPress (5 Modi) | Ospite blu","_yoast_wpseo_metadesc":"Cerchi un modo rapido per migliorare l'esperienza dell'utente? Ci vuole solo un minuto per imparare a creare link di ancoraggio in WordPress e aiutano molto i visitatori.","inline_featured_image":false,"footnotes":""},"categories":[1781,1774],"tags":[3583,3596,3599,3606,3609],"ppma_author":[588],"class_list":["post-142329","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-alessio","category-valentina","tag-cms","tag-guide-pratiche","tag-navigazione","tag-suggerimenti-e-trucchi","tag-tutorial"],"acf":[],"yoast_head":"\nChe cos’\u00e8 un collegamento ipertestuale?<\/h2>\n\n
![\"I](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Hyperlink-Anatomy.png\")
<\/figure>\n\nChe cos’\u00e8 un link di ancoraggio?<\/h2>\n\n
![\"Un](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Sample-Anchor-Link.png\")
<\/figure>\n\nPerch\u00e9 dovresti usare i link di ancoraggio<\/h2>\n\n
\n
![\"I](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Anchor-Links-in-Google-SERPs.png\")
<\/figure>\n\n\n
Quando dovresti usare i link di ancoraggio<\/h3>\n\n
\n
Sfide dell’utilizzo dei link di ancoraggio<\/h3>\n\n
\n
Come creare link di ancoraggio in WordPress<\/h2>\n\n
Crea link di ancoraggio nell’editor a blocchi di Gutenberg<\/h3>\n\n
Passaggio 1: aggiungi il blocco a cui vuoi saltare<\/h4>\n\n
![\"Puoi](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Wordpress-Anchor-ID-Attributes.png\")
<\/figure>\n\nPassaggio 2: apri la scheda Impostazioni e fai clic sul menu a discesa Avanzate<\/h4>\n\n
Passaggio 3: trova la casella di input Ancoraggio HTML<\/h4>\n\n
Passaggio 4: collega il tuo ancoraggio<\/h4>\n\n
![\"Puoi](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Block-Editor-Anchor-Links.png\")
<\/figure>\n\nAggiungere collegamenti di ancoraggio nell’editor classico<\/h3>\n\n
Passaggio 1: passa all’editor di testo<\/h4>\n\n
Passaggio 2: Aggiungere l’ID di ancoraggio<\/h4>\n\n
<h2>Anchor Link 2<\/h2> <\/strong><\/code><\/pre>\n\n<h2 id=\"anchor-link-two\">Anchor Link 2<\/h2> <\/strong><\/code><\/pre>\n\n![\"Dovrai](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Classic-Editor-Anchor-ID-Tag.png\")
<\/figure>\n\n<p id=\"anchor-link-two\">Anchor Link 2<\/p> <\/strong><\/code><\/pre>\n\nPassaggio 3: collega il tuo ancoraggio<\/h4>\n\n
![\"L'aggiunta](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Add-Anchor-Tag-Classic-Editor.png\")
<\/figure>\n\nCreare manualmente i link di ancoraggio con HTML<\/h3>\n\n
Passaggio 1: crea un tag di ancoraggio<\/h4>\n\n
\u2022 <a id=\"anchor-example\"><\/a>\n\u2022 <h1 id=\"anchor-example\">Heading example<\/h1>\n\u2022 <p id=\"anchor-example\">Example text.<\/p>\n\u2022 <span id=\"anchor-example\"><\/span><\/strong><\/code><\/pre>\n\nPassaggio 2: collegamento al tag di ancoraggio<\/h4>\n\n
<a href=\"#anchor-example\">Example link.<\/a> <\/strong><\/code><\/pre>\n\nPassaggio 2: collegamento al tag di ancoraggio<\/h4>\n\n
<a href=\"#anchor-example\">Example link.<\/a><\/strong><\/code><\/pre>\n\nPassaggio 3. Inserisci il codice HTML <\/h4>\n\n
![\"È](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Anchor-ID-HTML-Edit.png\")
<\/figure>\n\n![\"È](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Access-Code-Editor.png\")
<\/figure>\n\nAggiungere link di ancoraggio a una voce di menu di WordPress<\/h3>\n\n
Passaggio 1. Creare un ID di ancoraggio <\/h4>\n\n
Passaggio 2. Aggiungi link di ancoraggio al menu<\/h4>\n\n
![\"Anche](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Menu-Items-Anchor-Links.png\")
<\/figure>\n\nPassaggio 3. Imposta le condizioni <\/h4>\n\n
![\"Impostando](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Setting-Menu-Conditions.png\")
<\/figure>\n\nUsa un plugin di WordPress per aggiungere link di ancoraggio<\/h3>\n\n
![\"Il](\"https:\/\/www.bluehost.com\/it-it\/blog\/wp-content\/uploads\/2024\/02\/Easy-Table-of-Contents-Plugin.png\")
<\/figure>\n\nBest practice per i link di ancoraggio<\/h2>\n\n
Posiziona i link di ancoraggio in modo strategico<\/h3>\n\n
Utilizzare l’anchor text corretto<\/h3>\n\n
Evita il disordine<\/h3>\n\n
Metti alla prova i tuoi link di ancoraggio<\/h3>\n\n
Stile ai tuoi link di ancoraggio<\/h3>\n\n
Considerazioni finali: come creare link di ancoraggio in WordPress<\/h2>\n\n