Just a great collection of resources with useful demos and tutorials

For a mobile app:

We examine everything page by page and log all errors into a central database.
We then convert that content to Jira tickets, complete with descriptions, screenshots, and story points.
If we work with a third party, and one of its tools is not accessible, we work with them to make it accessible.

it looks similar to the service Sentry.

WebAIM says the most common types of WCAG 2 failures comprise 96.8% of all accessibility errors.

• Low contrast text
• Missing alternative text for images
• Empty links
• Missing form input labels
• Empty buttons
• Missing document language

The % of these errors is diminishing over time though

Despite the benefits discussed above, infinite scrolling does have several drawbacks, which can impair the user experience:

• Difficulty refinding content
• Illusion of completeness
• Inability to access the end of the page
• Accessibility problems
• Increased page load
• Poor SEO performance

One-stop resource for everything related to user experience

Best toggles:

1. Inactive button coincides with the background / Active button has a highlighting background. "we suggest you use a combination of saturated lively color (ideally corresponding with your CTA color scheme) and a light grayscale neutral color. "
2. Active button has a check sign
3. Active button has bold text (a bigger font size helps too)

About the 5-second and 20-second tests:

The results confirmed our expectations since the average error rate was lower in the 20-second tests and the Success-Confidence score was higher. However, these differences were not significant.

There is a difference of 0.5% in the error rate and 2.5% in the confidence score.

The ticks could be perceived as outdated (akin to a physical form more than a website). As for radio button icons, you might as well use a radio button instead.

In short, when designing a toggle button, for the sake of your users, it’s good to hold on to these basic principles:

• Use them only when they have an immediate effect
• Apply them when the setting has a default value.

→ part 2: https://shaarli.lyokolux.space/?iAYVOg

Research shows that the more different a new view is visually, the more likely it is to be perceived as a separate page by users. With it comes the expectation that the “Back” button will bring a user to the previous “page,” even though, technically, it might not really be a separate page.

That's why it's good to adjust the URL as much as possible :)
Moreover it allows to share this "state" of the page

TL;DR;
apply every hover effect on devices that can not support the hover effect (smartphones, ...).

Use the @media (hover: hover) media query to target devices that have the :hover effect available, or @media (hover: none).

1. Don’t Disable Copy-Paste For Passwords
2. Don’t Rely on Passwords Alone
3. Drop Strict Password Requirements
4. Social Sign-In Isn’t For Everyone
5. Replace Security Questions With 2FA
6. Users Need Options For Access Recovers

In a dedicated area on the page, additionally to the primary navigation on the top, users are presented with a drop-down. They can specify what exactly they’d like to do on the website, or what they are looking for. Once one option is selected, another drop-down appears, allowing them to specify their intent even further.

This experience mimics the drill-down navigation with multiple levels. Yet the difference is that users are making small decisions, one after another, without being confronted with the entire navigation at every step of the way.

The user fills itself the needs

In fact, nobody wakes up in the morning hoping to finally compare products by features in a comparison table matrix. As customers, we actually want to find out what a better option is, yet we need to do quite a bit of work to get there.

A-Z Index Pattern: by listing all keywords on a single page mostly because users can use in-browser search to look something up quickly without having to go and explore multiple pages.

Tap-Ahead autocomplete pattern:

Rather than focusing on a list of keywords, the autocomplete actually provides an overview of items that the users might be looking for.

Tap-ahead minimizes the amount of effort needed for typing, but also drives customers to relevant results and gives them the confidence that they are actually on the right track.

If you are designing an interface for expert users, perhaps slightly more advanced ways to use search might be reasonable. Stackoverflow allows its users to specify a filter right in the search box, without having to rely on filters, tags, or any other modes of navigation.

I have a bad experience with carousels as the user can not control it.

Instead:

• ResidentAdvisor avoid carousels altogether, highlight three last features, and invites users to explore more with a “View more features” button.
• Australia Post uses a dynamic layout to highlight all features together in the same area.
• 168plymouth uses mini-carousels for each feature that they want to highlight. There is no rotation, no auto-advancing, and you can move only in a single direction — moving backward might not be necessary with just 4 images that every panel contains.

Les attentes:

• éviter le changement d'environnement tous les ans ou deux ans...
• l'UI des logiciels proposées

Pour les élèves:

• tous sur la même plateforme
• éviter de se connecter
• responsive ! On est en 2022, les élèves utilisent ces outils sur ordiphones. (WTF ce n'est pas le cas ?!)
• que tous les documents / pdf etc utilisés lors d'un cours soient dispo depuis un seul lien de partage

Pour le Warrior du Dimanche

• tous les documents en un seul lien
• mise en ligne rapide et simple des documents [→ un lien déjà partageable avant que la ressource soit téléversé ?]
• que les données restent acccessible aux fils des années (WTF ce n'est pas le cas ?!)
• ....

Sa solution semble être un très bon départ
"Par contre, c'est moche" → je peux peut être aide ! :D

A nice introduction about copywriting

The work page has also nice effects that improve usability.

Immersive ! Wow

The two pillars that a good notification is built upon: Give your users a chance to understand what they gain from notifications and ask for permission in context, not on page load.

Follow the guide https://stephaniewalter.design/blog/the-ultimate-guide-to-not-fck-up-push-notifications.

It has many tips in the article, or at least resources to studies or guide.

Critics about the design of the Tesla :)
And how to improve it.

Display an item on scroll.