Hot answers tagged

571

This phenomenon is called banner blindness. Your labeling looks like a banner advertisement and is therefore subconsciously skipped. Users have been conditioned to ignore complete sections of content if their previous experience taught them that it always contains irrelevant stuff. The more attention the banner tries to pull, the more it's ignored. If you ...


259

The banner is beautiful but the style does not match the rest of the page. You know what is everywhere on the Internet with unmatching graphic styles? Ads. As others have said, the problem is that users are not considering it as part of the content. It appears to be an ad, so they skip it. I think the crucial action to be taken is to integrate it deeply ...


116

It's the design. Visually it's not part of the site or page. It's a square of content that doesn't belong to the site visually which indicates it's an advertisement to users. Design the banner to be part of the site visually. The most simple way is to design it out of its surrounding design. This makes it part of the site visually. Below is an example. ...


57

As previously said, the banner is inducing banner blindness not despite but because it is so enormous, prominent, clear and contrasting purple. Also, its placement just above the content makes it easy to ignore. The reader starts reading at the headline. Anything above it is easily ignored. Possible solutions: Put all the "Homebrew" content into an own ...


29

If you look at a Wikipedia article with a banner that's functionally not unlike yours (this article needs improving), you'll see there are a number of design differences. Namely: The banner is part of the article, placed directly under the article's title The banner is not as wide as the article, it's centered but slightly smaller than the article text. ...


23

Icons alone can save space in case of long(er) labels, but the tradeoff is a memory tax on the user. Icons can give visual order and harmony to layout, especially in sidenavs. However, in a complex, multi-node nav, we are asking our users to memorize a lot of icons. See the firebase console as an example: In the expanded view, I get clear labels. Words ...


15

Can I suggest trying the Github ribbons. This is remarkably noticable and doesn't take away from the rest of the content. Have a ribbon for 'official' and 'homebrew' with differing colours.


8

You say you have different colors, fonts etcetera, but overall the pages look very similar. A large page has so much visual noise that simply changing thw font won't be enough if it's still a similar layout (sidebar, 3 columns, same main logo). The only thing somewhat noticeable at a glance is the background and beige/white both fit in closely with the other ...


6

Official pages and homebrew pages have different colour schemes, different fonts, different text sizes, different table layouts, different title schemes, and, notably, a different banner declaring it 'official content' that is noticeably different at the shortest glance. ... How do we make people actually notice our banner? Or is ...


6

I would say that the problem is twofold. I believe, first and foremost, the problem is that the website is labeled as a Wiki and is miscommunicating its intentions to visitors. Because of this, people are more likely to assume that any information on this site is going to be references of existing information found in Wizards of the Coast D&D material. A ...


6

You should force the user to check each question. The time-consuming nature of the form is a feature rather than bulk, because it is important the user answers each individual question accurately. A button idea is less intuitive than it looks like. When your form is read sequentially, the user is implicitly asked to remember all of his answer in order to ...


5

Since giving system feedback to the user that shows something is happening is essential, otherwise they will think something is broken, I don’t immediately see a reason for this. Here is a depiction if the user experience during loading: There might be a dev reason or simply a call made by some manager or developer, but we will never know.


4

The coupon or promo websites serve the user a coupon code for a specific site or category/page/item on the site. While revealing the code, they open the merchant's website in a new tab with their affiliate code (or pixel) tagged in the url of the site. This is how the merchant's website knows that a customer arrived from a particular coupon site and pay an ...


4

You can simply add the label of the input for context, for example "Clear First name". This is particularly useful if this type of button exists on multiple fields on the page, otherwise it could be unclear what field this button is clearing, especially if users navigate by button or show a list of form items. Just two unrelated notes on the markup you are ...


4

The UX answer would be to provide the best experience for your customers. If full-width is your solution then you will need to create and implement designs for multiple break points. To answer your question directly. No. 980px is useful as approximation for a desktop users. It works on designs for 1024 and above. Example: a design with side margins.


4

