Cosa è una sitemap ?

Una mappa del sito ( sitemap ) è un file che elenca tutte le pagine importanti del tuo sito web che desideri vengano indicizzate dai motori di ricerca come Google e Bing.

L’indicizzazione è al modo in cui i motori di ricerca raccolgono le tue pagine di destinazione e le memorizzano nei loro database.

Questi dai poi, vengono utilizzati per rispondere alle domande degli utenti.

Se una pagina non è indicizzata, non può essere trovata e non verrà classificata nei risultati dei motori di ricerca.

Una sitemap del sito non è solo un elenco delle pagine del tuo sito web.

Infatti una sitemap, contiene informazioni su ciascuna pagina.

Ad esempio quando è stata creata e aggiornata l’ultima volta e la sua importanza rispetto alle altre pagine del sito

Come crearne una per il tuo sito web

Se hai un sito custom e non hai un CMS come WordPress, potresti utilizzare alcuni strumenti online.

Molti strumenti creano una scansione del tuo sito rilasciandoti il file pronto da poter condividere con Google, chiamato “sitemap.xml” .

Ti basterà una volta scaricato il file, caricarlo sul tuo progetto e poi condividere l’url della pagina “sitemap.xlm” con il motore di ricerca .

Uno dei siti che utilizzo per la creazione del file infatti si chiama xml-sitemap . In pochi minuti riuscirai , a scaricare la mappa del tuo sito web .

Se invece utilizzi un sito creato WordPress, potresti utilizzare il plugin Yoast SEO , che è uno degli strumenti migliori che può aiutarti a far si che il tuo sito sia idoneo per una buona SEO .

Utilizzando il plugin ti basta semplicemente cliccare su “SEO” dal menu della tua Bacheca di WordPress, dopodiché cliccare su funzionalità, fai uno scroll fino alla foce “SITEMAPS” e clicca il punto interrogativo per poi cliccare “Vedi la mappa XML del sito” .

Cliccato il link, ti basterà semplicemnte copiare l’url, per poi incollarlo all’interno della sezione sitemap di Google Search Console :

È stato utile questo articolo ?

Lasciamo un commento

L'articolo Creare la sitemap del sito web proviene da Alessandro Albergo.

Un’immagine sul tuo sito web potrebbe diventare popolare e le persone potrebbero iniziare a raggiungere la tua pagina dei media direttamente dalla ricerca di Google.

Ma potrebbe capitare che chi clicca la tua immagine sui motori di ricerca venga reindirizzato sulla tua pagina dei media e non sulla pagina del post di WordPress che contiene quell’immagine.

Se quello che cerchi è un modo che ti permetta di far raggiungere le tue pagine e nascondere la tua pagina dei media, allora sei nel posto giusto !

Come disabilitare la tua pagina dei media sul tuo WordPress

Il modo più semplice è aggiungere uno snippet di codice sul nostro tema di WordPress che ti permetta di creare un redirect sulla pagina che contiene l’immagine o una galleria di immagini trovate su Google.

Creiamo un nuovo file nella cartella del tuo tema in uso di WordPress utilizzando un FTP manager come FileZilla.

Rinominiamo il file con il nome ” image.php “.

PS: Se il tuo tema ha già un file ” image.php” dovrai semplicemente modificarlo.

Dopodiché, tutto ciò che devi fare è aggiungere il seguente codice come prima riga nel file appena creato :

<?php wp_redirect(get_permalink($post->post_parent)); ?>

Adesso non ti resta che salvare il file modificato.

Ora, quando un utente trova un’immagine del tuo sito su Google, cliccandoci sopra verrà reindirizzato al post principale che la contiene.

È stato utile questo articolo ?

Lasciami un commento

L'articolo Pagina dei media WordPress proviene da Alessandro Albergo.

Ci sono tantissimi plugins sullo store di WordPress che potresti installare, ma oggi ho creato una lista di 4 plugins che uso in ogni progetto e che secondo me dovrebbero essere presenti in ogni sito WordPress.

Plugin che secondo me devi assolutamente avere su WordPress

Wp Fastest Cache – Plugin da avere su WordPress

Il primo in assoluto che consiglio è il Plugin per la cache . Ce ne sono tanti ma utilizzo di solito WP Fastest Cache . Se hai bisogno di un tutorial per l’utilizzo puoi vedere il  mio articolo su “Come velocizzare WordPress” .

