Notifiche push web. Che cos'è e perché? Le notifiche HTML5 sono semplici: crea notifiche in una riga, come nelle notifiche push Web di GMail

La verità della vita è questa:

È davvero difficile ottenere traffico verso un sito web.

Ma sai cosa c'è di peggio?

Il 90% dei visitatori che visitano il tuo sito non tornerà mai più.

Bonus esclusivo: Clicca qui per scaricare una checklist per la creazione di testi magnetici. Gli articoli scritti secondo questa lista di controllo attireranno l'attenzione del lettore come una calamita ( clicca per scaricare).

È un peccato, ovviamente ... Spendi un'energia incredibile per il suo sviluppo, ma la risorsa più preziosa - i visitatori, si dimenticano di te lo stesso giorno in cui l'hanno scoperto.

Ma non disperare, una soluzione c'è:

Installa sul tuo sito notifiche push del browser.

Ecco il punto:

Le notifiche push per il sito ti consentono di essere in contatto con i tuoi visitatori.

Su alcuni blog, l'introduzione delle notifiche push ha aumentato più volte le visite ripetute.

E semplicemente, è una buona alternativa alle newsletter via e-mail.

In questo articolo imparerai:

• Quali sono i vantaggi delle notifiche push
• Ne vale la pena questa tecnologia relativamente nuova?
• Elenco dei migliori servizi di notifica push
• Come collegare i push`s al tuo sito

Ma prima, un piccolo esempio...

Extra è uno dei più grandi rivenditori del Medio Oriente.

Con l'aiuto delle notifiche push, sono stati in grado di aumentare le vendite agli utenti mobili di 2 volte:

Se pensi che questo sia tutto, ti sbagli profondamente.

Inoltre, la quota di acquisti ripetuti è aumentata di 4 volte (!!!).

Di conseguenza, i marketer di Extra hanno riconosciuto le notifiche push come lo strumento di fidelizzazione dei clienti più efficace.

Cosa sono le notifiche push per un sito web?

Non sei ancora sicuro di cosa siano le notifiche push per un sito web?

Tutto è molto semplice:

Quando visiti una risorsa web, potresti visualizzare la seguente finestra pop-up:

Esempio di richiesta di ricezione di notifiche push

Se l'utente è d'accordo, puoi inviare notifiche su nuovi articoli, nuovi prodotti e altro.

I messaggi vengono visualizzati nell'angolo destro dello schermo. In questo caso, il browser può essere ridotto a icona o addirittura chiuso.

Esempio di notifica push:

Browser che supportano le notifiche push

Safari è stato il primo a supportare la tecnologia di notifica push nel browser. Quindi, nell'aprile 2015, è stato implementato in Chrome versione 42.

E infine, all'inizio del 2016, le notifiche push hanno iniziato a essere supportate nel browser Firefox versione 44.

Già al momento oltre il 75% di tutti i browser supporta l'invio di notifiche push.

Perché gli utenti dovrebbero iscriversi alle notifiche push

Innanzitutto, tocchiamo i vantaggi che gli utenti ottengono quando si iscrivono alle notifiche push.

1. La comodità prima di tutto

Cosa dovresti capire come due più due:

Le persone acquistano da quei siti che offrono il miglior servizio. Lo stesso vale per la fedeltà dei lettori.

Ma come rendere il sito facile e veloce da usare?

La risposta è ovvia:

Con le notifiche push.

Diciamo che mi sono iscritto agli aggiornamenti regolari del tuo sito...

Spesso dovrò aprire la mia casella di posta in attesa di una tua email.

Nel caso delle notifiche push, tutto è molto più semplice.

Un segnale

Successivamente, la sezione OneSignal Push apparirà nella colonna di sinistra della tua area di amministrazione.

La configurazione successiva è completamente descritta nei passaggi, ma in inglese. Pertanto, spiegherò brevemente tutti i passaggi necessari.

Vedrai una finestra in cui devi andare alla sezione Configurazione:

Tutto deve essere fatto come mostrato negli screenshot e di conseguenza riceverai un numero di progetto e una chiave API.

Inserisci il numero del progetto nel campo Numero progetto Google nella sezione Configurazione. Devi salvare la chiave API (ti servirà comunque).

Nello stesso posto, specifica la chiave API del progetto Google e la presenza di un certificato SSL sul tuo sito.

Se il tuo sito è a http, non cambi nulla. Se https, seleziona la casella di controllo corrispondente.

Perché è necessario?

Il fatto è che le notifiche push sono supportate solo sui siti https. Tuttavia, il servizio OneSignal risolve il problema creando un sottodominio per te.

Puoi utilizzare l'indirizzo del tuo sito web come sottodominio. Ad esempio, invece di site, ho fatto site4business.onesignal.com

La sottosezione Modifica sito descrive i tipi di implementazione delle notifiche push. Nella sottosezione Safari Push, tutto è simile ai passaggi precedenti.

Infine, puoi modificare la posizione del pulsante di iscrizione e il suo testo nella sezione Configurazione.

Tieni presente che per http, l'abbonamento alle notifiche è disponibile solo con l'aiuto di un pulsante. Puoi cambiarne liberamente il design.

E le finestre pop-up sono disponibili solo per i siti https.

macchinista

Innanzitutto, installa il plug-in PushCrew.

Successivamente, crea un account sul sito Web del servizio.

Infine, nella sezione Personalizza per desktop, puoi personalizzare l'aspetto dei popup.

Ecco l'elenco completo dei servizi, fornendo la possibilità di implementare le notifiche push:

Quando visiti nuovi siti, a volte appare una piccola finestra nell'angolo in alto a sinistra del browser, che chiede il permesso di inviarti determinate notifiche.

Se l'utente ha approvato la ricezione di tali notifiche una volta, successivamente nell'area delle attività del computer o del dispositivo mobile, osserverà periodicamente l'aspetto di piccole finestre con un messaggio che informa che sono apparse nuove pubblicazioni su questi siti.

Queste sono le cosiddette notifiche push, sono anche web-push, uno strumento moderno per i marketer su Internet. E il mezzo più conveniente per informare gli utenti che vogliono tenersi aggiornati sugli eventi di loro interesse.

Cosa sono le notifiche push?

Le notifiche push sono brevi notifiche pop-up che appaiono sullo schermo di un normale computer o telefono cellulare e informano su eventi e aggiornamenti importanti.

Quando si fa clic su una notifica push ricevuta da un utente, le notizie del sito si aprono immediatamente nella finestra e gli utenti possono essere tra i primi a conoscere le informazioni appena pubblicate sulla rete. E a volte è importante essere tra i primi utenti ad avere informazioni utili.

Riso. 1. Che aspetto hanno le notifiche push

Le notifiche push del sito sono abilitate dai proprietari del sito e gli utenti possono gestire le notifiche push tramite le impostazioni del proprio browser. Se il webmaster non ha abilitato il push sul sito, l'utente non ha la possibilità (o la necessità) di utilizzarli, configurarli, ecc.

Quali sono i vantaggi delle notifiche push rispetto ad altri metodi per fornire nuove informazioni? Come gestire un tale strumento nei browser desktop Google Chrome, Mozilla Firefox o simili? Consideriamo queste domande di seguito.

Vantaggi delle notifiche push

I vantaggi dell'implementazione delle notifiche push sui siti per i loro proprietari, ovvero per i webmaster, sono evidenti. Il fatto è che pochi mezzi di informazione possono fornire il 90% di consegna dei messaggi all'utente e quasi il 50% di consegna.

Ma quale beneficio riceve il lettore di questo o quel sito?

Le notifiche push per alcuni utenti potrebbero essere più convenienti rispetto all'iscrizione agli aggiornamenti del sito tramite e-mail. I messaggi provenienti da siti diversi non si accumulano nella casella di posta e non complicano l'accesso alla corrispondenza personale.

Se al momento l'utente non ha tempo per leggere la notizia, cliccando sulla notifica push, può aprire la pagina in una finestra del browser e lasciarla fino a un momento opportuno. Oppure invialo a un servizio di lettura pigro come Pocket o Readability.

Uno degli svantaggi dell'iscrizione alle notizie del sito tramite e-mail è l'accumulo di lettere sui nuovi articoli nella casella di posta dell'utente. Con una notifica push, non ci sarà alcun overflow nella posta.

Con una protezione insufficiente del sito dall'hacking, può capitare che il database degli iscritti al sito cada nelle mani di truffatori, che per primi organizzano questo database (il cosiddetto attacco spam). Quindi ogni proprietario di e-mail di questo database riceve tali e-mail di spam fraudolente. Si ritiene che con le notifiche push al riguardo gli utenti siano protetti in modo più sicuro: nessun altro, tranne i creatori dei siti di interesse, potrà disturbare gli utenti, indipendentemente da chi ha hackerato qualcosa su tali siti.

Notifiche push e feed RSS

In termini di protezione antispam, il web-push è simile a un altro mezzo per fornire nuove informazioni pubblicate su un determinato sito: un feed RSS. Quest'ultimo vince anche in quanto mantiene uno storico dei messaggi sulle pubblicazioni dei siti a cui viene emesso un abbonamento RSS. Mentre le notifiche pop-up scompaiono per sempre dopo pochi secondi.

Ma l'uso dei feed RSS per la consegna delle notizie richiede all'utente di eseguire azioni indipendenti: deve trovare il pulsante di iscrizione su ogni sito (e non ha una posizione standard) e inserire l'indirizzo del canale nel lettore RSS. Se l'utente non dispone di tale lettore nel browser, deve comunque essere organizzato separatamente, ad esempio installando un'estensione, selezionando un servizio web o ricorrendo all'utilizzo dell'apposito programma.

Le stesse notifiche push vengono visualizzate e offrono di iscriversi e la loro implementazione è fornita dalla funzionalità standard di quasi tutti i browser moderni.

Configurazione delle notifiche push in Google Chrome

L'implementazione delle notifiche pop-up in Google Chrome e dei browser costruiti sullo stesso motore Blink (ad esempio ) offre all'utente un formato di abbonamento completamente aperto che non richiede alcuna scelta.

Una richiesta push in Google Chrome contiene due pulsanti funzionali:

1. "Consenti" per approvare la consegna del messaggio (1 nella Figura 2) e
2. "Blocca" per aggiungere il sito all'elenco di quelli bloccati (2 in Fig. 2).

In quest'ultimo caso, le richieste non compariranno più nelle visite successive a tale sito.

C'è una terza opzione: cliccando sulla crocetta nella finestra di richiesta è possibile posticipare la decisione (3 in Fig. 3). Il sito non verrà bloccato e dopo un po 'riapparirà tale richiesta nell'angolo in alto a sinistra della finestra di Chrome.

Riso. 2. Che aspetto ha una richiesta di notifica push in Google Chrome

Configurazione delle notifiche push in Mozilla

In Mozilla Firefox (e altri browser basati sullo stesso motore Gecko), il modulo di richiesta di consegna push web è più intelligente che in Google Chrome, o meglio, con l'inclinazione dell'utente a una scelta specifica.

1. Il pulsante "Consenti notifiche" (1 in Fig. 3) è accentuato dall'indicazione del colore,
2. e in alternativa, si oppone al pulsante di decisione ritardata “Non ora” (2 in Fig. 3).

Il pulsante di blocco delle notifiche "Non consentire mai" (4 nella figura 3) è più piccolo e nascosto all'interno del pulsante "Non ora" (3 nella figura 3).

Riso. 3. Come appare una richiesta di notifica push in Mozille Firefox

Le notifiche push consentite e bloccate non vengono sincronizzate con i profili del browser. Dopo aver installato un nuovo sistema operativo, quando si passa a un altro computer e anche dopo aver reinstallato il browser stesso ripulendo i suoi resti durante la disinstallazione, è necessario ricominciare da capo: rispondere nuovamente alle richieste del sito, formare una base di autorizzazioni e bloccare per notifiche push da zero.

Annullamento dell'iscrizione al web-push e blocco

Una quantità eccessiva di messaggi pop-up può diventare fastidiosa per l'utente nel tempo. Inoltre, i nostri interessi possono cambiare.

Come in questi casi annullare l'iscrizione a siti non pertinenti o disabilitare completamente l'invio di notifiche push da parte del browser? E come, al contrario, sbloccare i siti che sono stati erroneamente bloccati quando richiesto?

sito web 15.12.2017

Buona giornata, caro visitatore.

Notifiche istantanee dal sito sulla comparsa di nuovo materiale, così come altri eventi, cosa potrebbe esserci di meglio?! Questa tecnologia ci è venuta dal mondo della tecnologia mobile: inizialmente le notifiche istantanee erano solo molte delle applicazioni mobili, ma nel tempo la "funzione" è stata introdotta nei browser (mobile e poi desktop).

Gli avvisi aumentano il numero di visitatori del tuo sito e sono più efficaci degli abbonamenti e-mail. Quelli. se un utente ha visitato il tuo sito, approvato la richiesta di abilitare le notifiche dal sito, allora le vedrà quasi sempre, e per questo non è necessario compiere gesti extra, come tradizionalmente avviene con le mailing list di posta .

Voglio subito notare che le notifiche Web Push possono essere integrate solo su quei siti che funzionano utilizzando un protocollo sicuro (https) - questo è un requisito della tecnologia.

Cos'è il Web Push

Quando un utente visita un sito che dispone di un servizio di messaggistica istantanea, verrà visualizzato un messaggio sottile che indica che il sito sta richiedendo l'autorizzazione per inviare notifiche. Il design di questo avviso dipende dal browser in uso.

L'immagine mostra un esempio con una proposta per iscriversi alle notifiche da un sito nel browser desktop Google Chrome e Mozilla Firefox.

Ed ecco come appariva la stessa richiesta nel browser mobile Chrome per Android fino alla versione 63.0.3239.107.

Successivamente, gli sviluppatori del browser mobile Google hanno rivisto il loro approccio all'output delle query, rendendolo più aggressivo. D'ora in poi, sovrascrive il contenuto fino a quando l'utente non effettua una selezione.

Rendendosi conto che ciò può irritare i visitatori, OneSignal ha fatto quanto segue: quando si accede al sito dal browser mobile Google Chrome per Android, verrà visualizzata una finestra pop-up che richiede il permesso di iscriversi (il testo della richiesta è configurabile). Se l'utente è d'accordo, viene già visualizzata una richiesta standard per abilitare gli avvisi nel browser.
Questo vale solo per il browser mobile Google Chrome per Android; in tutti gli altri browser, l'algoritmo per la visualizzazione di una richiesta di iscrizione alla notifica rimane invariato.

Quando un utente accetta di ricevere notifiche, puoi impostare una notifica di "benvenuto", il cui significato è che sei stato iscritto alle notifiche sui nuovi materiali del sito. E quando compaiono, sarai avvisato da una notifica corrispondente.

Come puoi vedere, sui browser mobili, gli avvisi vengono spesso visualizzati nella barra delle notifiche, mentre sui browser desktop (computer) vengono visualizzati nell'angolo in basso a destra.

Anche gli avvisi stessi sono personalizzabili: puoi impostare un'immagine, un titolo, un testo del messaggio e aprire una pagina specifica quando fai clic sull'avviso.

Come collegare Web Push al sito

Bisogna capire che Web Push è un servizio che difficilmente può essere implementato semplicemente installando un plugin e manipolazioni simili. Pertanto, utilizzeremo il corrispondente servizio di terze parti. In questo caso, parleremo del servizio OneSignal, con l'aiuto del quale doteremo il nostro sito delle funzionalità sopra descritte. Perché proprio lui? Perché è completamente gratuito, non invia agli utenti pubblicità e altre cose.

È improbabile che gli utenti sappiano che il Web Push del tuo sito è implementato utilizzando il servizio OneSignal. Questo è il suo innegabile vantaggio.

Quali sono i suoi aspetti negativi? Sono anche disponibili. L'interfaccia di questo servizio è in inglese e dovrai abituarti se prevedi di generare avvisi da lì che verranno inviati agli utenti che si abbonano.

Esiste un plugin ufficiale per l'integrazione in WordPress, che però non mi è piaciuto per niente. La sua dimensione è di 6,5 megabyte, che è un bel po'... mi ha già impedito di usarlo.

Ho integrato Web Push nel sito con “maniglie” leggendo la guida all'integrazione (in inglese), che viene presentata in dettaglio sul sito del servizio.

E formo i messaggi stessi attraverso il mio account personale sul servizio.

Voglio parlarti di questo metodo di integrazione (senza plug-in). Vale la pena notare che utilizzando il metodo di integrazione descritto, puoi dotare Web Push delle funzionalità non solo di un sito WordPress, ma anche di un qualsiasi altro motore, o addirittura costituito da pagine html statiche. Una scelta davvero versatile!

1. Il primo passo è accedere al sito Web del servizio OneSignal e registrarsi. Per fare ciò, fare clic sul collegamento ACCESSO e nella finestra che appare, clicca sul link Iscriviti, che si trova in basso. Lì dovrai inserire la tua e-mail, password, nome dell'azienda o dell'organizzazione (inserire qualsiasi) e accettare i termini di utilizzo. Puoi anche ottenere una registrazione accelerata se hai un account Google, Facebook, Github.
2. Dopo esserti registrato e aver inserito il tuo account personale, vedrai un messaggio di benvenuto che elenca le funzionalità del servizio.
3. Dopo aver fatto clic sull'ultima finestra, fare clic sul pulsante che si trova lì Aggiungi una nuova app.

   

4. Nella finestra che si apre, inserisci un nome, ad esempio il nome del sito, e clicca sul pulsante Creare.

   

5. Successivamente, i tuoi occhi vedranno una finestra in cui dovrai fare clic sul pulsante con la scritta push del sito web e premere il tasto Prossimo.

   

6. Nella finestra successiva, fai clic sul pulsante etichettato Google Chrome e Mozilla Firefox, quindi premere Prossimo.

   

   Nota: c'è anche un pulsante Safari di mele e potresti avere una domanda naturale: che dire di questo browser? Non preoccuparti, lo aggiungeremo in uno dei prossimi passaggi.

7. Nella finestra successiva, ci verrà chiesto di inserire l'indirizzo del sito, così come il suo logo (opzionale, puoi aggiungerlo in seguito). Il logo stesso deve avere una risoluzione di 192 per 192 pixel in formato png, il cui file deve trovarsi sull'hosting stesso. Dopo aver inserito i dati, premere il tasto Salva.

   

8. Di conseguenza si aprirà una finestra in cui dovrai scegliere tra le opzioni come verrà integrato il servizio, dovrai cliccare sul pulsante push del sito web e premere Prossimo.

   

9. Le informazioni nella finestra cambieranno e il tuo Il tuo ID app. Non chiudere questa finestra, ne avremo bisogno in seguito. Passiamo ora all'integrazione del codice del servizio nel sito.

   

10. Per integrare il codice al sito, è necessario scaricare questo archivio (l'archivio viene scaricato dal sito ufficiale) con i file che saranno necessari per una corretta integrazione. L'archivio contiene una cartella OneSignalSDKFiles e contiene tre file:
    • manifest.json
    • OneSignalSDKWorker.js
    • OneSignalSDKUpdaterWorker.js

    Decomprimi questi file.

11. Successivamente, è necessario aprire il file in un editor di testo. manifest.json e modifica la didascalia Esempio OneSignal a nome del tuo sito. Non ci sono requisiti severi qui, puoi inserire il nome del sito e il suo slogan.

    

12. Ora carica questi file nella radice del tuo sito in modo che questi file siano disponibili se digiti il ​​loro indirizzo nella barra del browser:

    https://sitename.ru/manifest.json
    https://sitename.ru/OneSignalSDKWorker.js
    https://sitename.ru/OneSignalSDKUpdaterWorker.js

13. Ma questo non è tutto. Ora devi aggiungere il codice direttamente al modello del sito. Se questo è WordPress, vai alla cartella ( \wp-content\temi\<папка с названием темы> ) dove si trova il tema che stai utilizzando e trova il file lì header.php. Apri questo file per la modifica e scrivi da qualche parte tra i tag … il seguente codice:

    Non dimenticare il posto Inserisci QUI il tuo ID app inserisci il codice che è stato assegnato al tuo caso e viene visualizzato nella finestra evidenziata al punto 9.

    Il titolo e il messaggio sono responsabili del messaggio di "benvenuto" al momento dell'iscrizione, puoi modificare il testo in queste righe a tuo piacimento.

    E i parametri actionMessage, acceptButtonText, cancelButtonText sono responsabili del testo della richiesta di abbonamento, che viene visualizzato nel browser mobile Google Chrome per Android e da nessun'altra parte.

    Salva il file header.php con il codice che hai inserito.

14. Ora apri il tuo sito web. Dovresti vedere un avviso che ti chiede di iscriverti alle notifiche istantanee. D'accordo con questa offerta.

    

    Nota: vale la pena notare che questa richiesta viene visualizzata una volta. E se sei d'accordo, in seguito non apparirà, ma verrà effettuato un abbonamento automatico. Anche cancellare la cronologia del browser non sarà di aiuto.
    Ho appena incontrato una tale caratteristica della tecnologia da solo, sperimentando l'integrazione nel sito. Quindi se non vedi la richiesta, non dovresti "suonare l'allarme" e pensare che qualcosa non funzioni, prova semplicemente ad accedervi da un altro browser che non ha precedentemente effettuato l'accesso al sito.

    Congratulazioni - sei il primo iscritto agli avvisi dal tuo sito :-) Ma non è tutto.

15. Ritorna ora alla finestra che abbiamo lasciato per procedere all'integrazione del codice nel sito e clicca sul pulsante in essa contenuto Controlla Utenti iscritti. Di conseguenza, apparirà un messaggio sotto il pulsante, se è verde, allora è andato tutto bene, puoi fare clic sul pulsante situato nell'angolo in basso a destra Fatto.

    

    Web Push funzionerà (iscriversi, ricevere) nel browser Google Chrome e quelli basati sul codice Chromium: Opera, Yandex Browser, ecc., nonché Mozilla Firefox.

16. Dobbiamo solo abilitare la capacità di lavorare Web Push nel browser Apple Safari, la versione desktop del browser Apple (non mobile, iOS non supporta la tecnologia Web Push).

    Per abilitare il supporto per Apple Safari, procedi come segue:

    Nel tuo account OneSignal, nel menu a sinistra, fai clic sul collegamento Impostazioni dell'app, nel menu che si apre, fare clic sul pulsante Configura, che si trova di fronte al punto Safari di mele.

    

    Nella finestra che si apre, inserisci il nome del tuo sito e inserisci il suo indirizzo URL. Facoltativamente, puoi caricare un logo del sito che verrà visualizzato nell'avviso. Per fare ciò, seleziona la casella Vorrei caricare le mie icone di notifica e caricare il file grafico. Il requisito per il logo è una risoluzione di 256 x 256 pixel, formato png. Dopo aver fatto tutto il necessario, fare clic sul pulsante Salva.

    

    Verrai reindirizzato a una pagina Impostazioni dell'app, ma sotto l'iscrizione Safari di mele sarà evidenziato ID web.

    

    Deve essere copiato e incollato nel codice che abbiamo precedentemente inserito nel file header.php:

    SistNotification: true, safari_web_id: "", welcomeNotification: ( "title": "Notifica...

    SistNotification: true, safari_web_id: "Inserisci QUI il tuo ID Safari Apple", welcomeNotification: ("title": "Notifica...

    Salva le modifiche.

Tutto, integrazione e configurazione è terminato. Se qualcosa non è chiaro, fai domande e familiarizza anche con come viene inserito il codice su questo sito. L'unica eccezione su questo sito è una riga di codice

spostato nel cosiddetto "footer" (nel codice sorgente della pagina, viene visualizzato in basso).

Come generare e inviare Web Push agli abbonati

Abbiamo capito il codice e l'integrazione, ora tocca alla piccola cosa: creare una mailing list.

1. Per fare ciò, fare clic sul collegamento nel menu a sinistra nuovo messaggio.

   

   Lì ci aspetterà un mago, con l'aiuto del quale creeremo una mailing list.

2. Nella pagina Invia a, tutti sono già selezionati per impostazione predefinita ( Invia a tutti). Clic Prossimo.

   

3. Il messaggio viene inserito nella pagina successiva. Non prestare attenzione all'iscrizione INGLESE prima del modulo di input, puoi semplicemente creare una mailing list multipla per ogni lingua specificata. Se non ne hai bisogno, sentiti libero di inserire il titolo ( Titolo) e messaggio ( Messaggio) e premere Prossimo.

   

4. In questa pagina ci viene chiesto di specificare icone, un'immagine e un collegamento che si aprirà quando si fa clic sull'avviso.

   

   Icone ( icona- miniatura visualizzata accanto al testo) supporta Google Chrome, Mozilla Firefox (e browser basati su Chromium), immagine grande ( Immagine) solo Chrome e solo dalla versione 56. Per il browser Safari non c'è modo di specificare un'icona, le notifiche in arrivo visualizzeranno sempre l'icona che è stata caricata al punto 16 delle istruzioni per la connessione di Web Push al sito. Questa è l'implementazione del supporto per le notifiche push nel browser Safari.

   È possibile ignorare l'input dell'immagine grande ( Immagine), limitato a specificare l'icona ( icona).

   Altro da dire sul campo Tempo di vivere– questa opzione è responsabile della durata del messaggio, di default è pari a tre giorni. Se durante questo periodo lo smartphone/browser non riesce ad accedere a Internet, il messaggio non gli verrà recapitato affatto.

   Ha senso aumentare questo divario. Aumento questa soglia a 128 giorni (inserendo 11111111 in campo). Per aumentarlo è sufficiente iniziare a inserire i numeri e la soglia impostata verrà visualizzata in tempo reale.

   Dopo aver inserito tutti i dati, fare clic Prossimo.

5. La pagina successiva indica quando inviare. Per impostazione predefinita, l'invio è immediato, ma puoi provare a utilizzare l'opzione Consegna intelligente (consigliata)– invio di messaggi nel momento in cui è più probabile che siano rilevanti per determinati utenti (a seconda del fuso orario e di altri fattori) .

   

   Clicca per continuare Confermare.

6. Di conseguenza, verrà visualizzata una pagina con informazioni di riepilogo generalizzabili sull'invio di un messaggio, il suo contenuto, il numero di iscritti, ecc. Premere il pulsante per confermare l'invio. invia messaggio.

   

E verrai reindirizzato alla pagina delle statistiche, dove puoi vedere quanti messaggi sono stati inviati in totale, quali hanno raggiunto l'obiettivo, quante volte gli iscritti hanno cliccato su di esso, ecc. Molto comodo e visivo.

Vale la pena notare che nel menu a sinistra è possibile selezionare l'elemento Modelli e creare un modello di mailing in modo da non inserire informazioni ripetute ogni volta durante la creazione di una normale mailing list.

Sommario

Nel materiale abbiamo esaminato in dettaglio i vantaggi del web push, il processo di installazione di un servizio di notifica istantanea su un sito e il suo utilizzo utilizzando l'esempio di un servizio completamente gratuito di OneSignal.

Se hai domande, nei commenti puoi chiarire tutte le sottigliezze e le sfumature.

Sito del sito di donazione(le donazioni vengono raccolte tramite il servizio Yandex Money)

Come disattivare le notifiche push: questa domanda preoccupa alcuni utenti che vedono le notifiche nel browser dopo aver effettuato l'accesso a molti siti su Internet. La tecnologia Push è progettata per distribuire informazioni su Internet dal provider, in questo caso il sito, all'utente di questo sito.

Le notifiche push per il sito sono necessarie per informare i visitatori del sito sulle novità, principalmente sul rilascio di nuovi articoli. In questo caso, il visitatore riceve tempestivamente le notifiche dal sito e può leggere immediatamente la notizia.

Le notifiche per conto del sito vengono inviate tramite un servizio di terze parti che organizza l'invio delle notifiche ai computer degli utenti.

Che cos'è una notifica push su un computer? Se un visitatore del sito accetta di ricevere messaggi da questa risorsa, di tanto in tanto sul desktop dell'utente vengono visualizzate notifiche sulle notizie di questo sito Web.

Come funzionano le notifiche push

Visitando un sito che ha la funzione di invio notifiche abilitata, il visitatore vede ogni volta una richiesta per consentire la visualizzazione delle notifiche, nella quale si propone di cliccare sui pulsanti "Consenti" o "Blocca". I nomi dei pulsanti possono essere diversi, ma il significato è lo stesso ovunque.

Il visitatore del sito può ignorare questo pop-up perché la finestra di richiesta della notifica push è piccola e non interferisce con la navigazione nel sito.

L'aspetto di tali finestre è diverso, a seconda del servizio che invia le notifiche da questo sito.

Cliccando sul pulsante "Consenti", accetti di ricevere messaggi push sul tuo computer.

Nell'area di notifica, sul desktop del computer dell'utente, appariranno le notifiche sulle novità di questo sito web. Di solito, questo è un messaggio sul rilascio di un nuovo articolo. Alcuni siti abusano della capacità di inviare avvisi, notificando tutto di seguito, a volte inviando informazioni non necessarie.

Dopo aver ricevuto una notifica push, l'utente può andare sul sito per leggere l'articolo, oppure chiudere la notifica ignorando questo messaggio. Tali notifiche dai siti praticamente non interferiscono con il lavoro sul computer, poiché vengono visualizzate nell'area di notifica e si chiudono da sole dopo un breve periodo di tempo.

Per evitare che la richiesta di autorizzazione all'invio di avvisi da questo sito non venga più visualizzata quando si visita nuovamente questo sito, fare clic sul pulsante "Blocca".

Se stai già ricevendo messaggi push da un determinato sito, l'utente può disabilitare le notifiche push da solo nel proprio browser, in cui ha consentito di ricevere notifiche sul proprio computer.

Come rimuovere le notifiche push dopo aver ricevuto un avviso

In molte notifiche, a seconda delle impostazioni del servizio che invia le notifiche, è possibile disabilitare le notifiche push direttamente nella finestra del messaggio aperto.

Per fare ciò, fai clic sull'icona delle impostazioni (ingranaggio), quindi seleziona "Disattiva le notifiche dal sito".

Dopodiché, le notifiche da questo sito non appariranno più sul tuo computer.

Come disabilitare le notifiche push in Google Chrome

Entra nelle impostazioni del browser Google Chrome, scorri verso il basso la rotellina del mouse, clicca sul link "Avanzate".

Nella sezione "Privacy e sicurezza", fai clic sul pulsante "Impostazioni sito". Nella finestra "Impostazioni sito" che si apre, trova la sezione "Notifiche".

Qui puoi impostare la ricezione di avvisi dai siti. Per impostazione predefinita, è selezionato "Chiedi l'autorizzazione prima di inviare (consigliato)".

Per rimuovere le notifiche push nel browser Google Chrome, attiva la voce "Non mostrare notifiche sui siti".

Per evitare di ricevere avvisi da un sito specifico, fare clic sul pulsante "Aggiungi", che si trova di fronte al parametro "Blocca".

Nella finestra "Aggiungi sito", inserisci l'indirizzo del sito, quindi fai clic sul pulsante "Aggiungi".

Per configurare la ricezione dei messaggi push, fare clic sul pulsante "Aggiungi" situato di fronte all'opzione "Consenti".

Nella finestra che si apre, aggiungi il sito desiderato all'elenco dei siti da cui puoi ricevere notifiche nel browser Google Chrome.

Come disabilitare i messaggi push in Mozilla Firefox (1 modo)

Entra nelle impostazioni del browser Mozilla Firefox, apri la sezione "Privacy e Sicurezza". Nell'opzione "Autorizzazioni", vai all'opzione "Notifiche".

Seleziona la casella accanto a Disattiva notifiche fino al riavvio di Firefox. Successivamente, le notifiche push non verranno visualizzate fino a quando il browser Mozilla Firefox non sarà disabilitato.

Per gestire gli avvisi, fai clic sul pulsante "Impostazioni...". Nella finestra "Opzioni - Autorizzazione alla visualizzazione delle notifiche" è presente un elenco di siti le cui notifiche sono consentite o bloccate.

Se un sito ha lo stato "Blocca" accanto ad esso, le notifiche da questo sito non vengono visualizzate sul tuo computer, perché hai precedentemente bloccato una richiesta di invio di notifiche da questo sito.

Se lo stato "Consenti" è accanto all'indirizzo del sito, le notifiche da questo sito verranno visualizzate sul tuo PC.

È possibile rimuovere qualsiasi sito dall'elenco utilizzando il pulsante Rimuovi sito Web oppure rimuovere tutti i siti dall'elenco facendo clic sul pulsante Rimuovi tutti i siti Web.

Dopodiché, le nuove notifiche dal sito remoto non verranno visualizzate sul desktop del tuo computer. Quando visiti nuovamente questo sito, rifiuta la richiesta di ricevere avvisi.

Per bloccare la ricezione di nuovi messaggi da siti diversi da quelli elencati in questo elenco, seleziona la casella di controllo "Blocca nuove richieste per inviarti notifiche".

Per completare la configurazione dell'ordine di ricezione delle notifiche, fare clic sul pulsante "Salva modifiche".

Come rimuovere le notifiche push in Mozilla Firefox (2 vie)

Per disabilitare completamente le notifiche nel browser Mozilla Firefox, è necessario accedere alle impostazioni del browser nascosto.

Digita nella barra degli indirizzi l'espressione: "about:config" (senza virgolette). Nella finestra che si apre, clicca sul pulsante "Accetto il rischio!".

Nella nuova finestra, inserisci nel campo "Cerca" l'espressione: "dom.webnotifications.enabled" (senza virgolette), quindi premi il tasto "Invio".

Questa impostazione predefinita è "true". Seleziona la riga, fai clic con il pulsante destro del mouse, seleziona "Cambia" dal menu di scelta rapida. Il valore del parametro cambierà in "false".

Come disabilitare le notifiche push in Yandex.Browser

Accedi alle impostazioni del browser Yandex, vai alla scheda "Siti".

Nella sezione "Siti", vai all'opzione "Richieste di invio notifiche". Ci sono tre opzioni per agire qui:

• Mostra le richieste di invio (consigliato).
• Non mostrare le richieste di invio.
• Iscriviti automaticamente alle notifiche.

Selezionare l'opzione desiderata che regola la procedura di ricezione dei messaggi push. Per disabilitare completamente tutte le notifiche push nel browser Yandex, seleziona l'opzione "Non mostrare richieste di invio".

Se devi configurare la ricezione delle singole notifiche, clicca sul link "Su altri siti". Successivamente, nella finestra "Invio di notifiche", seleziona quali notifiche push desideri bloccare e quali consentire.

Aprire la scheda "Consentiti" o "Proibiti", utilizzando il pulsante "Aggiungi", aggiungere un collegamento al sito nell'apposita sezione.

Come disattivare le notifiche push in Opera

Entra nel menu del browser Opera, fai clic sulla voce del menu contestuale "Impostazioni". Quindi, seleziona la sezione "Avanzate", fai clic su "Sicurezza".

Nella sezione Privacy e sicurezza, seleziona l'opzione Impostazioni contenuto. Trova l'opzione "Notifiche".

Nella finestra Notifiche, l'opzione "Chiedi il permesso prima di inviare (consigliato)" è abilitata per impostazione predefinita.

Qui devi aggiungere il sito alla sezione "Blocca" o "Consenti".

Come disabilitare le notifiche push in Microsoft Edge

Accedi alle impostazioni del browser Microsoft Edge. Seleziona "Opzioni". Nella finestra "Opzioni", fai clic su "Visualizza opzioni avanzate". Nella finestra "Opzioni avanzate", seleziona "Notifiche" e quindi fai clic sul pulsante "Gestisci".

La finestra Gestisci notifiche mostrerà i siti che richiedono l'autorizzazione a mostrare le notifiche. Puoi modificare le autorizzazioni per siti specifici.

Conclusioni dell'articolo

L'utente può disattivare autonomamente le notifiche push (push) nel browser che riceve sul desktop del proprio computer, consentendo l'invio di notifiche da un determinato sito web.

Sicuramente tutti coloro che hanno utilizzato la posta di Google almeno una volta hanno visto notifiche come questa:

notifiche gmail

Queste notifiche sono chiamate Notifiche HTML5 e sono visibili anche se passi a un'altra scheda o riduci a icona il browser del tutto.

Dopo aver letto questo articolo, potrai effettuare le stesse notifiche per il tuo sito. Il codice è semplice, multipiattaforma e l'invio diretto di una notifica richiede solo 1 riga nel tuo JavaScript preferito.

Inoltre a fine articolo è presente una funzione già pronta con la quale è possibile iniziare a inviare notifiche senza entrare nei dettagli.

Secondo caniuse.com, ora tali notifiche (HTML5 Notifications) funzionano nei browser Chrome, Firefox (35+), Opera (27+), Safari (7.1+). Internet Explorer non dispone del supporto Internet per le notifiche. Se consideriamo le piattaforme mobili, solo il browser Android ha un supporto parziale per le notifiche HTML5.

Prima di poter inviare notifiche direttamente, dobbiamo ottenere l'autorizzazione per farlo.
Puoi farlo usando il metodo Notification.requestPermission():

Notification.requestPermission(function(permission)( // la variabile di autorizzazione contiene il risultato della richiesta console.log("Risultato della richiesta di autorizzazione:", autorizzazione); ));

Dopo aver eseguito il metodo, il risultato della richiesta di autorizzazione verrà archiviato nella variabile di autorizzazione.

Ecco i suoi diversi significati con spiegazioni:

• default - non è stata inviata una richiesta per ottenere i diritti;
• concesso - l'utente è autorizzato a mostrare le notifiche;
• negato: l'utente ha negato la visualizzazione delle notifiche.

Ricevuti i diritti, possiamo procedere direttamente all'invio delle notifiche.
Questo è fatto molto semplicemente, in una riga:

Notifica Var = nuova Notifica(titolo, opzioni);

titolo - titolo della notifica,

opzioni (opzionale) ha le seguenti opzioni:

• body - corpo della notifica (testo principale), troncato in modo diverso nei diversi browser e sistemi operativi (ad esempio, in Chrome sotto Win 8.1, la lunghezza massima è di 200 caratteri);
• dir - direzione di visualizzazione delle notifiche, può essere auto, ltr (da sinistra a destra) o rtl (da destra a sinistra);
• lang - lingua di notifica;
• tag: un identificatore di notifica univoco che può essere utilizzato per sostituirlo con un'altra notifica o eliminarlo;
• icon - URL dell'immagine che verrà mostrata nella notifica (risoluzione consigliata 40×40 px).

Proviamo a impostare i parametri e inviare una notifica:

Var notification = new Notification("Quanti programmatori TYU ci vogliono per avvitare una lampadina?", ( body: "Solo tu!", dir: "auto", icon: "icon.jpg" ));

Il risultato dell'esecuzione del codice sopra

La notifica ha anche i metodi di gestione degli eventi onclick , onshow , onerror , onclose:

Funzione clickFunc() ( alert("L'utente ha fatto clic sulla notifica"); ) notification.onclick = clickFunc;

Risultato:

Al clic

Una funzione per tutto

Ora raccoglieremo tutto in un'unica funzione e aggiungeremo alcuni controlli degli errori:

Funzione sendNotification(titolo, opzioni) ( // Controlla se il browser supporta le notifiche HTML5 se (!("Notifica" nella finestra)) ( alert("Il tuo browser non supporta le notifiche HTML, deve essere aggiornato."); ) // Controlla se ci sono i diritti per inviare notifiche else if (Notification.permission === "concesso") ( // Se ci sono diritti, invia una notifica var notification = new Notification(title, options); funzione clickFunc() ( alert("L'utente ha fatto clic per la notifica"); ) notification.onclick = clickFunc; ) // Se non ci sono diritti, prova a ottenerli altrimenti se (Notification.permission !== "denied") ( Notification.requestPermission( function (permission) ( // Se i diritti sono stati ricevuti correttamente, invia una notifica if (permission === "concesso") ( var notification = new Notification(title, options); ) else ( alert("Hai negato la visualizzazione delle notifiche "); // L'utente ha negato la nostra richiesta di mostrare le notifiche) ) ); ) else ( // L'utente ha precedentemente negato la nostra richiesta di mostrare le notifiche // A questo punto possiamo, ma non lo disturberemo. Rispetta le decisioni dei tuoi utenti. )

Ora abbiamo una bella funzionalità che semplifica l'invio di notifiche senza essere distratto dalle richieste di diritti o dal supporto del browser:

SendNotification("Riporta Linus!", ( body: "Testing HTML5 Notifications", icon: "icon.jpg", dir: "auto" ));

Il risultato dell'esecuzione della funzione in diversi browser: