it-swarm-es.com

¿Por qué la gente no nota nuestra enorme pancarta púrpura, prominente, clara y contrastante?

Soy parte de un sitio de MediaWiki llamado D&D Wiki . Entre otros , uno de nuestros problemas de larga data en el ojo público fue nuestra incapacidad de etiquetar con suficiente claridad que ciertas páginas se clasifican como 'Homebrew', en lugar de ' Oficial'.

En consecuencia, introdujimos una solución en la que todas las páginas que no son 'Oficiales' están etiquetadas con este hermoso banner de homebrew . En contraste con la luz, marrones cremosos del sitio, se muestra descaradamente esta pancarta llamativa en negro/púrpura/rojo en toda la página, completa con texto en blanco con borde negro que muestra en gran medida y claramente las palabras "Página Homebrew", con extra explicación menor.

Páginas oficiales y páginas homebrew tienen diferentes esquemas de color, diferentes fuentes, diferentes tamaños de texto, diferentes diseños de tabla, diferentes esquemas de título y, en particular, un diferente banner declarándolo 'contenido oficial' que es notablemente diferente a simple vista.

Sin embargo, he escuchado varias veces desde reddit, a nuestro chat, para intercambiar eso, y cito: " el banner de homebrew es inexplicablemente difícil de notar a pesar de ser de color púrpura brillante ". ¿De alguna manera la gente todavía está confundiendo estas dos categorías de páginas?

Profeso mi propia incapacidad para comprender esta situación. ¿Sobrepasamos la percepción humana? ¿Lo hicimos tan notable, tan ... obvio, que no se podía ver desde adentro; ¿Como si la humanidad misma no fuera consciente de la totalidad del universo que los rodea?

¿Cómo hacemos que la gente realmente note nuestro banner? ¿O hay una mejor manera de informar a las personas sobre la naturaleza casera del contenido que están viendo? ¿Son estas personas ciegas todos los fenómenos extraños, o estoy de alguna manera loco?

enter image description here

EDITAR: ¡Gracias a todos por el interés y las respuestas útiles! Para aquellos interesados, nuestra discusión posterior sobre el asunto se puede encontrar en el sitio, aquí .

219
user2979044

Este fenómeno se llama ceguera de banner . Su etiquetado parece un anuncio publicitario y, por lo tanto, se omite inconscientemente. Los usuarios han sido condicionados a ignorar secciones completas de contenido si su experiencia previa les enseñó que siempre contiene cosas irrelevantes. Cuanta más atención intenta atraer el banner, más se ignora. Si desea que las personas noten una etiqueta como "homebrew" u "oficial", debe colocarla en un lugar que los usuarios estén escaneando de forma natural.

En su caso, considere colocarlo junto al título de la página. También es posible que desee trabajar con iconos de alerta, ya que los usuarios no los ignoran si se usan con poca frecuencia. Preferiblemente un color contrastante con el resto de su esquema de color.

571
Wanda

El banner es hermoso pero el estilo no coincide con el resto de la página. ¿Sabes qué hay en todas partes en Internet con estilos gráficos inigualables? Anuncios .

Como han dicho otros, el problema es que los usuarios no lo consideran como parte del contenido. Parece ser un anuncio, por lo que lo omiten.

Creo que la acción crucial a tomar es integrarlo profundamente con el resto de la página. Hágalo parte del contenido y, lo más importante, ajuste el estilo para que no se sienta extraño.

Además, hay una tira de XKCD sobre parecer un anuncio .

260
Rad80

Es el diseño. Visualmente no es parte del sitio o página. Es un cuadrado de contenido que no pertenece visualmente al sitio, lo que indica que es un anuncio para los usuarios.

Diseñe el banner para que sea parte del sitio visualmente.

La forma más simple es diseñarlo a partir de su diseño circundante. Esto lo hace parte del sitio visualmente. A continuación se muestra un ejemplo.

Aquí puede ver cuán molesto es el banner púrpura cuando se quita:

enter image description here

Aquí hay un ejemplo del banner diseñado para ser parte del sitio:

enter image description here

116
moot

