What are some aspects of UI/UX seen in modern websites that really grind your gears?
What are some aspects of UI/UX seen in modern websites that really grind your gears?
I wish to understand what elements or aspects of the design of modern websites the end users are annoyed from. Though you are free to express your personal opinions, it would be even more insightful if you could provide objective criticism and suggestions for alternative implementations so that I may incorporate the same in my current and future projects to make them as user friendly as possible.
Some criticisms I have encountered a while back include:
- Switches being basically checkboxes with more ambiguous active state
- Scrolling animations that prohibit user from linearly scrolling through the page
Make sure that the opinion is not
- Related to business/legal matters e.g. Cookie consent notices, ad banners etc.
- Too vague e.g. Poor website layout
- Highlighting objectively bad practices e.g. Lack of accessibility features
I recognise I could have followed a design system for this question, but I want to understand the situation from the perspective of the end users to see if they have a differing view on what a convenient user experience should be like.
You're viewing a single thread.
There's actually a proposal for various new HTML elements, including a switch:
https://open-ui.org/components/switch.explainer/
It's a little bit harder than you think, because people will definitely do things like this, and they have to account for that sort of behavior:
It is nice to see that they're working on it, where "they" means part of the W3C (so not just random nobodies):
The purpose of the Open UI, a W3C Community Group, is to allow web developers to style and extend built-in web UI components and controls, such as <select> dropdowns, checkboxes, radio buttons, and date/color pickers.
To do that, we’ll need to fully specify the component parts, states, and behaviors of the built-in controls, as well as necessary accessibility requirements, and provide test suites to ensure compatibility. We’ll also implement polyfills for our extensible web UI controls.
Today, component frameworks and design systems reinvent common web UI controls to give designers full control over their appearance and behavior. We hope to make it unnecessary to reinvent built-in UI controls, but for those who choose to do so, we expect that these design systems will benefit from Open UI’s specifications and test suites.
Long term, we hope that Open UI will establish a standard process for developing high-quality UI controls suitable for addition to the web platform.
Unfortunately I am unable to grasp what the attached image is trying to insinuate. Could you provide some context?
The linked site has a bit more about it, but usually you see toggle switches like that with relatively "balanced" options. "On" / "Off" are about the same width when rendered as text. It's easy then to just make the switch big enough for the bigger option and everything's good. What happens if you have "On" and "Some really long text option that should probably be shorter"? The image shows what it looks like toggled to "On", and then goes over two solutions, neither of which are great options:
- Use the smallest size and cut off the larger text. Not really a viable option
- Use the longest size, but when the shorter option is toggled to, you're left with a bunch of blank space
Now it makes sense. The transparent nature of the image obscured the outline of the switch in my screen from which I was initially unable to identify that it represented the different cases of viewport width of the switch.
Thanks for the clarification!