Skip links

Footer

Definizione

Il piè di pagina è la parte inferiore di una pagina. In HTML, questa sezione è espressa dal tag < footer >, che contiene tutti gli elementi che dovrebbero essere presenti. Di norma, il piè di pagina è lo stesso su ogni pagina di un sito web. È quindi incluso nel modello di pagina per consentirne la moltiplicazione in tutto il sito. Inoltre, poiché il footer è l’ultimo elemento di una pagina consultata, è importante ottimizzarlo per renderlo attraente e interessante.

In concreto, il footer di un sito può contenere: testo ottimizzato per la SEO con parole chiave strategiche, informazioni di contatto dell’azienda (indirizzo, recapiti), la mappa del sito, le note legali del sito, i link interni alle pagine del sito (contatti, chi siamo, ecc.), i link di navigazione secondaria, i vostri social network, ecc.

SEO Technique

Qual è lo scopo del footer nella SEO?

Dal punto di vista SEO, il footer è una sezione strategica su cui lavorare. Infatti, consente di apportare valore al sito offrendo contenuti di pagine più approfondite, link esterni e informazioni aggiuntive che possono interessare i visitatori.

Inoltre, il piè di pagina consente di rafforzare la vostra rete di collegamenti interni puntando a contenuti profondi non direttamente accessibili dal primo livello del menu principale. La creazione di un piè di pagina sul vostro sito web non è obbligatoria, ma è fortemente consigliata se volete ottimizzare il vostro posizionamento organico.

Il piè di pagina consente di arricchire il contenuto del sito con informazioni aggiuntive che non si desidera far apparire direttamente nel menu principale. Quando si crea un sito, il piè di pagina non è predefinito. È quindi necessario ottimizzarlo con i contenuti che si ritengono rilevanti.

Lavorare sul footer per renderlo attraente

Il footer, come le vostre pagine, deve essere ben studiato per attirare i vostri visitatori e incoraggiarli a scorrere i contenuti presentati. A tal fine, è importante presentare un footer chiaro e non sovraccaricarlo di informazioni. Questo potrebbe scoraggiare il visitatore.

Inoltre, l’obiettivo del footer è quello di offrire contenuti interessanti, quindi deve essere scelto con cura. L’obiettivo è quello di fornire informazioni aggiuntive ai visitatori per migliorare le prestazioni. In particolare, è possibile includere una call to action per incoraggiare l’azione: compilare un modulo, effettuare un ordine, contattare, iscriversi alla newsletter. Potete anche mettere in evidenza i vostri social network integrando icone accattivanti per mantenere il visitatore nel vostro ambiente.

Avrete capito che il footer è una parte strategica del vostro sito web da ottimizzare.

Alcune buone pratiche per il footer

La parte inferiore di una pagina è destinata ai visitatori ma anche ai motori di ricerca. Da un punto di vista SEO, le informazioni fornite contribuiscono a ottimizzare il referenziamento naturale del sito. In secondo luogo, l’obiettivo è anche quello di offrire più contenuti ai visitatori per migliorare l’esperienza dell’utente (UX). In genere, i contenuti presenti nel footer non compaiono nella barra di navigazione principale.

Ecco i diversi elementi che potreste voler includere nel vostro footer.

Informazioni legali sul sito

Quando si lancia un sito web, è obbligatorio scriverne la nota legale. Non è una pagina molto interessante per l’utente, ma è essenziale dal punto di vista legale. È quindi strategico inserire un link a questa pagina nel footer per non darle troppa importanza, pur facendola apparire sul sito.

Se operate nel settore dell’e-commerce, dovreste includere nel vostro sito anche i termini e le condizioni di vendita e di utilizzo. In genere, queste condizioni vengono visualizzate al momento dell’acquisto da parte dell’utente, ma può anche essere interessante includerle nel footer in modo che siano accessibili prima di qualsiasi acquisto.

Infine, gli ultimi elementi legali da includere nel footer sono i crediti e il copyright. Questo informa l’utente sul creatore e sul proprietario del sito web, oltre che sull’anno di pubblicazione.

L'informativa sulla privacy

Informare i clienti sulla propria politica di privacy e trattamento dei dati è un requisito legale per qualsiasi azienda. Dovreste quindi inserire queste informazioni nel vostro sito web. E perché non nel footer? Questo vi permetterà di essere completamente trasparenti con i vostri utenti e di rispettare gli obblighi di legge.

Inoltre, è obbligatorio includere la vostra politica sui cookie nel vostro sito web, se li utilizzate. Inseritelo nel footer per informare i visitatori non appena arrivano sul vostro sito.

Una call-to-action

Le call-to-action possono aumentare notevolmente il tasso di conversione. Infatti, come indica il loro nome, questi elementi incoraggiano i visitatori di un sito a compiere un’azione, generalmente l’acquisto di un prodotto o di un servizio.

Utilizzate elementi ingiuntivi, come “clicca qui”, “richiedi il tuo preventivo”, “prendi un appuntamento”, ecc. Si tratta di inserire un elemento coinvolgente nel footer, per incoraggiare l’utente a proseguire nella ricerca.

