Modelli oscuri: svelare il lato oscuro del Web

Amiamo il web. Avremmo tutti dovuto trovare carriere diverse se non fosse stato per la straordinaria invenzione di Sir Tim Berners Lee! Nonostante la nostra passione, però, il web può essere un luogo sgradevole.

I modelli scuri possono essere involontari. Un marketer o uno sviluppatore potrebbe aver pensato di fare la cosa giusta ma non ha apprezzato i problemi e gli svantaggi di una funzionalità che ha implementato. I peggiori schemi oscuri sono intenzionali. Una pagina ti induce a fare qualcosa che non volevi perché l'interfaccia utente o il testo manipolano le tue azioni. Gli utenti sono sempre più attenti alle tecniche più dubbie, ma qualcuno, da qualche parte, non riuscirà a notare di essere stato ingannato finché non sarà troppo tardi.

Se usato bene, il web può far risparmiare tempo, viaggi ed energia. D'altra parte, i modelli scuri sprecano milioni di ore di lavoro e kilowatt. Non svergogneremo nessun sito in particolare (sanno chi sono), ma illustreremo miglioramenti e opzioni alternative ove possibile.

Queste sono le nostre seccature da compagnia.

Interfacce utente non intuitive

Questi sono i modelli scuri più comuni che incontrerai. Ci vuole tempo e considerazione per creare un'esperienza utente eccezionale... e puoi rovinare tutto quello sforzo molto rapidamente con questi schemi oscuri invadenti.

"Installa la nostra app!"

Alcuni siti e social network richiedono di installare la loro app, in genere quando si fa clic su un avviso e-mail su un nuovo messaggio o follower. Il collegamento si apre in una pagina web con due pulsanti:

1. Un enorme pulsante "Usa la nostra app". Facendo clic su di esso si accede all'AppStore, dove è necessario approvare, scaricare, installare, quindi avviare l'app nativa del sito (presumendo che sia supportata sul telefono). È quindi necessario effettuare il login, ottenere la password errata, richiedere un ripristino, aprire il collegamento, creare una nuova password e accedere al sistema. Forse hai dimenticato il motivo per cui eri lì, quindi torna all'avviso originale e ricomincia.
2. Un microscopico collegamento "continua nel Web mobile" per eseguire l'azione.

Forse l'app è gloriosa e ha speso milioni per essa, ma è raro trovarne una con più funzionalità del sito web. Ovviamente, un'app può raccogliere più dati personali di un sistema web, quindi ottiene una promozione più invadente.

Promuovi un'app con tutti i mezzi, ma farlo all'inizio di ogni interazione infastidisce gli utenti. Alcuni installeranno l'app per fermare il fastidio, ma altri se ne andranno. Sarebbe più efficace offrire l'app quando l'utente utilizza il sito da un po'?

"Vuoi ricevere le notifiche?"

In una parola: no.

Iscrizioni a newsletter, notifiche push basate sul Web, widget "chiacchieriamo" e richieste di sondaggi potrebbero essere utili, ma le loro implementazioni sono universalmente orribili.

I siti spesso ti chiedono di iscriverti nel momento in cui accedi per la prima volta dopo una ricerca sul web. A quel punto, non hai idea se il contenuto sia rilevante, se sia utile o se il sito sia un luogo che considereresti di visitare frequentemente. Non sorprende scoprire che la maggior parte delle persone fa clic su "No".

Non c'è niente di sbagliato nell'offrire notifiche o newsletter, ma è meglio assicurarsi che un utente abbia prima interagito con il sito. Forse mostra un messaggio alla fine dell'articolo o dopo che hanno visitato alcune volte. È meno invadente, meno distraente e più probabile che abbia successo.

Infine, non richiedere agli utenti di iscriversi a una newsletter quando fanno clic su un collegamento nella newsletter! Li allontanerà più velocemente di quanto non li attirerà.

Navigazione stravagante

Le barre di intestazione e i menu a discesa possono essere noiosi, ma le persone li capiscono. Non vogliamo fermare l'evoluzione dell'interfaccia utente e l'inventiva del design, ma alcuni controlli di navigazione sono strani e illogici.

Si prega di riconsiderare il progetto se è necessario richiedere agli utenti descrizioni comandi "fai clic qui" o altri metodi di aiuto. Le buone interfacce utente non hanno bisogno di spiegazioni.

Scroll-jacking non necessario

Mostrare animazioni o aggiornare le voci di menu attive quando la pagina scorre può essere un'esperienza coinvolgente. È meno utile quando:

1. Le animazioni sono abusate. L'animazione di troppi elementi distrae lo spettatore: evidenziare ogni elemento significa che nulla viene portato all'attenzione dell'utente. Alcuni effetti sottili per concentrarsi su messaggi importanti funzionano meglio.
2. Rompe il contesto. Lo scorrimento non dovrebbe portare ad azioni impreviste come la scomparsa di contenuti, finestre di dialogo modali, invii di moduli, reindirizzamenti ad altre pagine, ecc.

L'animazione può anche causare cinetosi e vertigini, quindi considera l'utilizzo della query multimediale CSS prefers-reduced-motion per disabilitare gli effetti.

Per favore, smetti di creare pagine a scorrimento infinito! I collegamenti a contenuti correlati sono utili, ma il caricamento automatico di contenuti casuali senza il consenso dell'utente spreca larghezza di banda. Rende difficile aggiungere una delle pagine ai segnalibri, rendendo impossibile raggiungere i dettagli di contatto e altre informazioni nel piè di pagina della pagina.

Articoli multipagina non necessari

Abbiamo visto tutti "articoli" che contengono un paragrafo di testo seguito da un collegamento alla pagina successiva. Queste pagine sono generalmente esche di collegamento senza contenuti sostanziali, ma non lo scoprirai finché non avrai guadato una moltitudine di pubblicità e impressioni sulla pagina.

Chiedere ai web marketer di fermare questa pratica è inutile, ma forse ci riconsidereranno se gli sviluppatori istruiranno le persone a non soccombere a queste sciocchezze!

Marketing manipolativo

Il web è il mercato più grande del mondo, con la capacità di vendere un'infinita varietà di prodotti fisici e digitali. Gli utenti torneranno ancora e ancora... a meno che tu non scelga di ricorrere a schemi oscuri per aumentare le vendite.

Lotte di abbonamento

Annullare l'iscrizione a notifiche o newsletter dovrebbe essere semplice come iscriversi, se non più semplice. Chiedere agli utenti di saltare gli ostacoli all'annullamento dell'iscrizione porta alla frustrazione e alla perdita di fiducia nel sito. Non c'è alcun motivo credibile per richiedere agli utenti di inviare via fax il loro certificato di nascita originale, tre prove di indirizzo e le ultime cartelle cliniche.

Annunci mascherati

Gli annunci pubblicitari sono sovrautilizzati su molti siti, ma gli esempi peggiori:

1. Sembra un menu o un'opzione;
2. Fingere di essere notizie o articoli informativi dal sito di origine; o
3. Mostra i controlli dell'interfaccia utente come un grande pulsante "DOWNLOAD" in una pagina su un prodotto software.

I siti non possono sempre determinare quale design degli annunci viene utilizzato, ma controllano il posizionamento. Inserire annunci in posizioni importanti per confondere le persone può aumentare i ricavi pubblicitari, ma quegli utenti torneranno?

Aggiunta automatica di prodotti ai carrelli della spesa

Può essere utile visualizzare un elenco di prodotti correlati o consigliati. Aggiungerli al carrello dell'utente senza il suo consenso è un'altra questione. Quante persone lo troveranno utile?

• Nella migliore delle ipotesi, una piccola percentuale di utenti noterà l'oggetto in più e deciderà di tenerlo.
• Una proporzione maggiore lo rimuoverà.
• Alcuni non se ne accorgeranno fino alla consegna, quindi si lamenteranno e chiederanno un rimborso.

Queste attività aumentano le vendite a scapito dell'assistenza clienti, dell'avviamento e dei continui acquisti di ritorno. La gestione di reclami e rimborsi può compensare qualsiasi aumento di redditività a breve termine.

Costi di acquisto nascosti

Non è piacevole perdere tempo a scegliere un prodotto, registrarsi, inserire i dettagli di consegna e pubblicare le informazioni di pagamento per scoprire che il prezzo è aumentato rispetto ai siti concorrenti. La pagina di riepilogo ora mostra i costi nascosti come consegna, assicurazione, gestione e speriamo che non te ne accorga.

I prezzi dovrebbero essere chiari e onesti, altrimenti i clienti perderanno fiducia nel servizio di e-commerce. Quando i costi di consegna variano in modo significativo, chiedi all'utente di inserire il proprio paese o codice postale prima di impegnarsi per l'acquisto.

Temporizzatori di disponibilità e scarsità di scorte artificiali

