it-swarm-eu.dev

Perché le persone non notano il nostro enorme banner viola, prominente, chiaro e contrastante?

Faccio parte di un sito MediaWiki chiamato D&D Wiki . Tra gli altri , uno dei nostri problemi di vecchia data agli occhi del pubblico è stato il nostro fallimento nell'etichettare abbastanza chiaramente che alcune pagine sono classificate come "Homebrew", al contrario di " Ufficiale'.

Di conseguenza, abbiamo inserito una soluzione in cui tutte le pagine che non sono "Ufficiali" sono etichettate con questo delizioso banner homebrew . In contrasto con la luce del sito, di color crema-marrone, sfacciatamente visualizzato, questo straordinario banner nero/viola scuro/rosso a tutta pagina, completo di testo bianco con bordi neri che mostra in modo molto ampio e chiaro le parole "Pagina Homebrew", con un extra spiegazione minore.

pagine ufficiali e pagine homebrew hanno schemi di colori diversi, caratteri diversi, dimensioni del testo diverse, layout di tabella diversi, schemi di titoli diversi e, in particolare, un banner diverso dichiarandolo "contenuto ufficiale" che è notevolmente diverso a prima vista.

Tuttavia, ho ascoltato più volte da reddit, alla nostra chat, lo stackexchange stesso, e cito: " il banner homebrew è inspiegabilmente difficile da notare nonostante sia viola brillante. ". In qualche modo le persone stanno ancora mescolando queste due categorie di pagine?

Professo la mia incapacità di comprendere questa situazione. Abbiamo superato la percezione umana? L'abbiamo reso così evidente, così ... ovvio, che non poteva essere visto dall'interno; Come se l'umanità stessa non fosse consapevole dell'intero universo che li circonda?

Come facciamo in modo che le persone notino davvero il nostro banner? O c'è un modo migliore per informare le persone sulla natura homebrew del contenuto che stanno vedendo? Questi ciechi sono tutti strani mostri o sono in qualche modo fuori di testa?

enter image description here

EDIT: Grazie a tutti per l'interesse e le risposte utili! Per coloro che sono interessati, la nostra discussione successiva sull'argomento può essere trovata sul sito, qui .

219
user2979044

Questo fenomeno si chiama cecità del banner . L'etichettatura appare come un banner pubblicitario ed è quindi inconsciamente ignorata. Gli utenti sono stati condizionati a ignorare sezioni complete di contenuto se la loro precedente esperienza aveva insegnato loro che contiene sempre elementi irrilevanti. Più attenzione il banner cerca di attirare, più viene ignorato. Se vuoi che le persone notino un'etichetta come "homebrew" o "ufficiale", devi posizionarla in un luogo in cui gli utenti scansionano naturalmente.

Nel tuo caso, considera di metterlo accanto al titolo della pagina. Potresti anche voler lavorare con le icone di avviso, in quanto queste tendono a non essere ignorate dagli utenti se vengono utilizzate in modo sparso. Preferibilmente un colore contrastante con il resto della combinazione di colori.

571
Wanda

Il banner è bellissimo ma lo stile non corrisponde al resto della pagina. Sai cosa c'è ovunque su Internet con stili grafici senza eguali? Ads .

Come altri hanno già detto, il problema è che gli utenti non lo considerano come parte del contenuto. Sembra essere un annuncio, quindi lo saltano.

Penso che l'azione cruciale da prendere sia quella di integrarla profondamente con il resto della pagina. Rendilo parte del contenuto e, soprattutto, adatta lo stile in modo che non sembri estraneo.

Inoltre, c'è una striscia XKCD sull'aspetto simile a un annuncio .

260
Rad80

È il design. Visivamente non fa parte del sito o della pagina. È un quadrato di contenuti che non appartiene visivamente al sito che indica che è una pubblicità per gli utenti.

Progetta il banner in modo che faccia parte del sito visivamente.

Il modo più semplice è progettarlo dal suo design circostante. Questo lo rende parte del sito visivamente. Di seguito è riportato un esempio.

Qui puoi vedere quanto è invadente il banner viola quando viene rimosso:

enter image description here

Ecco un esempio del banner progettato per far parte del sito:

enter image description here

116
moot

Come detto in precedenza, il banner induce la cecità del banner non nonostante ma perché è viola così enorme, prominente, chiaro e contrastante. Inoltre, il suo posizionamento appena sopra il contenuto lo rende facile da ignorare. Il lettore inizia a leggere il titolo. Qualunque cosa sopra di esso viene facilmente ignorata.