Your concerns are valid, I'll highly recommend including the month. Some reasons: Users need just a brief moment of distraction to forget what they are thinking and as a industry rule it's better to avoid making them think and recheck unnecessarily. There's not an easy way to deduce in what month we are based just on a day or its number. To avoid the ...


3

I believe people stopped scanning Banner a while ago. They are either cosmetic or they are for ads. You would have better chance by having a little warning icon and the message at the beginning of the section, or something in a similar fashion. This way the user will start reading the content and notice icon + text. TL;DR : People subsconsciously bypass ...


3

I'll be honest, I've looked at the D&DWiki homebrew pages countless times in the past, and this is the first time I've actually noticed that banner. I mean, I know I've seen it before, but it always registered as a banner ad, and not as part of the page itself, so I always ignored it.


3

The primary driver is cost - web & mobile applications often have a global userbase, but no/limited budget for proper localization. In addition, many developers, designers, and even project administrators, apply their own cognitive bias, and fail to realize that iconography is highly culture/experience-specific. So they opt for "universal" icons instead ...


3

This is commonly called "alphabetical section index". In terms of affordances, the concept is akin to the cardboard tabbed index dividers featured on paper indexes and directories. This usability component has also been discussed in this community under the description "small alphabetical index" here. A quick search results in several implementations: 1, ...


3

Website References: https://www.choicehotels.com/ https://www.dunkindonuts.com https://www.saudia.com/ I think this is part of WCAG 2.0 requirement to provide minimum contrast ratio guidelines. Success criterion 1.4.3 and 1.4.6 mentions providing a style switcher to high contrast for the users with visual impairments. More info can be found here: https://...


2

Speaking as a periodic screenreader user, I have no issue with how that's been written. It's a little condescending to people who know what they're doing, but it's not something anyone would take offence to. If it's the support text around a form, it makes total sense. The issue will be if the form's not semantically marked up. If it uses an a rather ...


2

As Stacy H and Garik have already mentioned, reproducing a toggle-ish button is what you can do in this sense, in case you need visualization this is how it potentially could look like with the different states


2

You can make it more obvious that more than one selection is allowed by changing "Book" to "Select" and then putting the selected tiles in a "selected" state -- maybe the black button becomes a vivid color, the tile has a halo, and a checkmark appears next to the word "Select". You can then add a "Check out" or "Book Services" button in a prominent place ...


2

We work with similar questions on .GOV and my feeling is to test each scenario: A set of 8 checkboxes. IF 8 checked then goto X ELSE goto Y. A set of 8 statements with a pre condition saying "do all of these apply?" My feelings is the second option will increase cognitive load and lead to some things not being read while the first option would allow you ...


2

You should try to avoid these discussions, they will not result in anything valuable. Instead, either make it a user choice by providing a switch, or test it with real users. As with most such discussions in UX, context is utterly important, and the best course of action is a test: Give realistic tasks to target users, who will need to use your design to ...


2

I really recommend reading this article from Uxplanet: Rounded or Sharp-Corner Buttons? You can take these points home: -Squared Sharp designs are usually viewed as firm/serious/uniformed -Rounded designs are viewed as friendly and harmless. You cannot really identify a pattern from the examples you provided above. Facebook uses sharp corners for Login, ...


2

It sounds like each row holds "a few buttons" and you're going to need the right amount of space to make sure that the user doesn't accidentally click the wrong button by mistake, especially if they'll be tapping a touch screen. White space is good for preventing cognitive overload, but sometimes data density is the greater UX need. The important part is ...


2

try; "character cartoon illustrations", "cartoon illustrations", "simple cartoon illustrations" and similiar ack.imgur.com/PZgeM.png


2

IMHO, I don't think 980 is a good rule of thumb for anything fullwidth on desktop or tablet anymore, especially because of "retina" displays. If I had to choose one resolution to rule them all, I'd probably go 1440 or 1920, but you're still going to be shooting in the dark there and adversely affecting users with poor connections. Some of this depends on ...


Only top voted, non community-wiki answers of a minimum length are eligible