Categorie e link ad un blog

Nel contesto di un’attività di e-commerce, è interessante inserire nel footer i link alle diverse categorie di prodotti per reindirizzare il cliente alle pagine dei prodotti e generare così lead.

Inoltre, potete inserire un link a un blog, per educare i vostri potenziali clienti e fornire agli utenti contenuti informativi di qualità, aumentando così la vostra credibilità ai loro occhi.

Aiuti alla navigazione

Il piè di pagina è spesso utilizzato per facilitare la navigazione degli utenti, indicando chiaramente la gerarchia del sito. Tuttavia, è importante non copiare e incollare il proprio menu. In generale, infatti, gli utenti si dirigono verso il footer se non hanno trovato ciò che cercavano nel menu superiore. Per offrire un footer ben ottimizzato in termini di SEO e UX, inserite le query SEO, ossia le parole chiave che gli utenti digitano nella barra di ricerca prima di arrivare al vostro sito, e rimandateli alle vostre pagine importanti.

Contatti, newsletter e social network

Infine, inserite nel footer le informazioni di contatto della vostra azienda: numero di telefono, indirizzo e-mail. Potete aggiungere queste informazioni sotto forma di modulo di contatto, per facilitare i contatti e incoraggiare gli utenti a contattarvi. Potete anche inserire un link alla vostra pagina “Chi siamo” per dare ai vostri clienti maggiori informazioni. Infine, è una buona idea includere nel footer un link che permetta agli utenti di iscriversi alla vostra newsletter.

Oggi la comunicazione avviene sempre più spesso attraverso i social network. È quindi strategico inserire un link alle proprie reti nel footer, per offrire un mezzo alternativo di contatto e informazione agli utenti di Internet.

Per le aziende che desiderano lavorare sul loro referenziamento locale, aggiungete una mappa di Google nel footer.

Come creare un footer in HTML/CSS?

È possibile codificare il piè di pagina utilizzando HTML e CSS. Qui di seguito troverete un codice HTML, e il relativo CSS, che vi permetterà di creare un piè di pagina bianco di base, composto da tre colonne allineate l’una all’altra. Sta a voi divertirvi a modificare gli sfondi, i caratteri, ecc. per creare un piè di pagina che si adatti completamente ai vostri desideri!

Codice HTML

				
					<!DOCTYPE html>
<html>
<body>

      <footer>

        <div class=”contenu-footer”>

            <div class=”bloc footer-services”>
              <h3>Nos services</h3>
              <ul class=”liste-services”>
                <li><a href=”#”>Création de sites web</a></li>
                <li><a href=”#”>SEO</a></li>
                <li><a href=”#”>SEA</a></li>
              </ul>
            </div>

          <div class=”bloc footer-informations”>
            <h3>A propos</h3>
            <ul class=”liste-informations”>
              <li><a href=”#”>Actualités</a></li>
              <li><a href=”#”>Notre histoire</a></li>
              <li><a href=”#”>Investisseurs</a></li>
              <li><a href=”#”>Développement durable</a></li>
            </ul>
          </div>

          <div class=”bloc footer-contact”>
            <h3>Restons en contact</h3>
            <p>06 06 06 06 06</p>
            <p>supportclient@contact.com</p>
            <p>12 rue de l'invention, Paris, 75011</p>
          </div>

        <p class="copyright">Company Name © 2022</p>
    
 </div>

  </footer>

</body>
</html>
				
			

Codice CSS

				
					body {
  background: #f1f1f1;
  font-family: Arial, Helvetica, sans-serif;
  height: 100vh;
  display: flex;
  flex-direction: column;
}

h1 {
  font-size: 10vw;
  text-align: center;
  margin-top: 20px;
  color: #333;
}

.contenu {
  /* grow shrink basis */
  flex: 1 0 auto;
}

.contenu p {
  padding: 5vw 10vw;
  text-align: justify;
}

footer {
  flex-shrink: 0;
  border-top: 1px dashed #000;
  width: 100%;
  background: #ffff;
  color: #333;
}

.contenu-footer {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  font-size: 20px;
  padding: 50px 0 100px;
}

.bloc {
  width: 25%;
  margin: 0 30px;
}

/* contact */
.footer-services h3,
.footer-informations h3,
.footer-contact h3 {
  font-size: 25px;
  padding-bottom: 20px;
}

.footer-contact p {
  padding: 5px 0;
}

/* Services */

.liste-services,
.liste-information {
  list-style-type: none;
}

.liste-services li {
  padding: 2px 0;
}

.liste-services a {
  text-decoration: none;
  color: #333;
}
.liste-services a:hover {
  color: rgb(3, 3, 3);
}


				
			

Le definizioni più diffuse

page alias
page amp google
page gateway
orphan page
doorway page
page satellite
zombie page
seo pagination 
footer
header
sitemap

Aumenta la tua visibilità !

Non esitare a contattarci per un preventivo gratuito e su misura.

Notez ce page