È utile sapere quando un articolo è disponibile, ma alcuni siti di e-commerce aumentano la credibilità. Più informazioni danno, meno credibili diventano:

"ACQUISTA ORA! 2 articoli in stock, 15 sono stati acquistati negli ultimi 3 minuti e 597 persone stanno visualizzando questa pagina.

Queste tattiche ad alta pressione diventano più sospette se applicate a oggetti digitali o di alto valore come auto e vacanze.

Gli utenti si rendono presto conto che questi messaggi sono inutili quando gli articoli rimangono in magazzino per molti giorni. Continueranno con l'acquisto quando non ci si può fidare dei messaggi di marketing del sito?

Vergogna di rinuncia

Anche alcune grandi società di e-commerce si dedicano a stupide tecniche di vergogna. Presenteranno una domanda di registrazione seguita da un grande pulsante "Accetto" e un link di annullamento più piccolo come:

• "No, non voglio la consegna gratuita illimitata."
• "No, non mi interessa la difficile situazione degli animali pelosi in via di estinzione."
• "No, voglio vedere il pianeta bruciare."

Funziona questa pratica? Forse. Ma stabilisce un rapporto onesto con il cliente e aumenta la fiducia nel sito?

Cancellazioni complesse di cookie

Il regolamento generale sulla protezione dei dati (GDPR) dell'UE richiede ai siti di mostrare un avviso di rinuncia per i cookie non essenziali e tecnologie di tracciamento simili. È imperfetto, ma la legislazione è ben intenzionata e un requisito legale in tutta Europa. Altri paesi potrebbero avere regole simili, sebbene di solito siano meno rigorose.

La maggior parte degli utenti accetterà e andrà avanti senza pensarci (il che vanifica in parte il punto della legislazione). La disattivazione dovrebbe essere altrettanto facile, tuttavia alcuni siti richiedono di:

• sfoglia le pagine/le schede del gergo prima di trovare le opzioni;
• fai clic su dozzine di caselle di controllo anche se ciò viola le regole del GDPR; e
• attendi fino a un minuto mentre "salvano le tue preferenze" (a cosa?).

Potrebbe persuadere alcuni utenti a premere "Accetto con tutti", anche se altri abbandoneranno il sito o passeranno alla modalità di lettura per nascondere l'avviso sui cookie. Nella migliore delle ipotesi, rendere difficile la rinuncia dà l'impressione che il sito abbia qualcosa da nascondere. Nel peggiore dei casi, questo modello oscuro è ai margini della legalità e potrebbe portare a multe o ad un aumento dei costi degli avvocati.

Tecnologia terribile

Tecnologie come HTML sono utilizzabili, accessibili e compatibili con le versioni precedenti immediatamente. Ci vuole uno sforzo particolare per buttare via questi benefici.

Rompere la funzionalità del browser

Il pulsante Indietro è stato il più grande contributo del web alle interfacce utente. È pratico e compreso da chiunque abbia un'esperienza tecnica minima. Tuttavia i siti lo rompono aprendo nuove finestre/schede, facendo scadere la pagina precedente o dicendo agli utenti di non utilizzare i controlli del browser.

Non ci sono ragioni tecniche per interrompere la funzionalità del browser. Il tentativo di aggirare i controlli è un problema di progettazione che confonde gli utenti e rende un sistema web meno utilizzabile.

Altri problemi da evitare:

1. Non disabilitare i menu del tasto destro del mouse o del tocco lungo.
2. Non disabilitare la copia o aggiungere altro testo “utile”.
3. Non interrompere il bookmarking nella tua app a pagina singola non aggiornando l'URL.

Ma il peggiore di tutti questi problemi è il prossimo nella nostra lista.

Disabilitazione Incolla sui campi password

La disabilitazione di incolla per qualsiasi motivo non è necessaria. Disabilitare l'incolla su un campo password è odioso, ma incontrerai questa restrizione su siti di grandi dimensioni: dovrebbero conoscerli meglio. L'ho visto impiegato dalle principali banche internazionali.

La pratica è probabilmente implementata per dubbi motivi di sicurezza. Se l'utente non può incollare, è ovvio che non può riutilizzare una password da un'altra parte. Sfortunatamente, impedisce anche alle persone di utilizzare un'applicazione di gestione delle password. Non è più possibile generare stringhe casuali, lunghe e altamente sicure che non sono pratiche da digitare.