Como se dijo anteriormente, el banner induce ceguera de banner no a pesar de sino porque Es tan enorme, prominente, claro y contrastante de color púrpura. Además, su ubicación justo encima del contenido hace que sea fácil de ignorar. El lector comienza a leer en el titular. Cualquier cosa por encima se ignora fácilmente.

Soluciones posibles:

  • Coloque todo el contenido de "Homebrew" en un espacio de nombres Wiki propio, tal como lo hizo con el material SRD. De esa manera, los titulares de todos los artículos de homebrew dicen "5e Homebrew: ArticleTitle" al igual que el material oficial dice "5e SRD: ArticleTitle".
  • Ponga el banner que le dice al usuario lo que está leyendo debajo del título . No uses una imagen. Use un cuadro de plantilla que use la sintaxis de marcado normal de MediaWiki para que se combine mejor con el diseño del sitio. Puede usar las plantillas de Wikipedia como "Este artículo necesita trabajo" o "la neutralidad de este artículo está en disputa" como ejemplos. Los Wikipedia descubrieron un equilibrio bastante bueno entre ser lo suficientemente visible y no ser tan visible como para inducir ceguera de pancarta.
  • Crea dos wikis completamente separados, uno para homebrew y otro para material oficial. Dales diferentes nombres y logotipos.
57
Philipp

Si miras un artículo de Wikipedia con un banner que no es funcionalmente diferente al tuyo (este artículo necesita mejorar) , verás que hay una serie de diferencias de diseño. A saber:

  • El banner es parte del artículo, colocado directamente debajo del título del artículo
  • El banner no es tan ancho como el artículo, está centrado pero es ligeramente más pequeño que el texto del artículo.
  • Tiene colores neutros, que coinciden con el resto de la página, pero hay un icono contrastante que llama la atención.
  • El texto en el banner no es estándar, con partes en negrita y cursiva y varios enlaces azules.

Todo esto hace que el banner sea difícil de perder y fácil de analizar. Si abre la página, lo notará de inmediato y es fácil adivinar lo que está tratando de decirle.
Aplicando esto a su banner, crearía un área de relleno entre los bordes del banner y los bordes del artículo. En este momento, parece una barra de tareas, una barra de menú de ventana o un banner publicitario, algo que debe ignorarse a menos que lo esté buscando. Dejaría de lado el color de fondo contrastante, optando por un solo icono con texto en un fondo plano para comunicar su intención. Si cree que con estos cambios el banner no llama la atención suficiente, puede intentar cambiar su posición, jugar con eso y quizás cambiar el formato del texto. Puede agregar un enlace a una página con una explicación más completa y quizás hacer homebrew page y d&d wiki negrita.

Alternativamente, si eres lo suficientemente valiente, puedes intentar alterar la fuente del artículo. Creo que para algo como un wiki de D&D podría salirse con la suya con una fuente de estilo de escritura a mano (una que todavía es legible) para artículos creados por el usuario. Distingue claramente los artículos de usuario de los oficiales y, debido al choque formal/informal, puede transmitir la intención de esa manera. Entonces se volvería más como las 'notas' de un usuario sobre un tema, en lugar de un artículo.

29
kevin

enter image description here

¿Puedo sugerir probar el cintas de Github .

Esto es notablemente notable y no quita el resto del contenido.

Tenga una cinta para 'oficial' y 'homebrew' con diferentes colores.

15
icc97

Dices que tienes diferentes colores, fuentes, etc., pero en general las páginas se ven muy similares. Una página grande tiene tanto ruido visual que simplemente cambiar la fuente no será suficiente si sigue siendo un diseño similar (barra lateral, 3 columnas, el mismo logotipo principal). Lo único que se nota de un vistazo es que el fondo y el beige/blanco encajan estrechamente con los otros tonos beige y marrón para que el usuario realmente no perciba el cambio de fondo.

Y como otros mencionaron, las personas tienden a ignorar los banners porque generalmente son anuncios.

Sugeriría cambiar toda la paleta de beige a púrpura (no brillante, más pastel como la lavanda) y tal vez cambiar ligeramente el logotipo de wiki en el topleft a un color diferente y tal vez agregar un lema "homebrew" debajo. Mantendría las fuentes y lo mismo en ambos sitios para mantener cierta coherencia entre los dos.