Possibili soluzioni:

  • Inserisci tutto il contenuto di "Homebrew" in un tuo spazio dei nomi Wiki, proprio come hai fatto con il materiale SRD. In questo modo i titoli di tutti gli articoli homebrew leggono "5e Homebrew: ArticleTitle" proprio come il materiale ufficiale recita "5e SRD: ArticleTitle".
  • Inserisci il banner che dice all'utente cosa sta leggendo sotto il titolo. Non usare un'immagine. Utilizzare un box modello che utilizza la normale sintassi di markup MediaWiki in modo che si integri meglio con il design del sito. Puoi usare i modelli di Wikipedia come "Questo articolo ha bisogno di lavoro" o "la neutralità di questo articolo è contestata" come esempi. I Wikipediani hanno trovato un buon equilibrio tra l'essere abbastanza visibili e il non essere così visibili da indurre la cecità dello stendardo.
  • Crea due wiki completamente separati, uno per l'homebrew e uno per il materiale ufficiale. Dai loro nomi e loghi diversi.
57
Philipp

Se guardi un articolo di Wikipedia con un banner che non è funzionalmente diverso dal tuo (questo articolo deve essere migliorato) , vedrai che ci sono alcune differenze di design. Vale a dire:

  • Il banner fa parte dell'articolo, posizionato direttamente sotto il titolo dell'articolo
  • Il banner non è largo quanto l'articolo, è centrato ma leggermente più piccolo del testo dell'articolo.
  • Ha colori neutri, corrispondenti al resto della pagina, ma c'è un'icona a contrasto che attira l'attenzione su di essa.
  • Il testo nel banner non è standard, con parti in grassetto e corsivo e vari collegamenti blu.

Tutto ciò rende il banner difficile da perdere e facile da analizzare. Se apri la pagina, la noterai immediatamente ed è facile indovinare cosa sta cercando di dirti.
Applicando questo al tuo banner, creerei un'area di riempimento tra i bordi del banner e i bordi dell'articolo. In questo momento sembra una barra delle applicazioni, una barra dei menu o un banner pubblicitario, qualcosa da ignorare a meno che tu non lo stia cercando. Avrei abbandonato il colore di sfondo contrastante, optando per una singola icona con il testo su uno sfondo semplice per comunicare il suo intento. Se ritieni che con queste modifiche il banner non attiri abbastanza attenzione, puoi provare a cambiarne la posizione, giocarci e forse cambiare la formattazione del testo. Puoi aggiungere un link a una pagina con una spiegazione più completa e forse fare homebrew page e d&d wiki grassetto.

In alternativa, se sei abbastanza coraggioso, potresti provare a modificare il carattere dell'articolo. Penso che per qualcosa come una wiki D&D potresti cavartela con un font in stile calligrafia (uno che è ancora leggibile) per articoli fatti dagli utenti. Distingue chiaramente gli articoli degli utenti da quelli ufficiali e, a causa dello scontro formale/informale, potrebbe trasmettere l'intento in quel modo. Sarebbe quindi più simile alle "note" di un utente su un argomento, anziché su un articolo.

29
kevin

enter image description here

Posso suggerire di provare nastri Github .

Ciò è notevolmente evidente e non toglie il resto del contenuto.

Avere un nastro per "ufficiale" e "homebrew" con colori diversi.

15
icc97

Dici di avere diversi colori, caratteri eccetera, ma nel complesso le pagine sembrano molto simili. Una grande pagina ha così tanto rumore visivo che semplicemente cambiare il carattere thw non sarà sufficiente se è ancora un layout simile (barra laterale, 3 colonne, stesso logo principale). L'unica cosa che si nota in un colpo d'occhio è che lo sfondo e il beige/bianco si adattano perfettamente alle altre tinte beige e marrone in modo che l'utente 3 non percepisca realmente lo scambio di sfondo.

E come altri hanno già detto, le persone tendono a ignorare i banner perché di solito sono pubblicità.

Suggerirei di cambiare l'intera tavolozza dal beige al viola (non brillante, più pastello come la lavanda) e forse cambierei leggermente il logo wiki nella parte superiore sinistra in un colore diverso e forse aggiungerei un tagline "homebrew" sotto. Terrei i caratteri e lo stesso su entrambi i siti per mantenere ancora una certa coerenza tra i due.

enter image description hereenter image description here