Smush

Smush è un ottimo plugin che ci aiuta a velocizzare il nostro sito, comprimendo e ottimizzando le immagini. Anche per questo strumento molto utile, puoi vedere il tutorial nel mio articolo “Come velocizzare WordPress” .

Yoast SEO

Uno dei miglior plugin per la SEO del nostro sito WordPress è  Yoast SEO:

Che tu abbia un blog, sito vetrina o e-commerce , questo plugin non deve mancare nel tuo sito WordPress. È uno strumento molto utile che ci permette di verificare l’indicizzazione del nostro sito web.

Caratteristiche

Punteggio base SEO su ogni pagina e articolo del tuo sito.
Generatore di XML sitemap che potrai condividere su Google.
Supporto per Facebook.
Impostazioni di RSS.
Modifica titoli e descrizioni in blocco.
Può modificare il file .htaccess e file robots.txt.
Impostazioni di importazione ed esportazione.
Regolazioni dei permalink ed eventuali rotture di link interni ed esterni con auto-redirect.

Prezzo: Gratis ma c’è anche la versione premium disponibile con  molte più funzioni.

Contact Form 7

Contact Form 7 è un plugin per la creazione dei form di contatto, devi averne uno sul tuo sito se hai intenzione di essere contattato dagli utenti.

Questo strumento è il numero 1 dei plugins e ha la possibilità di integrare i sistemi per lo spam :

Se vuoi capire perché dovresti avere un form di contatto ed hai bisogno di un tutorial rapido su come utilizzarlo, vedi il mio articolo “Form di contatto per WordPress” .

È stato utili questo articolo ?

L'articolo I plugin che non devono mancare sul tuo WordPress proviene da Alessandro Albergo.

Cosa è la barra di progressione lettura ?

È semplicemente una barra di caricamento che trovi di solito in alto o in basso ad un articolo o pagina, che aumenta con l’avanzamento della lettura ( scroll ).

Proprio come quella che vedi su questo articolo in alto!

Perché dovrei averne una ?

In realtà non è niente di obbligatorio, ma una barra di progressione per la lettura, è un piccolo aiuto e un invito a scorrere la pagina fino in fondo e motiva il visitatore a leggere l’articolo fino in fondo.

Quindi oltre ad essere un’animazione carina, è anche un incentivo per l’utente a leggere tutto l’articolo e quindi restare più tempo sul sito web.

Sapevi che i visitatori di un sito impiegano solo un paio di secondi per decidere se rimanere sul sito o abbandonarlo ? È difficile mantenere alto l’interesse del lettore e catturare la sua attenzione, specialmente se si tratta di articoli lunghi.

Bene, quindi adesso che sappiamo i vantaggi di una barra di progressione lettura, possiamo scoprire come crearne una per il nostro sito web.

Barra di progressione lettura in codice

Qui ti spiegherò come creare la progress bar lettura in codice da inserire sul tuo sito web, se tu dovessi avere un sito in wordpress, potrai saltare questa parte e vedere il prossimo tutorial e i plugin da scaricare.

Vediamo subito il codice da inserire per il nostro sito web:

Il primo codice sarà in HTML e sarà semplicemente un”<div>” con una classe e un “ID” che sarà richiamato dal codice in Javascript

<div class="progressbarlettura" id="progressbarlettura"></div>

Come vedi sia la classe e sia l’ID hanno lo stesso nome per convenzione e per rendere tutto più semplice.

Supponiamo che hai un tag “article” dove all’interno hai tanti TAG  “p” e “h1 ” , bene ora quello che dobbiamo fare, sarà inserire quel codice HTML subito prima del TAG article, come in questo esempio:

<div class="progressbarlettura" id="progressbarlettura"></div>

<article>
	<h1>Titolo Articolo</h1>
	<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic doloribus nisi repellat officia voluptas, cum praesentium, temporibus distinctio quos. Facilis suscipit, consectetur labore optio quia beatae magni dolores iusto alias iste, in repellat adipisci aliquid cumque earum asperiores. Eligendi sint aperiam facilis quos</p>
</article>

Ora creiamo il foglio di stile CSS , e inseriamo il codice per la nostra progress bar :