enter image description hereenter image description here

8
PixelSnader

Páginas oficiales y páginas homebrew tienen diferentes esquemas de color, diferentes fuentes, diferentes tamaños de texto, diferentes diseños de tabla, diferentes esquemas de título y, en particular, un diferente banner declarándolo 'contenido oficial' que es notablemente diferente a simple vista.

...

¿Cómo hacemos que la gente realmente note nuestro banner? ¿O hay una mejor manera de informar a las personas sobre la naturaleza casera del contenido que están viendo?

Seguí un enlace de la pregunta a una página con un banner de homebrew y luego intenté encontrar una página oficial para contrastar los estilos. El primero que encontré fue https://www.dandwiki.com/wiki/3e_SRD:Multiclass_Characters . Ahora, tal vez soy un bicho raro ciego1, pero no puedo ver el banner diferente en esta página, y no puedo ver el esquema de color diferente. El estilo del texto es diferente, pero a menos que canalice a todos los usuarios del sitio a través de un tutorial que explica cómo leer las diferencias, eso no es mucho.

Considere realizar cambios más drásticos en el esquema de color o (mi preferencia) ir más allá del esquema de color para cambiar el fondo. Una marca de agua que se repite levemente en el fondo no provoca el mismo instinto de ignorar que un banner (en cualquier posición, de cualquier tamaño) y no se omite al desplazarse.


1 Ciertamente me encargaré de dos de esos.

6
Peter Taylor

Yo diría que el problema es doble. Creo, en primer lugar, que el problema es que el sitio web está etiquetado como Wiki y está comunicando mal sus intenciones a los visitantes. Debido a esto, es más probable que las personas asuman que cualquier información en este sitio va a ser referencias de información existente encontrada en el material de D&D de Wizards of the Coast. Un wiki no es realmente un lugar para contenido hecho por fanáticos. Es poco probable que encuentres contenido de fans en un sitio Wiki que gira en torno a Star Trek, por ejemplo.

El otro problema es que, como han respondido otros, su barra de notificaciones homebrew en la parte superior de la pantalla se encuentra en una posición que estaría reservada principalmente para anuncios. Los colores contradictorios del resto del sitio provocan inadvertidamente a las personas a desviar su mirada porque no les importa mirar lo que interpretan como un anuncio.

6
Fluffy Gryphon

Creo que la gente dejó de escanear Banner hace un tiempo. Son cosméticos o son para anuncios.

Tendría una mejor oportunidad al tener un pequeño ícono de advertencia y el mensaje al comienzo de la sección, o algo similar.

De esta manera, el usuario comenzará a leer el contenido y notará el ícono + texto.

TL; DR: las personas ignoran inconscientemente pancartas

3
Leths

Voy a ser sincero, he visto las páginas de homebrew de D & DWiki en innumerables ocasiones en el pasado, y esta es la primera vez que noto ese banner. Quiero decir, sé que lo he visto antes, pero siempre se registró como un anuncio de banner, y no como parte de la página en sí, por lo que siempre lo ignoré.

3
MalignantMind

Veo algunas causas posibles para que algunos de los usuarios de su sitio web ignoren el banner de homebrew:

  1. La parte morada del banner está fuera del flujo de lectura del sitio web. En un diseño columnar, la segunda y la tercera columna se dejan naturalmente para ser leídas al final. La parte púrpura se siente como una segunda columna en el banner. La parte negra fluye muy bien al contenido del sitio. Se siente parte de la primera columna de texto, empujando al usuario al contenido. Cuando el usuario pasa de la parte inferior de una columna a la parte superior de la siguiente, se detiene en la regla horizontal. El diferencial de color de la pancarta y el texto de advertencia que cruza el espacio entre columnas también actúan reglas horizontales virtuales adicionales. En resumen, la parte oscura del banner conduce directamente al contenido y las reglas horizontales bloquean a los usuarios para que regresen al banner.

  2. El contraste llama la atención. El mayor contraste está a la izquierda del banner y lleva al usuario a iniciar el flujo de lectura colunar.

  3. Demasiado texto para obtener el significado. La gente tiene que leer la larga explicación en el banner para entender lo que quieres decir. Tal vez no necesite un banner, solo un texto de encabezado simple y más pequeño como "CONTENIDO NO OFICIAL: esta página fue creada por un usuario (...)". Las expresiones pequeñas, directas y claras en posiciones clave tienen más posibilidades de captar la atención del usuario.

  4. La advertencia en el banner contradice lo que significa "Homebrew". Esto ayuda a nuestro subconsciente a filtrarlo. Las bebidas caseras suelen ser un producto artesanal especial hecho por el dueño de la casa. El propietario es el webmaster. Por lo tanto, transmite la sensación de que es una sección de contenido especial del webmaster. Por lo tanto oficial. Exactamente lo contrario de lo que dice la advertencia.

  5. Como han dicho otros, parece un banner publicitario y el esquema de color no coincide con el sitio web.