8
PixelSnader

pagine ufficiali e pagine homebrew hanno schemi di colori diversi, caratteri diversi, dimensioni del testo diverse, layout di tabella diversi, schemi di titoli diversi e, in particolare, un banner diverso dichiarandolo "contenuto ufficiale" che è notevolmente diverso a prima vista.

...

Come facciamo in modo che le persone notino davvero il nostro banner? O c'è un modo migliore per informare le persone sulla natura homebrew del contenuto che stanno vedendo?

Ho seguito un link dalla domanda a una pagina con un banner homebrew e poi ho cercato di trovare una pagina ufficiale per contrastare gli stili. Il primo che ho trovato è stato https://www.dandwiki.com/wiki/3e_SRD:Multiclass_Characters . Ora, forse sono un mostro strano cieco1, ma non riesco a vedere il diverso banner in questa pagina e non riesco a vedere la diversa combinazione di colori. Lo stile del testo è diverso, ma a meno che non si canalizzi tutti gli utenti del sito attraverso un tutorial che spiega come leggere le differenze, non è molto.

Prendi in considerazione di apportare modifiche più drastiche alla combinazione di colori o (la mia preferenza) andare oltre la combinazione di colori per cambiare lo sfondo. Una debole filigrana che si ripete sullo sfondo non attiva lo stesso istinto di ignorare come uno striscione (in qualsiasi posizione, di qualsiasi dimensione) e non viene saltato dallo scorrimento.


1 Sicuramente farò due poliziotti.

6
Peter Taylor

Direi che il problema è duplice. Credo, innanzitutto, che il problema sia che il sito web è etichettato come Wiki e sta comunicando male le sue intenzioni ai visitatori. Per questo motivo, è più probabile che le persone presumano che qualsiasi informazione su questo sito sarà riferimento a informazioni esistenti trovate nel materiale D&D di Wizards of the Coast. Una wiki non è davvero un luogo per contenuti creati dai fan. È improbabile che tu trovi contenuti dei fan su un sito Wiki che ruota attorno a Star Trek, per esempio.

L'altro problema è che, come altri hanno risposto, la barra di notifica homebrew nella parte superiore dello schermo si trova in una posizione che sarebbe principalmente riservata agli annunci. I colori contrastanti dal resto del sito causano inavvertitamente le persone a distogliere lo sguardo perché non si preoccupano di guardare ciò che interpretano come un annuncio.

6
Fluffy Gryphon

Credo che la gente abbia smesso di scansionare Banner poco fa. Sono cosmetici o sono per pubblicità.

Avresti maggiori possibilità di avere una piccola icona di avviso e il messaggio all'inizio della sezione o qualcosa di simile.

In questo modo l'utente inizierà a leggere il contenuto e noterà l'icona + il testo.

TL; DR: le persone ignorano inconsciamente i banner

3
Leths

Sarò onesto, ho guardato le pagine homebrew di D & DWiki innumerevoli volte in passato, e questa è la prima volta che ho notato quel banner. Voglio dire, lo so di averlo visto prima, ma è sempre stato registrato come banner pubblicitario e non come parte della pagina stessa, quindi l'ho sempre ignorato.

3
MalignantMind

Vedo alcune possibili cause per cui il banner homebrew viene ignorato da alcuni utenti del tuo sito Web:

  1. La parte viola del banner è al di fuori del flusso di lettura del sito Web. In un layout a colonne la seconda e la terza colonna sono naturalmente lasciate da leggere alla fine. La parte viola sembra una seconda colonna nel banner. La parte nera scorre piacevolmente al contenuto del sito. Sembra parte della prima colonna di testo, spingendo l'utente al contenuto. Quando l'utente passa dalla parte inferiore di una colonna alla parte superiore della successiva, si ferma nella regola orizzontale. Il differenziale di colore del banner e il testo di avvertimento che attraversa lo spazio tra le colonne agiscono anche regole orizzontali extra virtuali. In breve, la parte scura del banner porta direttamente al contenuto e le regole orizzontali impediscono agli utenti di tornare al banner in quest'ultimo.

  2. Il contrasto richiama l'attenzione. Il contrasto più grande si trova a sinistra del banner e porta l'utente ad avviare il flusso di lettura del colunare.

  3. Troppo testo per ottenere il significato. Le persone devono leggere la lunga spiegazione nel banner per capire cosa intendi. Forse non hai bisogno di un banner, ma solo un testo di intestazione semplice e più piccolo come "CONTENUTO NON UFFICIALE: questa pagina è stata creata da un utente (...)". Le espressioni piccole, dirette e chiare in posizioni chiave hanno più possibilità di catturare l'attenzione dell'utente.

  4. L'avvertimento sul banner contraddice il significato di "Homebrew". Questo aiuta il nostro subconscio a filtrarlo. Le bevande homebrew sono di solito un prodotto speciale realizzato a mano dal proprietario della casa. Il proprietario è il webmaster. Quindi, trasmette la sensazione che sia una sezione di contenuti speciali del webmaster. Pertanto ufficiale. Esattamente il contrario di quanto afferma l'avvertimento.

  5. Come altri hanno già detto, sembra un banner pubblicitario e la combinazione di colori non corrisponde al sito Web.

