> For the complete documentation index, see [llms.txt](https://docs.pagopa.it/linee-guida-brand-pagopa/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.pagopa.it/linee-guida-brand-pagopa/casi-duso/enti-partner-e-intermediari-tecnologici/banner-con-logo-pagopa.md).

# Banner con logo pagoPA

Un'alternativa al [**banner testuale**](/linee-guida-brand-pagopa/casi-duso/enti-partner-e-intermediari-tecnologici/banner-testuali.md) per indirizzare gli utenti alla piattaforma pagoPA direttamente dall'homepage è l'utilizzo di **banner con il logo pagoPA**.

 Anche in questo caso:

* è preferibile parlare di "pagamenti online", ovvero il bisogno che deve soddisfare l'utente, ed eventualmente specificare che questi sono effettuati "tramite pagoPA";
* si sconsiglia di utilizzare esclusivamente il nome "pagoPA" perché potrebbe esser fuorviante e l'utente potrebbe erroneamente pensare che l'intera esperienza sia gestita da PagoPA S.p.A.; 
* si ricorda che è fondamentale utilizzare una **terminologia corretta**, [**consultabile** **qui**](/linee-guida-brand-pagopa/casi-duso/enti-partner-e-intermediari-tecnologici/testi-descrittivi-e-termini.md)**,** e **associare il logo pagoPA** in modo corretto, secondo le indicazioni [**consultabili qui**](/linee-guida-brand-pagopa/specifiche-tecniche/il-logo-pagopa.md)**.**

Seguono diversi esempi di:

* [**Banner**](#esempi-di-banner-con-logo-pagopa) con logo pagoPA corretti e non;
* [**Homepage**](#esempi-di-una-homepage-intera) che utilizzano il banner con logo pagoPA in modo corretto e non. 

## **Esempi di banner con logo pagoPA**

Come per i banner testuali, il principale concetto che deve emergere dai banner con logo pagoPA è quello dei **"Pagamenti online".** Il richiamo a pagoPA può esserci, ma deve esser esplicitato il fatto che è semplicemente un **tramite** che permette il servizio.

### Scrivi "pagoPA" in modo corretto

A sinistra non emerge il concetto di "pagamento online" e il servizio "pagoPA" è scritto erroneamente. Inoltre il logo "pagoPA" ha uno sfondo di un colore non consentito dalle Linee guida del logo. Infine il testo descrittivo non esplicita "l'integrazione al servizio pagoPA". A destra il banner corretto.

{% hint style="info" %}
[**A questa pagina**](/linee-guida-brand-pagopa/casi-duso/enti-partner-e-intermediari-tecnologici/testi-descrittivi-e-termini.md) trovi i termini corretti da utilizzare. Non citare l'Agenzia per l'Italia Digitale (AgID): dal 2019 pagoPA è sviluppato e gestito da [PagoPA S.p.A.](https://docs.pagopa.it/linee-guida-brand-pagopa/casi-duso/enti-partner-e-intermediari-tecnologici/www.pagopa.it)
{% endhint %}

<figure><img src="/files/mubTpgIijtaUfKDnQShB" alt="Esempio di banner in cui non emerge il concetto di pagamento"><figcaption></figcaption></figure>

### Segui le linee guida del logo

Le puoi consultare [**a questa pagina**](/linee-guida-brand-pagopa/specifiche-tecniche/il-logo-pagopa.md). In caso di sfondi colorati contrastati utilizzare il logo pagoPA nella versione bianca o nera senza background.

<figure><img src="/files/2jScAHRKMIwo1ZjrztiP" alt="Esempio di banner che non segue le linee guida del logo"><figcaption></figcaption></figure>

### Presta attenzione a spazi di sicurezza e colori di sfondo

* Assicurati di utilizzare il logo nei colori corretti ([**qui illustrati**](/linee-guida-brand-pagopa/specifiche-tecniche/colori.md#varianti))
* Rispetta lo [**spazio di sicurezza**](/linee-guida-brand-pagopa/specifiche-tecniche/spazio-di-sicurezza.md) e i [**colori di sfondo**](/linee-guida-brand-pagopa/specifiche-tecniche/colori.md#varianti) consentiti

<figure><img src="/files/qk2zjNCsfdUesLQgdhVo" alt="Esempio di banner errato"><figcaption></figcaption></figure>

### Usa le dimensioni corrette&#x20;

A sinistra il logo "pagoPA" ha una risoluzione troppo bassa tanto da farlo risultare sfocato. A destra il banner corretto.

{% hint style="info" %}
Rispetta le dimensioni e la risoluzione [**indicate qui**](/linee-guida-brand-pagopa/specifiche-tecniche/dimensioni-minime.md).
{% endhint %}

<figure><img src="/files/VLUUDAQW701PMOUzEHGa" alt="Esempio di banner con logo sfocato"><figcaption></figcaption></figure>

### Non usare versioni obsolete del logo

A sinistra viene utilizzato erroneamente un logo obsoleto di pagoPA. Anche i colori sono obsoleti. *A destra il banner corretto.*

<figure><img src="/files/etH6v3xHaj7FJ00NOCWj" alt="Esempio di utilizzo obsoleto del logo"><figcaption></figcaption></figure>

## Esempi di una homepage intera&#x20;

Al fine di dare massima visibilità al servizio e permettere all'utente di accedere subito al servizio di pagamento online, si consiglia di inserire il banner con logo pagoPA **nella parte alta dell'homepage.**

Nell'esempio, a sinistra il logo "pagoPA" non ha le proporzioni corrette. Inoltre viene menzionata erroneamente AgID. *A destra la homepage corretta.*

{% embed url="<https://www.figma.com/file/pwhBMrDMLW6wfWcjuAOCka/Linee-Guida-Brand-pagoPA?node-id=167%3A2538>" %}
Esempio di homepage
{% endembed %}

## Risorse utili

[**Scarica gli asset grafici -->**](/linee-guida-brand-pagopa/risorse-utili/scarica-gli-asset-grafici.md)