0
Lucas

Algunas de las respuestas aquí son demasiado complejas (es el fenómeno "expertos que abordan cuestiones de expertos": donde un grupo de expertos "¡ni siquiera se molestan en señalar" los problemas obvios!)

Explicaré humildemente el

Dos problemas ridículamente obvios:

  1. Escribir en una imagen no se puede leer. Este es uno de los puntos más básicos del diseño gráfico. Tienes texto en una imagen, por lo que es totalmente ilegible.

  2. El tipo a la derecha tiene "borde" a su alrededor. Esto es totalmente ilegible. Nuevamente, este es un tema muy básico en el diseño gráfico.

Honestamente es así de simple.

0
Fattie

Las personas son excelentes para ignorar lo que no conduce a sus objetivos (en este caso, probablemente "querer leer sobre D&D").

¿Este banner/aviso/sugerencia parece que me llevará a las estadísticas de Snarky Silver Dragon? No → ignorar.

Esto sucede inconscientemente sin que las personas se den cuenta (tuvimos pruebas de seguimiento ocular que muestran que miraron sobre la cosa y las personas desconocen por completo el elemento cuando se le preguntó al respecto), por lo que si desea mejorar ligeramente (establezcamos un objetivo realista) porcentaje de personas que notan el mensaje, aquí hay algunas ideas:

  • ralentizar a las personas: puede haber una superposición con una alerta y un botón en el que deben hacer clic ("Sí, acepto que esta página no describe D&D Canon").
  • ralentícelos aún más (agregue una casilla de verificación "Acepto eso" que debe verificarse antes de que sea posible ocultar la superposición)
  • hágalo parte del contenido para que parezca algo que está buscando (quizás debajo del encabezado) y haga que se parezca más al contenido ("Descargo de responsabilidad: esta página es un Homebrew y no describe un Canon D&D . "): ¿quizás igual que el texto del párrafo, pero con algún borde y quizás un icono de signo de exclamación?
  • ponga la información de que este es un Homebrew en algún lugar donde ya están desacelerando y pensando: mi idea es hacer esto en los enlaces. Por ejemplo, los enlaces de Canon serían simples, pero todos los enlaces a páginas homebrew tendrían "(Homebrew)" y tal vez algún ícono agregado. ¿Y podrían tener un color diferente? Y un "?" información sobre herramientas que explicaría qué es homebrew en mouseover?
0
Tomáš Kafka

Otras personas han tocado esto, pero: el hecho mismo de que el banner sea estéticamente agradable sugiere que está ahí para ser estéticamente agradable. Un concepto básico de diseño es que si quieres tener claro que hay algo para hacer X, entonces debes hacerlo para que solo pueda hacer X. Si miro una pared y veo un parche rectangular que es un tono feo de verde, es probable que pregunte "¿Para qué es eso?", y me doy cuenta de que es una puerta. Si hay un parche rectangular que tiene una bonita imagen cósmica pintada, probablemente me llevará más tiempo registrar que es una puerta, y no solo una pintura. Si la gente ve algo sin un propósito aparente, entonces se preguntarán para qué sirve. Una vez que se puede asignar un propósito a algo, las personas tienden a no quedarse sentadas preguntándose si hay algún otro propósito que les falta.

La imagen dramática también desvía la atención del texto y hace que sea más difícil de leer si la gente lo nota. Sería más efectivo para toda la página tener un borde distintivo y/o una fuente diferente.

0
Acccumulation