0
Lucas

Alcune delle risposte qui sono troppo complesse (è il fenomeno "esperti che affrontano i problemi degli esperti": in cui un gruppo di grandi esperti "non si preoccupa nemmeno di sottolineare" gli ovvi problemi!)

Spiegherò umilmente il

Due problemi ridicolmente ovvi:

  1. Il tipo su un'immagine è illeggibile. Questo è uno dei punti più elementari della progettazione grafica. Hai digitato un'immagine, quindi è totalmente illeggibile.

  2. Il tipo a destra ha "bordo" tutto intorno. Questo è totalmente illeggibile. Ancora una volta questo è un problema di base nella progettazione grafica.

Onestamente è così semplice.

0
Fattie

Le persone sono eccellenti nell'ignorare ciò che non porta ai loro obiettivi (in questo caso probabilmente "voler leggere su D&D").

Questo banner/avviso/suggerimento sembra che mi porterà alle statistiche di Snarky Silver Dragon? No → ignora.

Ciò accade inconsciamente senza che le persone se ne accorgano (abbiamo avuto dei test di tracciamento oculare che mostravano uno sguardo sulla cosa e le persone erano totalmente inconsapevoli dell'elemento quando gli veniva chiesto), quindi se vuoi migliorare leggermente (impostiamo un obiettivo realistico) percentuale di persone che notano il messaggio, ecco alcune idee:

  • rallenta le persone: può esserci un overlay con un avviso e un pulsante su cui devono fare clic ("Sì, accetto questa pagina non descrive D&D Canon.")
  • rallentali ancora di più (aggiungi una casella di controllo "Accetto quello" che deve essere selezionata prima che sia possibile nascondere la sovrapposizione)
  • rendilo parte del contenuto in modo che appaia come quello che stanno cercando (magari posto sotto l'intestazione) e rendilo più simile al contenuto ("Disclaimer: questa pagina è un homebrew e non descrive un Canon D&D . ") - forse uguale al testo del paragrafo, ma con qualche bordo e forse un'icona di punto esclamativo?
  • metti l'informazione che questo è un homebrew da qualche parte dove stanno già rallentando e pensando: la mia idea è di farlo sui link. Ad esempio, i collegamenti Canon sarebbero semplici, ma i collegamenti alle pagine homebrew avrebbero tutti "(Homebrew)" e forse qualche icona aggiunta? E potrebbero avere un colore diverso? E un "?" tooltip che spiegherebbe cos'è l'homebrew al passaggio del mouse?
0
Tomáš Kafka

Altre persone l'hanno toccato, ma: il fatto stesso che il banner sia esteticamente gradevole suggerisce che è lì essere esteticamente gradevole. Un concetto di base del design è che se vuoi essere chiaro che qualcosa è lì per fare X, allora dovresti farlo in modo che possa fare solo X. Se guardo un muro e vedo una macchia rettangolare che è una brutta ombra di verde, probabilmente chiederò "A cosa serve" e noterò che è una porta. Se c'è una toppa rettangolare che ha una bella immagine cosmica dipinta su di essa, probabilmente ci vorrà più tempo per registrare che è una porta, e non solo un dipinto. Se le persone vedono qualcosa senza uno scopo apparente, allora si chiederanno a cosa serve. Una volta che uno scopo può essere assegnato a qualcosa, le persone tendono a non sedersi attorno a chiedersi se manca qualche altro scopo.

L'immagine drammatica distoglie anche l'attenzione dal testo e rende più difficile la lettura se la gente se ne accorge. Sarebbe più efficace per l'intera pagina avere un bordo distintivo e/o un carattere diverso.

0
Acccumulation