.progressbarlettura {
    background: yellow;
    position: fixed;
    top: 0;
    bottom: auto;
    left: 0;
    width: 0%;
    height: 5px;
    z-index: 1000;
}

Come vedi il codice, creerà la Barra di progressione lettura di colore giallo, puoi cambiare colore inserendo il “codice colore” al posto di “yellow”.

Vediamo il codice in Javascrip da incorporare nel nostro sito web:

let prog = document.getElementById('progressbarlettura');

let body = document.body,
    html = document.documentElement;

let height = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight);

const setProgress = () => {
   let scrollFromTop = (document.documentElement.scrollTop || body.scrollTop) + html.clientHeight;
   let width = scrollFromTop / height * 100 + '%';

   console.log('scroll', html.clientHeight, body.scrollTop);

   prog.style.width = width;
}

window.addEventListener('scroll', setProgress);

setProgress();

Bene, adesso che avrai importato tutto, potrai vedere la tua barra di progressione lettura visibile e animata durante lo scorrimento del tuo articolo !

Barra di progressione lettura con WordPress

Vediamo come poter avere la nostra barra di progressione lettura in maniere davvero semplice, con l’utilizzo dei plugin per WordPress.

Il primo plugin che possiamo utilizzare è Worth the Read mentre il secondo è Reading Progressbar .

Possiamo utilizzare uno dei 2, sono davvero molto simili ed è possibile modificare il colore e lo stile della barra di caricamento in entrambi.

Se dovessi installare Worth the Read, troverai una volta attivato il plugin, la voce nel menù della tua Daschboard altrimenti con Reading Progressbar verrà aggiunta la voce nel menù delle impostazioni della Dashboard.

Worth The Road :

Reading Progressbar :

Forse Worth the Read è più completo, ma in realtà io punterei più su una scelta di compatibilità.

Prova ad installare uno dei due, se non ci dovessero essere errori e riesci a visualizzare tutte le immagini nei tuoi articoli, allora potrai tenerlo installato, altrimenti potrai utilizzare l’altro .

Che ne pensi ? È stato utile questo articolo ?

Lasciamo un commento se non vai troppo di fretta

L'articolo Barra di progressione lettura Articolo e pagina web proviene da Alessandro Albergo.

Cosa è la Favicon di un sito web ?

La Favicon, è quel logo che vedi sulla tab del tuo browser quando navighi su un sito web :

Perchè dovresti averne una ?

Perchè le favicon non sono direttamente responsabili dell’ottimizzazione dei motori di ricerca; tuttavia sono indirettamente responsabili perché sono uno strumento importante per migliorare il posizionamento sui motori di ricerca. Una favicon ( icona ) ti offre un vantaggio rispetto ad un sito web che non ne utilizza una.

Quindi ora che abbiamo capito l’importanza, vediamo subito come procedere per poterne creare una in maniere semplice:

Come primo passo, procurati il tuo logo, e ridimensionalo con le dimensioni 32×32 px (dimensione consigliata ).

Ora inserisci la favicon  “logo.png” (il nome non è importante) in una nuova cartella (che chiameremo IMG per convenzione) all’interno del progetto del tuo sito.

Adesso andiamo ad inserire nel tag “<head></head>” del tuo sito (che di solito è la prima parte che dovresti trovare nel codice ) la seguente stringa:

<link rel="icon" type="image/png" href="/IMG/logo.png">

Bene adesso ricaricando la pagina dovresti vedere la tua icona su ogni tab che raffiguri il tuo sito web.

Invece come inserisco la Favicon per il sito web in WordPress ?

Niente di più facile! Andiamo sul nostro sito in WordPress , effettuiamo l’accesso e cliccando personalizza, vedremo la voce denominazione del sito all’interno del menù, che ci permetterà di impostare la nostra favicon .

Ora non ti resta che caricare il logo da te creato e ridimensionarlo nel passaggio successivo (se dovesse esserci il bisogno) con WordPress .

Come vedi per WordPress è davvero molto facile! Ora potrai impostare la tua icona personalizzata sul tuo sito web!

È stato utile l’articolo?

Lasciamo un commento per farmelo sapere

L'articolo Aggiungere Favicon (icona – logo) sul sito web proviene da Alessandro Albergo.