Inoltre, gli sviluppatori possono disabilitare le restrizioni di incollaggio con alcune modifiche di DevTool. Altri farebbero fatica ed è più probabile che utilizzino password deboli. Non disabilitare mai l'incolla: per te è meno lavoro e migliora la sicurezza del sistema.

Restrizioni password stupide

"La tua password deve essere compresa tra 8 e 12 caratteri e richiede almeno un carattere maiuscolo, un numero e un simbolo, ma per favore non utilizzare ` ' ” / \ o ;”

Non c'è una buona ragione per implementare rigide restrizioni sulle password. Chiedilo a te stesso:

1. Il sistema memorizza la password come testo normale in un database anziché eseguirne l'hashing?
2. Un esperto di sicurezza ha suggerito di impedire alle persone di utilizzare password semplici come password , qwerty o 123456 ? Questo è vero, ma impedisce anche alle persone di utilizzare password più complesse e fornisce un pratico modello per il cracking a forza bruta.

Un'unica regola impone password complesse: una lunghezza minima lunga. Ogni carattere aggiuntivo aumenta esponenzialmente la complessità e i tempi di cracking.

Salto di contenuti per dispositivi mobili

Leggere contenuti su uno smartphone può essere un'esperienza frustrante. Sei assorbito da un articolo quando il contenuto salta fuori dallo schermo e perdi il tuo posto. Passi quindi alcuni secondi a scorrere freneticamente su e giù. O peggio, farai clic su un collegamento o un pulsante nel momento in cui si sposta e si verifica un'azione imprevista. Alcuni lettori perderanno il loro slancio, si arrenderanno e se ne andranno prima che tu possa convertirli in clienti.

Il salto di contenuto si verifica quando un'immagine o un iframe (in genere un annuncio pubblicitario) viene caricato sopra il punto di scorrimento della vista. Una volta caricato il contenuto, il browser può determinarne le dimensioni e posizionarlo sulla pagina. Pertanto, un'immagine di altezza 500px (mostrata a dimensione intera) spinge il contenuto verso il basso della stessa quantità.

La metrica Cumulative Layout Shift (CLS) di Google misura i salti di contenuto e penalizza i siti di conseguenza. Questo era un problema complesso, ma ora sono disponibili diverse soluzioni tecniche:

• Aggiungi gli attributi di larghezza e altezza agli elementi HTML img e iframe o utilizza la proprietà CSS aspect-ratio per riservare spazio sulla pagina prima del caricamento della risorsa.
• Imposta le dimensioni per gli elementi del contenitore che racchiudono risorse a caricamento più lento come annunci, immagini e widget di social media.
• Richiedi immagini più grandi il prima possibile e considera l'utilizzo di collegamenti di precaricamento nella tua head HTML.
• Ottimizza l'utilizzo dei caratteri web e utilizza fallback di dimensioni simili per ridurre al minimo i cambiamenti di layout.
• Evita di inserire elementi nella parte superiore della pagina a meno che non si tratti di un aggiornamento DOM attivato a seguito di un'azione dell'utente, ad esempio un clic.
• Usa il contenimento CSS per ottimizzare il rendering dei blocchi di contenuto. Potrebbe essere possibile definire elementi che non influiranno sul dimensionamento o sulla posizione degli altri.

Quando il social sign-on fa schifo

Tecnologie come OAuth consentono agli utenti di registrarsi rapidamente su un sito utilizzando un altro account come Google, Facebook, Twitter, LinkedIn o Github. Ben implementata, è un'opzione pratica che fornisce un processo di registrazione più fluido, fa risparmiare tempo e porta a conversioni più elevate.

Se implementato male, un sito ti chiederà successivamente di inserire la tua email, i tuoi dati personali e persino una password "per i loro archivi".

Non tutti i provider passeranno le informazioni dell'utente, quindi evita OAuth se il tuo sito richiede che questi dettagli siano funzionali. OAuth non dovrebbe mai diventare un passaggio non necessario che rallenta il processo di registrazione.

Scarse prestazioni web

Secondo l'archivio HTTP, una pagina Web media impiega sette secondi per essere caricata su un dispositivo desktop e venti secondi su un dispositivo mobile. Una singola visualizzazione di pagina effettua 70 richieste HTTP, scarica più di 2 MB di dati ed emette 1,3 g di CO² nell'atmosfera (vedi Website Carbon Calculator). Questa è una media: molti siti sono peggiori.

