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.
This might be out of scope but: Cookie banners. Please just give me one single button to disagree to all unnecessary cookies like intended by law. And stop this “legitimate interest” bullshit where I have to disagree AGAIN but this time MANUALLY for each of your 873 “partners” to actually disagree?? If you give me an option to disagree to all but then there’s also 800+ secret checkboxes to REALLY disagree, that just feels like you’re making fun of me.
Like a lemonade stand that also offers urine and when you don’t want urine in your lemonade, they instead just directly piss in your mouth. Not a great user experience…
Hamburger menus with the button in the top left corner. Bro, my thumb is down here in the bottom right corner. I already try to buy smaller phones and it’s still almost impossible to use these menus. Would it be so hard to at least put them on the right side?
Any website that hijacks my scroll wheel or forces smooth scrolling. It makes me unreasonably mad
One terrible combo is infinite scroll plus links in the footer (Bing does this, if you needed another reason not to use that site). I think pagination is generally a better pattern, since you can link to a specific page.
Sometimes it becomes a race between me and the site implementing infinite scroll to see if I can reach the footer before the site can load more content; the only time I curse my internet connection for being good
Related, pagination can still get broken if you try hard enough. Some sites have pagination, but bump up the id of old posts every time there’s a new post, so it’s still useless because the links will change content
bump up the id of old posts every time there’s a new post
That’s probably the worst thing I’ve read today, it’s such a bad thing to do on so many levels wtf
Requiring a phone number before allowing a user to use app-based TOTP.
You don’t need to know my phone number to make the secret key on my app work.
Making the page have empty margins by squeezing all the content into the middle of the page. When I started learning how to make website back in the 90’s, this was considered a major no-no. It’s really only done these days, because they focus entirely on how it looks on a phone held vertically than on an actual computer. But there’s no reason to not have it use the space on devices that can see it.
Mobile-first is supposed to be a specific way of implementing responsive design, but I think a lot of people say “job done” after the first step and never get around to the whole responsive thing. I think it’s easier to use a mobile layout on desktop than it is to use a desktop layout on mobile, so in that way I think mobile-first is a good principle to follow. But I agree, making a desktop layout that looks good is ignored far too much these days.
I agree with this to some extent. For even wider lines of text occupying the entire desktop screen, it actually becomes hard for me to discern which line I am currently reading, causing me to start reading the entire line all over again.
Which is dumb because CSS allows you to change the design based off screen size, so it’s 100% developer laziness.
I personally find fading-in of web elements in scroll to be annoying. Cookies should also have an immediate one-click reject-all button directly visible without having to enter any menu.
Oh, also, any links that are inaccessible by Vimium are annoying.
Cookies should also have an immediate one-click reject-all button
I’m actually fairly certain that to be GDPR compliant they are supposed to have that. At the very least it isn’t supposed to default to “accept all” either.
Many do, but a fair number also tucks it into a separate menu; you have to click somewhere at least once or twice to uncover or show said reject-all button which you can then click.
I was intrigued by the existence of a Vim based application for browsing, but not surprised.
How would I come about ensuring compatibility for websites with multiple interactive elements for viewing in Vimium? Do I install and test the website on Vimium during development too?
Requiring my phone number for “safety”
- I don’t understand the logic of presenting just-arrived users with a popup to sign up for a newsletter or anything. I have just arrived and will need time to see the content before I can make that kind of decision.
- likewise, I do not understand moving a video to floating at the bottom corner of a page after I have scrolled past the original location of the video. If I wanted to watch the video, why would I have scrolled past it? Very often reading is superior so moving the video to the corner only adds distraction to my attempt to consume your content.
- Please do not overwrite established keyboard shortcuts for browser functions. Even if you have a desktop version of your web-app you should accept that your users are using a browser to access the web-app version of your product and retain all established browser keyboard shortcuts.
- Lazy loading of data is counter productive most times. When a set of data is presented by a web page, pagination is fine. This provides a clear indicator that the set of data on the current page is complete, and a CTRL-F can be performed. The process of lazy loading of additional data after scrolling to a certain point provides the end user not visual cue where the current set of results lives within the full set. In the best of cases this means having to continually scroll to the bottom of a page until nothing new loads before doing a search through the results. In the worst of cases lazy-loading will remove earlier entries and make it completely impossible to do a search through presented results.
- Is your site or product intended to be end-user data to sell to data brokers? If not, then you should not be engaging in any practices that will result in any data being sold to anyone. If you are selling a physical product or service that is unrelated to end-user data and you still find yourself tempted to sell end-user data, please consider increasing your product’s price instead. This practice makes it seem that your product or service is not of high enough quality for you to make the money you need from it, and instead have to rely on the questionable practice of selling user data to close that gap.
- Nagging customers to disable ad blockers is objectively pathetic. Unfortunately these are NECESSARY because the vast majority of sites pushing advertising are doing so through 3rd party services that are NOT moderating the content of the advertisements to remove malware or outright scams. Either accept that this is a security necessity, or insert your advertisements yourself. The vast majority of ad blocking software do so based off of the established codes used by 3rd party ad vendors and manually inserted advertisements will not suffer. Your ad network made this a requirement and you should be punishing them, not your users.
- if you have pagination on your site’s content, either allow to next set of results to actually load a new page, or ensure that clicking “Next” also includes moving to the top of the list when the next page is loaded. After clicking “Next” I shouldn’t have to manually scroll up to the top of the new results.
All of your points are valid, in fact I’ve personally had the same opinions for points 2, 3, 4 and 5 for a while. I wish I could upvote for each of your points
“Overly verbose text and introductions” - starting to suspect that a lot of these articles weren’t written by a human, which makes you wonder if any of the information is accurate.
omg point 2 makes me want to leave the site.
So many sites do this with “trending” or “new” content. Like youtube used to repeat your shorts every 3 or 4 rows of video to try and convince you to watch shorts. Drove me crazy at the time because I have no interest in them.
And just like that, all the vague annoyances I’ve had just became tangible. Thanks.
Giant tiles or moving pictures instead of small buttons to click to navigate.
I’m not saying I want every website to look like Wikipedia but if I had to choose between mostly text with obviously clickable links vs abstract art with bullshit hit boxes I’ll take the “boring” text every single time.
Too many UI devs forget that they need to make it functional and easy to navigate first and THEN you can add flair. Never add pizazz if it inhibits functionality or visibility.
Websites that deliberately disregard browser settings and find ways to forcibly autoplay videos.
That includes sites which use animated gifs in order to simulate playing a silent video, to trick you into clicking on it.
Just give me a damn still image if I don’t want video. I will only get angry if you shove video down my throat.
Apart from Youtube, I haven’t encountered any website force autoplaying videos. Maybe that’s because of the filter list set in my adblock.
That includes sites which use animated gifs in order to simulate playing a silent video, to trick you into clicking on it.
Now that’s just dirty play.
Fucking with scroll in any way. My browser and OS scroll in a familiar, reliable way and the chances of any change to that a website could possibly make improving my experience are infinitesimal. https://dontfuckwithscroll.com/
What would be your opinion on making a website that has no scroll because it’s just a single, small page, and the hijacking scroll to do some useless visual thing because scrolling wouldn’t do anything anyways?
I just noticed this on Newegg but when you load the page, it puts a search suggestion of something popular people are searching (today its MH Wilds) in the search bar. I guess the idea is that you can click on it to instantly search for that thing. The problem is, that it takes a beat to load in so by the time you click on the search bar to enter what you wanted, you’ve accidentally clicked the search suggestion and then are taken to those results, instead of being able to enter the thing you wanted to search for int he first place.
It takes over the right side of the search bar, but depending on the size of the browser window, that could end up taking the majority of the search bar’s free space to click on.
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!
When a page is so bloated with crap, certain elements load much after certain others, leading me to believe the page has loaded, and to click on something jus as somthing else loads and pushes it down/to the side.
The YouTube Android app does that, and it’s fucking annoying.
This. So many times this. It drives me bananas.
“Cumulative Layout Shift”
It’s so annoying.
And 100% of the time the thing you end up clicking is an ad. It’s definitely intentional.
“Intentional” is the perfect word