Nessuno si propone di creare un sito lento, ma l'aggiunta di funzionalità spesso supera i miglioramenti delle prestazioni. Dato che è possibile creare un clone di Quake giocabile in 13Kb, devi chiederti perché due paragrafi di marketing waffle in una pagina "Chi siamo" richiedono un download 154 volte più grande!

Affrontare le prestazioni richiede una combinazione di tecniche, ma devi ricordare solo un punto chiave: non inviare così tante cose!

Widget subdoli dei social media

I widget dei social media come i pulsanti "Mi piace" sembrano innocenti ma:

1. Ognuno aggiunge centinaia di kilobyte di codice JavaScript che influisce sulle prestazioni della pagina.
2. Il codice è un rischio per la sicurezza poiché viene eseguito con le stesse autorizzazioni del JavaScript del sito.
3. I widget implementano il tracciamento degli utenti anche quando non sono attivati. Ciò potrebbe portare a problemi legali in alcuni territori.
4. Quasi nessuno li usa: sarai fortunato a vedere l'1% di coinvolgimento degli utenti.

Anche i widget non sono necessari. La maggior parte dei siti di social media fornisce collegamenti standard che mantengono la condivisione senza alcun rischio per le prestazioni, la sicurezza o la privacy, ad es

• Email: mailto:?subject=[title]&body=[url]
• Facebook: https://www.facebook.com/sharer.php?u=[url]
• Twitter: https://twitter.com/share?url=[url]&text=[title]
• LinkedIn: https://www.linkedin.com/shareArticle?url=[url]&title=[title]
• Reddit: https://reddit.com/submit?url=[url]&title=[title]

Dove [url] è l'URL della pagina corrente e [title] è l'intestazione principale. Un link <a> standard funziona bene, ma puoi migliorarlo per aprire la pagina in una finestra pop-up se vuoi che si comportino in modo identico ai pulsanti standard.

CAPTCHA

CAPTCHA è l'abbreviazione di Test di Turing pubblico completamente automatizzato per distinguere i computer dagli esseri umani. Aiuta a prevenire l'accesso di bot o altre macchine ai sistemi web. Spesso ti viene chiesto di inserire il testo mostrato in un'immagine indecifrabile o di fare clic sui quadrati che contengono biciclette. (Conta una bici montata su un'auto? E quel triciclo? C'è una bici dietro quel muro!?)

I CAPTCHA hanno tre problemi fondamentali:

1. Sono volutamente difficili per gli umani non disabili con una vista perfetta. Come dovrebbero far fronte le persone con disabilità visive o di altro tipo?
2. Devono diventare più complessi man mano che i robot e le tecniche di intelligenza artificiale migliorano.
3. Impongono l'onere della sicurezza dell'accesso agli utenti, non ai proprietari o agli sviluppatori del sito, i beneficiari primari.

I CAPTCHA sono eccessivi sulla maggior parte dei siti web. Potresti prendere in considerazione opzioni alternative ai CAPTCHA che causano un minore sforzo umano:

• I campi honeypot nascosti bloccano l'invio di moduli quando i bot aggiungono dati.
• Verificare che gli eventi della tastiera come input o keydown vengano attivati ​​in modo appropriato.
• Controlla il tempo necessario per completare e inviare un modulo: l'attività del bot è spesso istantanea.
• Crea un processo di invio in due fasi che chieda all'utente di confermare i propri dati o una domanda aggiuntiva prima dell'invio.

Questi fermeranno la maggior parte dei robot. È possibile ignorare qualsiasi tecnica, ma richiede uno sforzo di sviluppo aggiuntivo specifico per il tuo sito. Pochi sviluppatori di bot si preoccuperanno quando ci sono migliaia di altri siti con vulnerabilità note.

Sommario

Il web è un posto fantastico, ma alcune pratiche dubbie possono rovinare quella percezione. Certo, puoi essere truffato ovunque, ma il web consente ai perpetratori di raggiungere migliaia di persone con pochi costi o sforzi. E quando le grandi aziende multimiliardarie usano modelli oscuri incautamente, è decisamente vergognoso!

I siti utilizzano modelli scuri perché funzionano. Ma è un pensiero a breve termine. I visitatori diventano sempre saggi con le tecniche nefaste e potrebbero non tornare mai più.

Fai la cosa giusta, crea fiducia nel tuo marchio e conserverai i clienti senza dover ricorrere a schemi oscuri.

Hai altri pensieri sui modelli oscuri che hai incontrato? Si prega di condividerli nella sezione commenti qui sotto!