25 ms·

The negative impact of mobile-first web design on desktop

770 points by skadamat 3y ago

fomine3 3y ago
For websites, theoretically it can be tweaked by custom CSS or something, or hopefully author adjust CSS for desktop. What I now hate is portrait videos. It's nonsense except on a portrait phone.
brailsafe 3y ago
My favourite dead-end task is when I'm working on some established non-mobile first UI that has often been haphazardly put together with only 13" laptops in mind, and asked to essentially "make it responsive". It's a tiresome conversation to have when the task bleeds into another sprint, usually with a surprised manager who I'm sure could have finished in 1 hour between meetings. Don't forget the tests, QA, managing other PR reviews, participating in pointless meetings, and inane last-minute requirements changes
gsuuon 3y ago
Pages aren't optimized for conveying information, they're optimized for CTA interaction rates. I don't think a business fundamentally cares about how well a customer understands the product as long as they buy it.
walteweiss 3y ago
Sorry everyone, but I think if Apple do what they here say ‘bad’, I’d rather believe Apple. Their sales prove their design decisions, with very low content density.
spurgu 3y ago
One mobile-first cancer that's becoming increasingly annoying is sites highjacking Ctrl/Shift/Cmd+clicking (used to open links in new tabs). I paused writing this comment/rant to do a quick search about it and found that someone had already done what I intended to do - write an extension/addon to deal with it: https://github.com/danielnixon/link-fixer https://github.com/danielnixon/link-fixer Thank you Daniel Nixon!
cyberax 3y ago
Yes! I hate websites that put useful content in a thin column in the center. What's worse, formerly normal websites start degrading. Typically, when a new manager is hired and decides to "reimagine" the product with the "mobile-first" vision. The recent Patreon is a good example. And of course, in some cases normal websites go away entirely, and are replaced with crapps: Venmo, Amazon Alexa, Chamberlain, etc.
kodisha 3y ago
Omg yes! It has finally been told! I was crying and talking about making the return of information rich websites, but people were just following trends blindly :(
- strobe 3y ago
  view point in article mostly from an user perspective, but if same stuff would be reviewed from companies perspectives most of that negatives has positive effects for marketing/sales needs which probably a reason why is so widespread. It's like: our visitor can't just see our half page table with tech spec to know everything, he should go trough 20 images on 2 long pages and during that we will show him all our 'important' messages that he won't be interested otherwise.
awinter-py 3y ago
PREACH opposite way in: 2013 article about high density on the japanese web being (in part) a legacy of their pre smartphone era
- hunter2_ 3y ago
  Someone told me that Japanese websites tend to look outdated because all of the tooling and code is itself in Japanese, and since that stuff hasn't been updated in a while, the final products are a bit stuck.
kunwon1 3y ago
Many websites will completely alter their UI based on resizing your window. Sometimes I want to set a browser to take up half of a monitor so that I can put something else next to it. This often fails on modern websites because the UI becomes unusable after the window is resized
- tiltowait 3y ago
  This is the "responsive" part of "responsive design". When done well, it's great, but you're right that many websites are way too aggressive about it, as if they only really tested two size classes.
  - ReactiveJelly 3y ago
    I'm mostly appalled at how many desktop users just maximize everything. I even had juniors maximizing terminals.
    - qingcharles 3y ago
      I've never used a window that wasn't maximized. I have focus issues. If there are two windows on the screen it becomes hard for me to concentrate. I have two monitors if I really need two windows (e.g. debugger on one screen). Otherwise it's maximized all day.
    - ryandrake 3y ago
      Why is this appalling?
      - ReactiveJelly 3y ago
        It makes every window interaction slower when I'm helping them and, I assume, when they're alone. I usually have two panes of code and one or terminals on the side so I don't spend time hunting for windows
      - FractalHQ 3y ago
        I think it’s fine until someone sends me a screenshot of my website in fullscreen on a giant 4K monitor.
Cthulhu_ 3y ago
I'm gonna complain about HN though; while it may not have been intended to be mobile first, it kinda is, leading to overly wide text in comments if using a full screen browser. This is the same issue that the previous iteration of Wikipedia's design had.
- ryandrake 3y ago
  As a user, when I set my browser to be full screen, I expect the content to take up the full screen. I bought a nice big 27" monitor, and I want to use it. How dare some UX designer 2,000 miles away from me simply decide that I should only be able to see content on a 5" wide strip down the middle! The browser should be the User's Agent, not the Web Developer's Agent. If I want to do something with my browser layout that a designer finds appalling, that should not be his concern. If the web developer and designer really think that text should appear in tiny 5" columns no matter how wide my browser is, fine, then flow your design to display multiple side-by-side columns like a newspaper. Don't just fill my screen with whitespace.
  - bee_rider 3y ago
    I think multiple side-by-side columns would be great. Actually, do you know of any sites that actually re-flow text like that? It’d love to see it. I don’t really want text to reflow to be, like 23, inches wide or whatever. Books with 23 inch wide pages are quite rare, because, I think, that is too much horizontal space, scanning that far with you eyes can become a drag. Of course, if a page just uses the whole width uninterrupted for text I can just give it half the screen, so that is fine. But I’m curious, do you actually like the look of a page like that? Or is this just on principle—respect user choice and all that (if so, good principle!) In general web devs seem to think way too much about the layout of pages, if they would just do the simple thing users could resize the window to their liking.
    - ryandrake 3y ago
      I think I might have seen the "column-ization" method once and was impressed by it. HN's handling of different browser widths is... pretty weird, at least on my Desktop Safari browser. Looks like from browser widths of 1920px and greater, HN maintains fixed size whitespace borders and scales the content width. Nice. When you shrink the window past 1600px, it holds the content size fixed and shrinks the borders. I guess the intent is to smoothly transition into a mobile design without the borders. Past 1516px, it removes the borders altogether, and seems to transition into this "mobile" design. Between there and around 610px, it seems to shrink the content width by discrete fixed amounts every 200px or so, to "keep up" with the browser width. Finally, below 610px or so, the site goes back to the non-mobile design, laying out as if the browser was 1600px wide (and actually truncating the right hand side of the text)--totally broken. All that complexity--for a text only site! When they could just make the text 100% of the browser width and let me as the user decide what is comfortable to view. It's still much, much better than sites that just limit the content width to 600 pixels and fill everything else with whitespace!
usrbinbash 3y ago
The problem isn't "mobile first" design. The problem is "mobile only" design. PCs and Laptops exist. They have wide, high resolution screens and precision pointing devices. All relevant technologies support changing the rendering based on the display available to the browser. It's not that hard. The problem starts when designers ignore these facts, and instead pop giant buttons, zero navbars, hamburger menus, and thin columns with low information density into the Webbrowser running on my PC with a 4k screen and a 120$ laser mouse. https://idlewords.com/talks/website_obesity.htm#sprawl https://idlewords.com/talks/website_obesity.htm#sprawl
- ryandrake 3y ago
  Our UX's are turning into the Hospital Computer scene from Idiocracy[1]. 1: https://www.youtube.com/watch?v=LXzJR7K0wK0 https://www.youtube.com/watch?v=LXzJR7K0wK0
  - _chu1 3y ago
    As time goes on that movie becomes more and more of a documentary.
- hombre_fatal 3y ago
  > It's not that hard. It actually is very hard to design a responsive UX that can handle anything from the smallest smartphone up to ultrawide monitors.
  - stronglikedan 3y ago
    > It actually is very hard Only when folks try to get fancy. K.I.S.S(illy).
    - postalrat 3y ago
      Name a few example sites that kept it simple
jjoonathan 3y ago
Hamburgers and Hieroglyphs! Ahhhhhhhhhhh! I get why they are used on mobile. If you only have room for content, it makes sense to tuck actions away into a hamburger menu except for a small number that you assign to tiny little hieroglyphs. Fine. However, if you have space, this is a terrible way to use it. At best it adds steps, at worst it invites experimentation and disaster to figure out what the heiroglyphs do (which wouldn't be so bad if undo worked but we've apparently decided undo is fine to break too). Like the Apple HIGs used to say, on Desktop you should want to get the most common actions out of menus and onto labeled buttons so that users can answer "what can I do?" without playing hide and seek. Undo should be baked in from the very start (it's hard to retrofit) to reduce the consequences of experimentation. Unfortunately mobile design has taken over so completely that even on apps which will be used almost entirely on desktop, even on apps with an internal advocate for Desktop design, UI designers go for the hamburgers and heiroglyphs and broken undo because it's standard these days. Sigh. Oh, and modals are back with a vengeance, but I need to stop here or my blood pressure is going to get unhealthy.
- ndriscoll 3y ago
  I don't think there's any excuse for hieroglyphs. Even a low-end 5 year old phone like the moto e4 has a 1280x720 display; there's plenty of pixels available to label the icons. Hieroglyphs are a "we hate our users and want them to know it" first design. Hamburger menus could also frequently be done away with when you look at how many options they have. Like Gmail's app has them when it could fit the icons across the screen as a bar. And it's hard to argue that real estate was important since they put in a bottom bar for chat, video, and spaces whatever that is.
  - deleted 3y ago
    [deleted]
  - wil421 3y ago
    I deal with some legacy web apps and ticketing system at work. They could use a hamburger menu or two. 10 buttons, 15 tabs, and a million inputs most people don’t use.
  - 3y ago
OrvalWintermute 3y ago
I've been seeing this more in content, and also apps that are "browsers" really - some view control that have a mobile & PC/MacOS equivalent - like they are intentionally formatting everything for portrait type display on mobile My devices are a literal ton of iOS ones, and then 4k and a 2560 × 1440 display which I use most frequently lately. Tons of whitespace, oversized text everywhere and incorrect use of Z-index are some of the hallmarks of this mobile-first design.
hans_castorp 3y ago
Not directly related (or is it?): I just hate sites where all I see is some fancy wallpaper image and a slogan (if at all). Then I have to scroll down on my 27" monitor to be able to actually read anything on that site. That is stupid - at least in my opinion.
- atq2119 3y ago
  Proposal to introduce the term "villain image" for this sort of thing.
strangescript 3y ago
What you really want is two apps, completely different UX's and its not worth the effort more times than not. No one is going to Herman Miller's website for example and not buying a chair because they don't like the desktop web app experience. They might pass though if they can't get the site to work well on their phone.
- marginalia_nu 3y ago
  Huh? I've definitely bounced off shops because their web app experience sucked.
  - pavel_lishin 3y ago
    Same for restaurants who over-design their website and make it difficult to find the only three things I care about: location, hours, menu.
    - Isthatablackgsd 3y ago
      Don't forget contact too. It was difficult to find contact information on some sites. I remember 10 years ago contact information are usually at the bottom of the main page or in the nav menu. Now, it took some soul searching to find it where they buried it in the submenu. Sometime I usually use Google Maps to get the address or phone number since some site don't make it easier to find it
    - Sohcahtoa82 3y ago
      The trend that I have found to be truly aggravating is restaurants recognizing that sometimes I just want to look at the menu. I don't want to place an order. Don't make me tell you when I want to pick up my order or where I want it delivered. I just want to browse and make a decision later.
- deleted 3y ago
  [deleted]
- cyberax 3y ago
kimi 3y ago
I can only think "first world problems".
- lsmeducation 3y ago
  I like my first worldism. Nothing satisfies me more than a nice coffee and a smug "I cant stand Jira" in the morning. My life is hard.
- Ensorceled 3y ago
  Ummm yes? The overwhelming majority of articles on this site are addressing 1st world problems. Are you posting this from your MSF rotation in Gaza?
meiraleal 3y ago
The Negative Impact of not being mobile first: it took me 5 attempts to dismiss the annoying cookies popup.
marginalia_nu 3y ago
Yeah, as someone who can't use touch screens, this is a serious pain point in a lot of my web browsing. Mobile first design is an accessibility problem.
caseyf 3y ago
i wish that "Compact" and "Comfortable" options for spacing were as common as dark/light mode
- adrr 3y ago
  Dark mode requires visual content rich sites to have two sets of assets. Example would be a marketing chart with a white background needs to have a corresponding asset with a black background with different color text and bars.
  - omarfarooq 3y ago
    That can be solved with transparent background images, and brand color palettes that balance contrast in the two modes.
_greim_ 3y ago
The visual design problem mirrors a problem with the organization producing the website. Before mobile, a website was the entire online presence of a company; every subdivision within the company had a presence above the fold. The culture and conceptual structure of web development developed around this concept. As mobile mandates pushed things below the fold or off the site entirely, web teams found themselves unprepared and have adapted awkwardly, as this article shows. Mobile app teams never had this cultural baggage, which is one of the many reasons native apps are perceived as superior.
gherkinnn 3y ago
The irritating thing is that it is neither mobile first nor desktop first. Most websites I come across are designed and built for desktop but using a mobile aesthetic.
runjake 3y ago
The apps go where the money is, most normal people are mobile-first or mobile-only.
- adrr 3y ago
  90% on e-commerce sites.
  - runjake 3y ago
    90% mobile? If so, wow!
deleted 3y ago
[deleted]
blooalien 3y ago
The problem sadly isn't even mobile-first vs. desktop, but rather designers who still haven't figured out that the web is dynamic content that should be allowed to flow according to the user's display device size and shape. It's not and never has been a static medium like paper. It's not limited to a specific size and shape like paper, and should not be treated as if it were. Web "designers" should not be trying to force the content into any specific size or pixel resolution, as there's just too many different resolutions of screens and width vs. height layouts of those screens to ever be able to cover them all appropriately without adapting to the idea that the content must be able to flow accordingly. It also severely harms accessibility for folks with vision issues who might scale up their fonts to compensate if doing so causes the content to break in horrible ways that make it unreadable.
- ReactiveJelly 3y ago
  The designers probably know that, but it costs money to design for 2 platforms. So they pick the 2 biggest platforms for non-hackers... Android and iOS...
  - blooalien 3y ago
    You're not designing for two (or more) platforms at all. You're designing for one platform. The Web. It's built on some pretty well defined standards that a ton of folks seem hellbent on breaking to force the web into a shape that it simply isn't.
    - BlueTemplar 3y ago
      They didn't mean platform in this way. But in the sense that small touchscreens are fundamentally different than big monitors + mouse & keyboard. That's why anything that is not the simplest website should use two different interfaces. (Also, apps don't belong in browsers.)
  - albedoa 3y ago
    > So they pick the 2 biggest platforms for non-hackers... Android and iOS... I can't imagine you are talking about the same thing here. (Or if you are, then you are making OP's point.)
programmertote 3y ago
Vanguard has been guilty of this as well. Its recent site redesign has been all over the place, and sometimes leaning heavily toward folks using its phone app (not that its phone app is very user friendly either; for example, checking what orders one has placed by account is impossible). It used to be that the website has a table view that shows almost everything I need to know about my holdings. Now, it takes a few clicks to find that info and even then, the layout is so sparse (mobile optimized) and hard to read. Maybe I'm getting really old and just like to complain about this because I'm not very much used to this phone-oriented UIs.
- ReactiveJelly 3y ago
  I think they also eliminated some of the color hierarchy in favor of just making everything big black text swimming in a sea of white. So it's a little harder to see which pieces of text belong together. I hate it lol
- spookthesunset 3y ago
  Vanguard's website has always been a mess, to be honest. It's really hard to figure out how to do some basic stuff like transfer money. I figure their website is so bare bones because it reflects their low cost ETFs. They'd rather have a crappy website and cheap ETF's than a fancy website with slightly higher cost ETFs.
Ensorceled 3y ago
I’m less concerned with brochure and ecommerce sites. But mobile first design for productivity sites and tool interfaces drive me crazy. Who normally accesses these tools from their phones?
- joelanman 3y ago
  People who need to zoom in a lot in order to use it. In practice this gives you a small screen view. It's a WCAG requirement
- dpifke 3y ago
  I recently had the misfortune of having to use a background check app that was mobile only! It was a real pain to enter past employer and residence names and addresses on a mobile keyboard, but even worse when it came to dates, because the date picker would only scroll a month at a time, starting from the current month and year. To enter my birthdate, I had to tap ~550 times. (I was kinda tempted to file an EEOC claim, since the broken date entry has a disproportionate impact on older workers, a protected class. But that's not a great way to introduce yourself to a new employer's HR department.)
pipeline_peak 3y ago
Rightfully so, what’s in it for them to spend more resources on such a niche group? Desktops/Laptops are for gamers, workers, and programmers. This isn't 2006, people don't read articles on their desktops in leisure. If they are it's because they were also doing one of the three use cases I mentioned.
- denton-scratch 3y ago
  > Desktops/Laptops are for gamers, workers, and programmers Nah. Like, I'm all of those; but I very rarely play games these days, and I've retired from programming. But I strongly prefer to use a laptop to browse; I never use a mobile browser. My eyesight is too poor, and my fingers are too fat.
  - pipeline_peak 3y ago
    >My eyesight is too poor, and my fingers are too fat. What about tablets?
JansjoFromIkea 3y ago
Think a lot of the issue is the difficulty grasping what size the actual screen is. I get webpages on my 1080p monitor where everything is just far too big but I guess as far as the code is concerned it has limited knowledge of whether the physical size of the screen is 24" or 5"
- skydhash 3y ago
  I think mobile devices use scaling. The number of pixels reported are are not the screen’s resolution.
collaborative 3y ago
Display: inline-block is the answer :p
WesolyKubeczek 3y ago
Shit like this makes me want to learn more about using accessibility features of my browsers. I'm far from going blind, but I don't want to scroll through the angry fruit salad of alegria art, huge stock images that take a huge amount of screen real estate and the important bits being tucked away probably somewhere in the bottom. "Minimalist design" and it still takes multiple megabytes of bandwidth to show a pretty nothing. I'm using Reader Mode or an equivalent whenever I can. If a site cannot be dealt with using RM, I mostly go elsewhere. Now get off my lawn, kids.
zubairq 3y ago
I think that many user interfaces only make sense on desktop, like development IDEs for example
novok 3y ago
It’s an indicator that most of their userbase is mobile. Look at B2B SaaS apps and they tend to have the opposite problem
r113500 3y ago
Danny o'brien, he runs one of the oldest surviving blogs, oblomovka, coined a term "hinternet" sometime in 2007, that was when the internet was still being run by the technological elite, for themselves, but normal people have also joined. The idea of hinternet was that there was essentially two internets. One is the sophisticated technology and a value add, and the other one is the internet of the viagra pills and popup banners. We, the technology elite, would rarely venture into the hinternet, like going into a bad neighborhood, where's normal people had no such mechanism for discernment, so their experience of the internet was distinctly different and inferior. Now most of the internet is hinternet, and we're all forced more and more to rely on it. Banking systems, mortgage platforms, car payments, utilities payments are generally designed mobile first, desktop later, they employ various dark techniques for "verifying real user", which break on open platforms, forcing you to access them from iPads and other such locked down devices, or not at all. If hinternet used to be the dark shady streets where hucksters were peddling you knockoff watches, then now hinternet is the dystopian landscape of vertical information integration, ran, behind the scenes, by para-governmental institutions. You can't log in into irs without using id.me, a digital wallet and identity management platform, that sells you things. There are attempts to cultivate little gardens of sophistication, but they are of mixed success. On a personal level there's a strong disincentive to participate in the hinternet beyond the mandatory, carefully navigating poorly designed and conceived systems just long enough to achieve an objective. One has to login into irs, but one doesn't really need to read that popup and upsell blocked, mobile centric news article. From this perspective "mobile-first web design" is a symptom removed from its greater context.
- dannyobrien 3y ago
  Link to the piece if anyone finds this in the future: https://www.oblomovka.com/wp/2003/04/15/the-hinternet/ https://www.oblomovka.com/wp/2003/04/15/the-hinternet/ (It was both strangely broken in my WP database, and also I think my website was down when OP write this. Sorry!)
- Obscurity4340 3y ago
  This is an interesting thing. Honestly can't remember the last time I saw an ad or easy phishing thing. Like obv in your junk mail but thats literally the extent of my exposure to it, everything else is curated and "good" or probably aligns with your concept of the priveleged netizens/areas even though Im poor as hell. Knowledge wise I suppose I rich so there's that but there's also seems like a tradgedy of the commons type situation that depends on all the tech-illiterates to be the meat shields for advertising and paying for things like YouTube
torartc 3y ago
Skill issue.
tempodox 3y ago
It's not just web design. Desktop software is being ruined by mobile-only app design.
- josefresco 3y ago
  Desktop software has been ruined by touch UI. Big buttons made for fat fingers means we get "Fisher Price" UIs. Not a bad thing for the casual user, but for power users it feels like we're moving backwards.
notjustanymike 3y ago
This is a really long article to say "Content dispersion is bad". Yeah, obviously. More so if you use a generic image like Waze. It's not a usability problem, it's a quality problem. Apple does just fine with full width desktop heroes because they include relevant images.
zeroCalories 3y ago
Over the years it's become clear to me that frontend is probably the hardest part of the stack. People think they can just shit out some bootstrap react app and it's perfect, but being able to write complex UIs that can work on any browser, any device, with all assistive technologies, and all languages, is extremely hard. You need someone with a deep knowledge of html, css, and the supportive web apis. A good frontend engineer is incredibly rare, even at big tech. What's even more rare is a UX designer that also thinks about these things, who are worth a million bucks.
- smokel 3y ago
  The irony is that we are now all very enthusiastic about a text based user interface.
- martin_drapeau 3y ago
  UI, in my mind, has always been the hardest part of the stack. It is even more true today. A front-end dev must: - Deal with a subjective human (not an objective machine) - Deal with designers and product managers - Be constrained by the back-end engineer and infrastructure - Make it work on multiple devices and browsers - Use the framework someone else chose - Not break anything Kudos to all front-end devs out there!
  - dasil003 3y ago
    I don't mean to minimize the effort of FE as I agree it is under-appreciated. But if the BE folks don't work closely with PMs and designers then you're already fucked and no amount of FE lipstick will make up for it.
    - ack_inc 3y ago
      Your comment made me curious: what kinds of insights have you seen BE folks miss due to not working closely with PMs and designers?
      - dasil003 3y ago
peebeebee 3y ago
As a webdesigner myself I kind of disagree. Simple content per screen just works better for the example they gave. It’s easier to visually parse. Their condensed version has a lot of multi column layouts which I really dislike. High content density works for desktop applications, but not for what’s basically a brochure website.
- mumblemumble 3y ago
  What's cool about the article's take, though, is that it's based on an actual usability study and not just something someone said.
  - lagt_t 3y ago
    Where's the peer review?
    - mumblemumble 3y ago
      Let's not set up a double standard here. It's not like non-evidence-based opinions are subject to peer review.
      - lagt_t 3y ago
        I'm just applying the same standard here, a non peer reviewed study has the same value as the opinion of a web designer.
    - _Algernon_ 3y ago
      A study needs peer review, but some web designer's opinion is just to be accepted as gospel?
      - lagt_t 3y ago
        Nope, both are to be taken with a grain of salt.
      - 3y ago
jddj 3y ago
The thing that I truly find awkward is no nice touch equivalent to hover. It's such a useful piece of the UX to have thrown away in the move to mobile first. Other than that I probably fall in the "it's not that hard" camp. Of all the problems you have to solve, getting it to look reasonable on a few different screen sizes is pretty far down the list in terms of time and complexity.
- extraduder_ire 3y ago
  I think long press handles both that and right-click on touchscreens. Or at least that's what I use to get at image alt text on mobile firefox. Actual hover detection would be possible, but I imagine that UX would suck unless you were using a stylus.
  - wildrhythms 3y ago
    Long press is already an engrained mobile OS behavior (begin text selection). And it doesn't solve the problem because the hover state is largely non-visible beneath the user's finger.
- Sanju_2306 3y ago
  hover like effect with touchscreen was possible in Xperia Sola.
neilv 3y ago
> to consume all content. I've decided, whenever anyone weighs in on information/interaction design, and says "consume...content", what they are saying is, "Hey, we've been stabbing everyone in the face all wrong, here's a better way to stab everyone in the face."
- yetanotherloss 3y ago
  Our AB testing indicates 12% higher laceration engagement is possible with additional modal enstabbators.
aa_is_op 3y ago
Add Substack to the list of brain-dead companies that use a mobile-first UI for an app that's primarly used on the desktop. Cause nobody types 3,000-word newsletters on their mobile, that's for damn sure!
melenaos 3y ago
Mobile-first is not mobile only design! This article has completely misunderstand the term, mobile first it's the technical way of organizing the CSS to render the mobile viewport first and then the rest of the 'breakpoints'. Mobile-first design has the advantage, over the desktop-first design, that it directly render first the mobile design and the cellphone experience is much faster and with less rearragning flickering. Mobile-first doesn't have the corresponding disadvantages at the desktop browser since they tend to have a land line internet and much faster cpu and memory.
- omarfarooq 3y ago
  I think they're assuming or taking the case of mobile first design with desktop as an afterthought.
lofaszvanitt 3y ago
World Leaders in Research (!)-Based User Experience --- And they checked a Herman Miller site. How often do you go to HM? When you want to buy a 6000 dollar chair. That's maybe once in a lifetime. On desktop, nobody cares about mobile first trendy large image sites, because you can scroll, you have a mouse, you have a full keyboard. You can use CTRL-F. You can navigate away from the bullshit, QUICK. Your handicap is ZERO. The real problem is really about mobile sites viewed on mobile. You search for something and arrive butt naked on sites. What you get? Full screen cookie consent pages. Then a subscribe to the newsletter full screen modal. Okay, now you get the content, but not really, because half size ads, ads on top, ads on bottom kill your eery-xperience. The experience is crazy because you have a restricted way to interact with the site. A shitty onscreen keyboard, you have to scroll a lot with your fingers. Save the mobile experience first. On desktop the problem is with large sites, with lots of traffic, with lots of users. "Finely" tuned by the sancrosanct A/B tests. Facebook/Instagram desktop experience is borderline crazy. Facebook's comment experience is just plain shit. Koko the tacticle sign-speaking gorilla would've made a better job on that. On Instagram, if you view it from desktop, then you are viewed as a peasant. How dare you to visit the site from the desktop? Are you retarded? Clicking on a post? Go register now, peasant! Wait a sec, you tried to register through desktop? Now go hang yourself, rural monkey! No, you can't set yourself to be 18+ to view the boobs, you need a mobile for that. Told ya, go hang yourself desktop peasant. Oh, the creators of React, the bloated bullshit frontend experience framework created by colour haired individuals that every brainwashed idiot loves like a plush polar bear. Time to push back and send the naive + trendy developers to the soon to be established Mars base.
- motoxpro 3y ago
  Not sure if I understand you correctly, but the article talked about the friction created by scrolling and "Ctrl+F"ing. Cookie consent, 18+ (I assume you're talking about Reddit), etc are all laws, which I think you would have more luck contacting government officials than a front end dev. The best part of programming is no one knows, or cares, what tech you used as long as it works, so if you want to make a website out of html, PHP and no JS you're free to do that. If you want to work with people, you might have to make compromises because people have different opinions, but websites like IG could be built in a weekend by one person anyway, right? /s
berniedurfee 3y ago
I disagree with almost all of these conclusions. I appreciate web pages that are sparse and concise. High information density is _not_ generally a good thing. I like clean websites with lots of space. I don’t mind long scrolling websites, though I don’t particularly like the trend of stupid animations that happen as you scroll down. I appreciate that “mobile first” has forced web designers to simplify web sites to be concise. Less is more!
jksmith 3y ago
I could say the same about web on desktop. Desktop native is still the best for desktop. Browsers insert friction and are rent seekers.
deleted 3y ago
[deleted]
eyelidlessness 3y ago
I’ve been a web developer since before “mobile first”, and since before mobile as a serious web target. Granted when it did become a serious target, we had different terms as well: adaptive and responsive design come to mind. “Mobile first” as a concept was not then—and never has been, for anyone who takes those other concepts seriously—“mobile at the expense of all else”. What I mean is that quite a lot of these examples and others people frequently cite when complaining about “mobile first” are not inherent to “mobile first” per se. To my mind, they’re an incomplete application of the principle. And the principle became prominent when the inverse problem was more universal: designs (or simply their implementation) targeted desktop first, and added mobile affordances as an afterthought. “Mobile first” shouldn’t mean that other web experiences aren’t just as important a consideration. Philosophically, it comes from the perspective that a broadly usable and accessible web experience accounts for the most stringent constraints and works out from there. I distinctly recall solving problems like those discussed in the article well over a decade ago. It was a lot of work. It requires a lot of care and attention to detail. That doesn’t excuse skipping any of it! And it really should be more achievable as the standards have evolved. But it does require dedication to addressing a large matrix of users’ needs and usage conditions.
nologic01 3y ago
This is definitely not a web-only issue. I have seen the same issue with convergent KDE apps (Qt UI based). Not an expert in this space but intuitively it feels that what is missing in a widely adopted heuristic of how to "best", or at least, "least-bad" map the information and interactivity components of a given UI to different screen geometries. It feels like a hard problem to crack: in some cases there might not be a good solution at all. So the heuristic should be able to say "no, what you are trying to do does not match any known Homo Sapiens sensory configurations". Think e.g. how you would map a large and busy DAW screen [1] with hundreds of dials on a small mobile. You'd probably have to rethink the entire workflow, segment into small chunks, smoothly switch screens while providing summaries and connecting elements etc. [1] https://soundcamp.org/music-and-sound-production-blog/best-free-and-open-source-daws-music-recording-and-making https://soundcamp.org/music-and-sound-production-blog/best-f...
moribvndvs 3y ago
I hate the “hero” UX concept and how everyone uses it in a useless landing page. Scrolling and clicking through endless marketing BS to figure out what you do and why it’s relevant to me. It’s the business equivalent of restaurant sites that don’t put their hours, address, and phone right in your face.
hypertexthero 3y ago
I enjoyed making simple, fast websites using HTML, CSS and a smattering of JS for progressive enhancement, usually with Django on the backend. Industry got obsessed with JS frameworks made for giganto-orgs as a “solution” for everything. Eyes became fixated on the claustrophobic mobile-first screens. Went back to doing primarily graphic design. Less money, much happier.
AtNightWeCode 3y ago
Don't hire this guy, I guess. Mobile first problems was solved like what, 10 years ago? The problem the other way around is still way more prominent. The amount of sites that still can't function normally on any mobile is just silly.
- AtNightWeCode 3y ago
  I also wonder how the heat maps looks like during these tests. Let me guess, there are none...
seydor 3y ago
I wonder how a global brand like IKEA manages to have such a horrible browsing experience
- 6031769 3y ago
  It's the only way to bring the horrible shopping experience of their bricks-and-mortar outlets to the internet user.
dsmmcken 3y ago
This study doesn't make any practical sense. These pages weren't designed to convey the maximal amount of information in the least amount of space, they were designed to sell a product. It's impossible to claim if these designs have a negative impact due to content dispersion or not unless you are measuring them against the purpose they were designed for. They explicitly studied ecommerce/product pages here. The relevant metrics are which page had a higher perceived product value? Which page had a higher conversion ratio? Which page resulted in a higher NPS? Which page created a more positive brand affinity? You don't sell portable speakers using specs, you sell it with aspirational images of it being used on a beach. Of course expanding an accordion of product details then asking "On a scale from 1-7, How well do you feel you understood the offering communicated on the page?" results in a higher survey score. If you said the more dense page converted better, then I would be surprised. It's like designing a study on the negative impact of hard F1 race car seats, adding a bunch of foam, testing which is more comfortable, then proclaiming one is better than the other because it was rated more comfortable, when the only metric they were designed for is lap time.
- dutchCourage 3y ago
  I'm late to the thread but would like to second this. The design choices the article criticizes aren't the consequence of mobile first design. Actually websites looked like that in the late 2000's, before responsive design became ubiquitous. e.g. Apple https://www.versionmuseum.com/history-of/apple-website https://www.versionmuseum.com/history-of/apple-website
- notfed 3y ago
  > You don't sell portable speakers using specs, you sell it with aspirational images of it being used on a beach I guess that works for some audiences. For me, this can be a strong signal of low quality bs.
- supriyo-biswas 3y ago
  Thank you for saying this, was wondering this all along while reading the article. They compared the information density of, what is essentially a marketing flyer or a billboard and then stated that it doesn’t convey everything: well that’s the point, an ad is meant to invoke the desire for a product in its viewer, instead of being a spec sheet.
utbabya 3y ago
Skimming through the paper format article I struggled to find any grounding. I was curious to see hard numbers such as time to parse information, instead I only see anecdotes like "one participant said". Not that I agree or disagree with the proposition, just not enough information to form opinion.
bitwize 3y ago
Sorry, desktop, you're gonna have to suck hind tit. Most users are on mobile, so that's what gets targeted. Even open source is like this now: GNOME, Wayland, and systemd are designed around the most common use cases their developers anticipate and if you fall into one of the more obscure categories... well, tough.
26fingies 3y ago
given how terrible the mobile web is i refuse to believe anyone is actually doing mobile-first web design
snvzz 3y ago
Some sites override the browser's scrolling behavior. That should honestly be a crime.
- asdff 3y ago
  There are websites that still back button hijack
  - snvzz 3y ago
    Ouch.
blacklight 3y ago
I've been long advocating to get rid of the mobile-first approach and instead embrace a width-agnostic paradigm. It is possible to ensure that a div or image doesn't stretch too much on desktop by setting the right max-width. It is possible to ensure that a tabular div doesn't overflow on mobile by setting the right width in a responsive @media query. The problem is that mobile-first has become mobile-only, assuming that 80% will come from those devices and the others will figure out a way to cope with the eyesore. Real responsive design and craft of width is still possible (now like in 2010), but it takes time and testing - resources that companies are more than willing to save, since everybody in tech seems bent on pushing half-baked MVPs nowadays and call them products.
cambaceres 3y ago
I thought mobile-first web design meant that you start by designing for mobile and then adding features for the bigger screens upward, not to prioritize mobile screens.
rwl 3y ago
> Usability issues of dispersed content include:... > Increased cognitive load > Difficulty building a conceptual model for the page This completely agrees with my own experience. But if these things are true when viewing a "dispersed content" site on a desktop browser, shouldn't they be just as true on mobile? It seems to me that this is a big problem with mobile-first design in general: it's just not the right format for actually conveying conceptual information to users.

770 points by skadamat 3y ago

For websites, theoretically it can be tweaked by custom CSS or something, or hopefully author adjust CSS for desktop. What I now hate is portrait videos. It's nonsense except on a portrait phone.

brailsafe 3y ago

My favourite dead-end task is when I'm working on some established non-mobile first UI that has often been haphazardly put together with only 13" laptops in mind, and asked to essentially "make it responsive". It's a tiresome conversation to have when the task bleeds into another sprint, usually with a surprised manager who I'm sure could have finished in 1 hour between meetings. Don't forget the tests, QA, managing other PR reviews, participating in pointless meetings, and inane last-minute requirements changes

gsuuon 3y ago

Pages aren't optimized for conveying information, they're optimized for CTA interaction rates. I don't think a business fundamentally cares about how well a customer understands the product as long as they buy it.

walteweiss 3y ago

Sorry everyone, but I think if Apple do what they here say ‘bad’, I’d rather believe Apple. Their sales prove their design decisions, with very low content density.

spurgu 3y ago

One mobile-first cancer that's becoming increasingly annoying is sites highjacking Ctrl/Shift/Cmd+clicking (used to open links in new tabs). I paused writing this comment/rant to do a quick search about it and found that someone had already done what I intended to do - write an extension/addon to deal with it: https://github.com/danielnixon/link-fixer https://github.com/danielnixon/link-fixer Thank you Daniel Nixon!

cyberax 3y ago

Yes! I hate websites that put useful content in a thin column in the center. What's worse, formerly normal websites start degrading. Typically, when a new manager is hired and decides to "reimagine" the product with the "mobile-first" vision. The recent Patreon is a good example. And of course, in some cases normal websites go away entirely, and are replaced with crapps: Venmo, Amazon Alexa, Chamberlain, etc.

kodisha 3y ago

Omg yes! It has finally been told! I was crying and talking about making the return of information rich websites, but people were just following trends blindly :(

strobe 3y ago
view point in article mostly from an user perspective, but if same stuff would be reviewed from companies perspectives most of that negatives has positive effects for marketing/sales needs which probably a reason why is so widespread. It's like: our visitor can't just see our half page table with tech spec to know everything, he should go trough 20 images on 2 long pages and during that we will show him all our 'important' messages that he won't be interested otherwise.

awinter-py 3y ago

PREACH opposite way in: 2013 article about high density on the japanese web being (in part) a legacy of their pre smartphone era

hunter2_ 3y ago
Someone told me that Japanese websites tend to look outdated because all of the tooling and code is itself in Japanese, and since that stuff hasn't been updated in a while, the final products are a bit stuck.

kunwon1 3y ago

Many websites will completely alter their UI based on resizing your window. Sometimes I want to set a browser to take up half of a monitor so that I can put something else next to it. This often fails on modern websites because the UI becomes unusable after the window is resized

tiltowait 3y ago
This is the "responsive" part of "responsive design". When done well, it's great, but you're right that many websites are way too aggressive about it, as if they only really tested two size classes.
- ReactiveJelly 3y ago
  I'm mostly appalled at how many desktop users just maximize everything. I even had juniors maximizing terminals.
  - qingcharles 3y ago
    I've never used a window that wasn't maximized. I have focus issues. If there are two windows on the screen it becomes hard for me to concentrate. I have two monitors if I really need two windows (e.g. debugger on one screen). Otherwise it's maximized all day.
  - ryandrake 3y ago
    Why is this appalling?
    - ReactiveJelly 3y ago
      It makes every window interaction slower when I'm helping them and, I assume, when they're alone. I usually have two panes of code and one or terminals on the side so I don't spend time hunting for windows
    - FractalHQ 3y ago
      I think it’s fine until someone sends me a screenshot of my website in fullscreen on a giant 4K monitor.

Cthulhu_ 3y ago

I'm gonna complain about HN though; while it may not have been intended to be mobile first, it kinda is, leading to overly wide text in comments if using a full screen browser. This is the same issue that the previous iteration of Wikipedia's design had.

ryandrake 3y ago
As a user, when I set my browser to be full screen, I expect the content to take up the full screen. I bought a nice big 27" monitor, and I want to use it. How dare some UX designer 2,000 miles away from me simply decide that I should only be able to see content on a 5" wide strip down the middle! The browser should be the User's Agent, not the Web Developer's Agent. If I want to do something with my browser layout that a designer finds appalling, that should not be his concern. If the web developer and designer really think that text should appear in tiny 5" columns no matter how wide my browser is, fine, then flow your design to display multiple side-by-side columns like a newspaper. Don't just fill my screen with whitespace.
- bee_rider 3y ago
  I think multiple side-by-side columns would be great. Actually, do you know of any sites that actually re-flow text like that? It’d love to see it. I don’t really want text to reflow to be, like 23, inches wide or whatever. Books with 23 inch wide pages are quite rare, because, I think, that is too much horizontal space, scanning that far with you eyes can become a drag. Of course, if a page just uses the whole width uninterrupted for text I can just give it half the screen, so that is fine. But I’m curious, do you actually like the look of a page like that? Or is this just on principle—respect user choice and all that (if so, good principle!) In general web devs seem to think way too much about the layout of pages, if they would just do the simple thing users could resize the window to their liking.
  - ryandrake 3y ago
    I think I might have seen the "column-ization" method once and was impressed by it. HN's handling of different browser widths is... pretty weird, at least on my Desktop Safari browser. Looks like from browser widths of 1920px and greater, HN maintains fixed size whitespace borders and scales the content width. Nice. When you shrink the window past 1600px, it holds the content size fixed and shrinks the borders. I guess the intent is to smoothly transition into a mobile design without the borders. Past 1516px, it removes the borders altogether, and seems to transition into this "mobile" design. Between there and around 610px, it seems to shrink the content width by discrete fixed amounts every 200px or so, to "keep up" with the browser width. Finally, below 610px or so, the site goes back to the non-mobile design, laying out as if the browser was 1600px wide (and actually truncating the right hand side of the text)--totally broken. All that complexity--for a text only site! When they could just make the text 100% of the browser width and let me as the user decide what is comfortable to view. It's still much, much better than sites that just limit the content width to 600 pixels and fill everything else with whitespace!

usrbinbash 3y ago

The problem isn't "mobile first" design. The problem is "mobile only" design. PCs and Laptops exist. They have wide, high resolution screens and precision pointing devices. All relevant technologies support changing the rendering based on the display available to the browser. It's not that hard. The problem starts when designers ignore these facts, and instead pop giant buttons, zero navbars, hamburger menus, and thin columns with low information density into the Webbrowser running on my PC with a 4k screen and a 120$ laser mouse. https://idlewords.com/talks/website_obesity.htm#sprawl https://idlewords.com/talks/website_obesity.htm#sprawl

ryandrake 3y ago
Our UX's are turning into the Hospital Computer scene from Idiocracy[1]. 1: https://www.youtube.com/watch?v=LXzJR7K0wK0 https://www.youtube.com/watch?v=LXzJR7K0wK0
- _chu1 3y ago
  As time goes on that movie becomes more and more of a documentary.
hombre_fatal 3y ago
> It's not that hard. It actually is very hard to design a responsive UX that can handle anything from the smallest smartphone up to ultrawide monitors.
- stronglikedan 3y ago
  > It actually is very hard Only when folks try to get fancy. K.I.S.S(illy).
  - postalrat 3y ago
    Name a few example sites that kept it simple

jjoonathan 3y ago

Hamburgers and Hieroglyphs! Ahhhhhhhhhhh! I get why they are used on mobile. If you only have room for content, it makes sense to tuck actions away into a hamburger menu except for a small number that you assign to tiny little hieroglyphs. Fine. However, if you have space, this is a terrible way to use it. At best it adds steps, at worst it invites experimentation and disaster to figure out what the heiroglyphs do (which wouldn't be so bad if undo worked but we've apparently decided undo is fine to break too). Like the Apple HIGs used to say, on Desktop you should want to get the most common actions out of menus and onto labeled buttons so that users can answer "what can I do?" without playing hide and seek. Undo should be baked in from the very start (it's hard to retrofit) to reduce the consequences of experimentation. Unfortunately mobile design has taken over so completely that even on apps which will be used almost entirely on desktop, even on apps with an internal advocate for Desktop design, UI designers go for the hamburgers and heiroglyphs and broken undo because it's standard these days. Sigh. Oh, and modals are back with a vengeance, but I need to stop here or my blood pressure is going to get unhealthy.

ndriscoll 3y ago
I don't think there's any excuse for hieroglyphs. Even a low-end 5 year old phone like the moto e4 has a 1280x720 display; there's plenty of pixels available to label the icons. Hieroglyphs are a "we hate our users and want them to know it" first design. Hamburger menus could also frequently be done away with when you look at how many options they have. Like Gmail's app has them when it could fit the icons across the screen as a bar. And it's hard to argue that real estate was important since they put in a bottom bar for chat, video, and spaces whatever that is.
- deleted 3y ago
  [deleted]
- wil421 3y ago
  I deal with some legacy web apps and ticketing system at work. They could use a hamburger menu or two. 10 buttons, 15 tabs, and a million inputs most people don’t use.
- 3y ago

OrvalWintermute 3y ago

I've been seeing this more in content, and also apps that are "browsers" really - some view control that have a mobile & PC/MacOS equivalent - like they are intentionally formatting everything for portrait type display on mobile My devices are a literal ton of iOS ones, and then 4k and a 2560 × 1440 display which I use most frequently lately. Tons of whitespace, oversized text everywhere and incorrect use of Z-index are some of the hallmarks of this mobile-first design.

hans_castorp 3y ago

Not directly related (or is it?): I just hate sites where all I see is some fancy wallpaper image and a slogan (if at all). Then I have to scroll down on my 27" monitor to be able to actually read anything on that site. That is stupid - at least in my opinion.

atq2119 3y ago
Proposal to introduce the term "villain image" for this sort of thing.

strangescript 3y ago

What you really want is two apps, completely different UX's and its not worth the effort more times than not. No one is going to Herman Miller's website for example and not buying a chair because they don't like the desktop web app experience. They might pass though if they can't get the site to work well on their phone.

marginalia_nu 3y ago
Huh? I've definitely bounced off shops because their web app experience sucked.
- pavel_lishin 3y ago
  Same for restaurants who over-design their website and make it difficult to find the only three things I care about: location, hours, menu.
  - Isthatablackgsd 3y ago
    Don't forget contact too. It was difficult to find contact information on some sites. I remember 10 years ago contact information are usually at the bottom of the main page or in the nav menu. Now, it took some soul searching to find it where they buried it in the submenu. Sometime I usually use Google Maps to get the address or phone number since some site don't make it easier to find it
  - Sohcahtoa82 3y ago
    The trend that I have found to be truly aggravating is restaurants recognizing that sometimes I just want to look at the menu. I don't want to place an order. Don't make me tell you when I want to pick up my order or where I want it delivered. I just want to browse and make a decision later.
deleted 3y ago
[deleted]
cyberax 3y ago

kimi 3y ago

I can only think "first world problems".

lsmeducation 3y ago
I like my first worldism. Nothing satisfies me more than a nice coffee and a smug "I cant stand Jira" in the morning. My life is hard.
Ensorceled 3y ago
Ummm yes? The overwhelming majority of articles on this site are addressing 1st world problems. Are you posting this from your MSF rotation in Gaza?

meiraleal 3y ago

The Negative Impact of not being mobile first: it took me 5 attempts to dismiss the annoying cookies popup.

marginalia_nu 3y ago

Yeah, as someone who can't use touch screens, this is a serious pain point in a lot of my web browsing. Mobile first design is an accessibility problem.

caseyf 3y ago

i wish that "Compact" and "Comfortable" options for spacing were as common as dark/light mode

adrr 3y ago
Dark mode requires visual content rich sites to have two sets of assets. Example would be a marketing chart with a white background needs to have a corresponding asset with a black background with different color text and bars.
- omarfarooq 3y ago
  That can be solved with transparent background images, and brand color palettes that balance contrast in the two modes.

_greim_ 3y ago

The visual design problem mirrors a problem with the organization producing the website. Before mobile, a website was the entire online presence of a company; every subdivision within the company had a presence above the fold. The culture and conceptual structure of web development developed around this concept. As mobile mandates pushed things below the fold or off the site entirely, web teams found themselves unprepared and have adapted awkwardly, as this article shows. Mobile app teams never had this cultural baggage, which is one of the many reasons native apps are perceived as superior.

gherkinnn 3y ago

The irritating thing is that it is neither mobile first nor desktop first. Most websites I come across are designed and built for desktop but using a mobile aesthetic.

runjake 3y ago

The apps go where the money is, most normal people are mobile-first or mobile-only.

adrr 3y ago
90% on e-commerce sites.
- runjake 3y ago
  90% mobile? If so, wow!

deleted 3y ago

[deleted]

blooalien 3y ago

The problem sadly isn't even mobile-first vs. desktop, but rather designers who still haven't figured out that the web is dynamic content that should be allowed to flow according to the user's display device size and shape. It's not and never has been a static medium like paper. It's not limited to a specific size and shape like paper, and should not be treated as if it were. Web "designers" should not be trying to force the content into any specific size or pixel resolution, as there's just too many different resolutions of screens and width vs. height layouts of those screens to ever be able to cover them all appropriately without adapting to the idea that the content must be able to flow accordingly. It also severely harms accessibility for folks with vision issues who might scale up their fonts to compensate if doing so causes the content to break in horrible ways that make it unreadable.

ReactiveJelly 3y ago
The designers probably know that, but it costs money to design for 2 platforms. So they pick the 2 biggest platforms for non-hackers... Android and iOS...
- blooalien 3y ago
  You're not designing for two (or more) platforms at all. You're designing for one platform. The Web. It's built on some pretty well defined standards that a ton of folks seem hellbent on breaking to force the web into a shape that it simply isn't.
  - BlueTemplar 3y ago
    They didn't mean platform in this way. But in the sense that small touchscreens are fundamentally different than big monitors + mouse & keyboard. That's why anything that is not the simplest website should use two different interfaces. (Also, apps don't belong in browsers.)
- albedoa 3y ago
  > So they pick the 2 biggest platforms for non-hackers... Android and iOS... I can't imagine you are talking about the same thing here. (Or if you are, then you are making OP's point.)

programmertote 3y ago

Vanguard has been guilty of this as well. Its recent site redesign has been all over the place, and sometimes leaning heavily toward folks using its phone app (not that its phone app is very user friendly either; for example, checking what orders one has placed by account is impossible). It used to be that the website has a table view that shows almost everything I need to know about my holdings. Now, it takes a few clicks to find that info and even then, the layout is so sparse (mobile optimized) and hard to read. Maybe I'm getting really old and just like to complain about this because I'm not very much used to this phone-oriented UIs.

ReactiveJelly 3y ago
I think they also eliminated some of the color hierarchy in favor of just making everything big black text swimming in a sea of white. So it's a little harder to see which pieces of text belong together. I hate it lol
spookthesunset 3y ago
Vanguard's website has always been a mess, to be honest. It's really hard to figure out how to do some basic stuff like transfer money. I figure their website is so bare bones because it reflects their low cost ETFs. They'd rather have a crappy website and cheap ETF's than a fancy website with slightly higher cost ETFs.

Ensorceled 3y ago

I’m less concerned with brochure and ecommerce sites. But mobile first design for productivity sites and tool interfaces drive me crazy. Who normally accesses these tools from their phones?

joelanman 3y ago
People who need to zoom in a lot in order to use it. In practice this gives you a small screen view. It's a WCAG requirement
dpifke 3y ago
I recently had the misfortune of having to use a background check app that was mobile only! It was a real pain to enter past employer and residence names and addresses on a mobile keyboard, but even worse when it came to dates, because the date picker would only scroll a month at a time, starting from the current month and year. To enter my birthdate, I had to tap ~550 times. (I was kinda tempted to file an EEOC claim, since the broken date entry has a disproportionate impact on older workers, a protected class. But that's not a great way to introduce yourself to a new employer's HR department.)

pipeline_peak 3y ago

Rightfully so, what’s in it for them to spend more resources on such a niche group? Desktops/Laptops are for gamers, workers, and programmers. This isn't 2006, people don't read articles on their desktops in leisure. If they are it's because they were also doing one of the three use cases I mentioned.

denton-scratch 3y ago
> Desktops/Laptops are for gamers, workers, and programmers Nah. Like, I'm all of those; but I very rarely play games these days, and I've retired from programming. But I strongly prefer to use a laptop to browse; I never use a mobile browser. My eyesight is too poor, and my fingers are too fat.
- pipeline_peak 3y ago
  >My eyesight is too poor, and my fingers are too fat. What about tablets?

JansjoFromIkea 3y ago

Think a lot of the issue is the difficulty grasping what size the actual screen is. I get webpages on my 1080p monitor where everything is just far too big but I guess as far as the code is concerned it has limited knowledge of whether the physical size of the screen is 24" or 5"

skydhash 3y ago
I think mobile devices use scaling. The number of pixels reported are are not the screen’s resolution.

collaborative 3y ago

Display: inline-block is the answer :p

WesolyKubeczek 3y ago

Shit like this makes me want to learn more about using accessibility features of my browsers. I'm far from going blind, but I don't want to scroll through the angry fruit salad of alegria art, huge stock images that take a huge amount of screen real estate and the important bits being tucked away probably somewhere in the bottom. "Minimalist design" and it still takes multiple megabytes of bandwidth to show a pretty nothing. I'm using Reader Mode or an equivalent whenever I can. If a site cannot be dealt with using RM, I mostly go elsewhere. Now get off my lawn, kids.

zubairq 3y ago

I think that many user interfaces only make sense on desktop, like development IDEs for example

novok 3y ago

It’s an indicator that most of their userbase is mobile. Look at B2B SaaS apps and they tend to have the opposite problem

r113500 3y ago

Danny o'brien, he runs one of the oldest surviving blogs, oblomovka, coined a term "hinternet" sometime in 2007, that was when the internet was still being run by the technological elite, for themselves, but normal people have also joined. The idea of hinternet was that there was essentially two internets. One is the sophisticated technology and a value add, and the other one is the internet of the viagra pills and popup banners. We, the technology elite, would rarely venture into the hinternet, like going into a bad neighborhood, where's normal people had no such mechanism for discernment, so their experience of the internet was distinctly different and inferior. Now most of the internet is hinternet, and we're all forced more and more to rely on it. Banking systems, mortgage platforms, car payments, utilities payments are generally designed mobile first, desktop later, they employ various dark techniques for "verifying real user", which break on open platforms, forcing you to access them from iPads and other such locked down devices, or not at all. If hinternet used to be the dark shady streets where hucksters were peddling you knockoff watches, then now hinternet is the dystopian landscape of vertical information integration, ran, behind the scenes, by para-governmental institutions. You can't log in into irs without using id.me, a digital wallet and identity management platform, that sells you things. There are attempts to cultivate little gardens of sophistication, but they are of mixed success. On a personal level there's a strong disincentive to participate in the hinternet beyond the mandatory, carefully navigating poorly designed and conceived systems just long enough to achieve an objective. One has to login into irs, but one doesn't really need to read that popup and upsell blocked, mobile centric news article. From this perspective "mobile-first web design" is a symptom removed from its greater context.

dannyobrien 3y ago
Link to the piece if anyone finds this in the future: https://www.oblomovka.com/wp/2003/04/15/the-hinternet/ https://www.oblomovka.com/wp/2003/04/15/the-hinternet/ (It was both strangely broken in my WP database, and also I think my website was down when OP write this. Sorry!)
Obscurity4340 3y ago
This is an interesting thing. Honestly can't remember the last time I saw an ad or easy phishing thing. Like obv in your junk mail but thats literally the extent of my exposure to it, everything else is curated and "good" or probably aligns with your concept of the priveleged netizens/areas even though Im poor as hell. Knowledge wise I suppose I rich so there's that but there's also seems like a tradgedy of the commons type situation that depends on all the tech-illiterates to be the meat shields for advertising and paying for things like YouTube

torartc 3y ago

Skill issue.

tempodox 3y ago

It's not just web design. Desktop software is being ruined by mobile-only app design.

josefresco 3y ago
Desktop software has been ruined by touch UI. Big buttons made for fat fingers means we get "Fisher Price" UIs. Not a bad thing for the casual user, but for power users it feels like we're moving backwards.

notjustanymike 3y ago

This is a really long article to say "Content dispersion is bad". Yeah, obviously. More so if you use a generic image like Waze. It's not a usability problem, it's a quality problem. Apple does just fine with full width desktop heroes because they include relevant images.

zeroCalories 3y ago

Over the years it's become clear to me that frontend is probably the hardest part of the stack. People think they can just shit out some bootstrap react app and it's perfect, but being able to write complex UIs that can work on any browser, any device, with all assistive technologies, and all languages, is extremely hard. You need someone with a deep knowledge of html, css, and the supportive web apis. A good frontend engineer is incredibly rare, even at big tech. What's even more rare is a UX designer that also thinks about these things, who are worth a million bucks.

smokel 3y ago
The irony is that we are now all very enthusiastic about a text based user interface.
martin_drapeau 3y ago
UI, in my mind, has always been the hardest part of the stack. It is even more true today. A front-end dev must: - Deal with a subjective human (not an objective machine) - Deal with designers and product managers - Be constrained by the back-end engineer and infrastructure - Make it work on multiple devices and browsers - Use the framework someone else chose - Not break anything Kudos to all front-end devs out there!
- dasil003 3y ago
  I don't mean to minimize the effort of FE as I agree it is under-appreciated. But if the BE folks don't work closely with PMs and designers then you're already fucked and no amount of FE lipstick will make up for it.
  - ack_inc 3y ago
    Your comment made me curious: what kinds of insights have you seen BE folks miss due to not working closely with PMs and designers?
    - dasil003 3y ago

peebeebee 3y ago

As a webdesigner myself I kind of disagree. Simple content per screen just works better for the example they gave. It’s easier to visually parse. Their condensed version has a lot of multi column layouts which I really dislike. High content density works for desktop applications, but not for what’s basically a brochure website.

mumblemumble 3y ago
What's cool about the article's take, though, is that it's based on an actual usability study and not just something someone said.
- lagt_t 3y ago
  Where's the peer review?
  - mumblemumble 3y ago
    Let's not set up a double standard here. It's not like non-evidence-based opinions are subject to peer review.
    - lagt_t 3y ago
      I'm just applying the same standard here, a non peer reviewed study has the same value as the opinion of a web designer.
  - _Algernon_ 3y ago
    A study needs peer review, but some web designer's opinion is just to be accepted as gospel?
    - lagt_t 3y ago
      Nope, both are to be taken with a grain of salt.
    - 3y ago

jddj 3y ago

The thing that I truly find awkward is no nice touch equivalent to hover. It's such a useful piece of the UX to have thrown away in the move to mobile first. Other than that I probably fall in the "it's not that hard" camp. Of all the problems you have to solve, getting it to look reasonable on a few different screen sizes is pretty far down the list in terms of time and complexity.

extraduder_ire 3y ago
I think long press handles both that and right-click on touchscreens. Or at least that's what I use to get at image alt text on mobile firefox. Actual hover detection would be possible, but I imagine that UX would suck unless you were using a stylus.
- wildrhythms 3y ago
  Long press is already an engrained mobile OS behavior (begin text selection). And it doesn't solve the problem because the hover state is largely non-visible beneath the user's finger.
Sanju_2306 3y ago
hover like effect with touchscreen was possible in Xperia Sola.

neilv 3y ago

> to consume all content. I've decided, whenever anyone weighs in on information/interaction design, and says "consume...content", what they are saying is, "Hey, we've been stabbing everyone in the face all wrong, here's a better way to stab everyone in the face."

yetanotherloss 3y ago
Our AB testing indicates 12% higher laceration engagement is possible with additional modal enstabbators.

aa_is_op 3y ago

Add Substack to the list of brain-dead companies that use a mobile-first UI for an app that's primarly used on the desktop. Cause nobody types 3,000-word newsletters on their mobile, that's for damn sure!

melenaos 3y ago

Mobile-first is not mobile only design! This article has completely misunderstand the term, mobile first it's the technical way of organizing the CSS to render the mobile viewport first and then the rest of the 'breakpoints'. Mobile-first design has the advantage, over the desktop-first design, that it directly render first the mobile design and the cellphone experience is much faster and with less rearragning flickering. Mobile-first doesn't have the corresponding disadvantages at the desktop browser since they tend to have a land line internet and much faster cpu and memory.

omarfarooq 3y ago
I think they're assuming or taking the case of mobile first design with desktop as an afterthought.

lofaszvanitt 3y ago

World Leaders in Research (!)-Based User Experience --- And they checked a Herman Miller site. How often do you go to HM? When you want to buy a 6000 dollar chair. That's maybe once in a lifetime. On desktop, nobody cares about mobile first trendy large image sites, because you can scroll, you have a mouse, you have a full keyboard. You can use CTRL-F. You can navigate away from the bullshit, QUICK. Your handicap is ZERO. The real problem is really about mobile sites viewed on mobile. You search for something and arrive butt naked on sites. What you get? Full screen cookie consent pages. Then a subscribe to the newsletter full screen modal. Okay, now you get the content, but not really, because half size ads, ads on top, ads on bottom kill your eery-xperience. The experience is crazy because you have a restricted way to interact with the site. A shitty onscreen keyboard, you have to scroll a lot with your fingers. Save the mobile experience first. On desktop the problem is with large sites, with lots of traffic, with lots of users. "Finely" tuned by the sancrosanct A/B tests. Facebook/Instagram desktop experience is borderline crazy. Facebook's comment experience is just plain shit. Koko the tacticle sign-speaking gorilla would've made a better job on that. On Instagram, if you view it from desktop, then you are viewed as a peasant. How dare you to visit the site from the desktop? Are you retarded? Clicking on a post? Go register now, peasant! Wait a sec, you tried to register through desktop? Now go hang yourself, rural monkey! No, you can't set yourself to be 18+ to view the boobs, you need a mobile for that. Told ya, go hang yourself desktop peasant. Oh, the creators of React, the bloated bullshit frontend experience framework created by colour haired individuals that every brainwashed idiot loves like a plush polar bear. Time to push back and send the naive + trendy developers to the soon to be established Mars base.

motoxpro 3y ago
Not sure if I understand you correctly, but the article talked about the friction created by scrolling and "Ctrl+F"ing. Cookie consent, 18+ (I assume you're talking about Reddit), etc are all laws, which I think you would have more luck contacting government officials than a front end dev. The best part of programming is no one knows, or cares, what tech you used as long as it works, so if you want to make a website out of html, PHP and no JS you're free to do that. If you want to work with people, you might have to make compromises because people have different opinions, but websites like IG could be built in a weekend by one person anyway, right? /s

berniedurfee 3y ago

I disagree with almost all of these conclusions. I appreciate web pages that are sparse and concise. High information density is _not_ generally a good thing. I like clean websites with lots of space. I don’t mind long scrolling websites, though I don’t particularly like the trend of stupid animations that happen as you scroll down. I appreciate that “mobile first” has forced web designers to simplify web sites to be concise. Less is more!

jksmith 3y ago

I could say the same about web on desktop. Desktop native is still the best for desktop. Browsers insert friction and are rent seekers.

deleted 3y ago

[deleted]

eyelidlessness 3y ago

I’ve been a web developer since before “mobile first”, and since before mobile as a serious web target. Granted when it did become a serious target, we had different terms as well: adaptive and responsive design come to mind. “Mobile first” as a concept was not then—and never has been, for anyone who takes those other concepts seriously—“mobile at the expense of all else”. What I mean is that quite a lot of these examples and others people frequently cite when complaining about “mobile first” are not inherent to “mobile first” per se. To my mind, they’re an incomplete application of the principle. And the principle became prominent when the inverse problem was more universal: designs (or simply their implementation) targeted desktop first, and added mobile affordances as an afterthought. “Mobile first” shouldn’t mean that other web experiences aren’t just as important a consideration. Philosophically, it comes from the perspective that a broadly usable and accessible web experience accounts for the most stringent constraints and works out from there. I distinctly recall solving problems like those discussed in the article well over a decade ago. It was a lot of work. It requires a lot of care and attention to detail. That doesn’t excuse skipping any of it! And it really should be more achievable as the standards have evolved. But it does require dedication to addressing a large matrix of users’ needs and usage conditions.

nologic01 3y ago

This is definitely not a web-only issue. I have seen the same issue with convergent KDE apps (Qt UI based). Not an expert in this space but intuitively it feels that what is missing in a widely adopted heuristic of how to "best", or at least, "least-bad" map the information and interactivity components of a given UI to different screen geometries. It feels like a hard problem to crack: in some cases there might not be a good solution at all. So the heuristic should be able to say "no, what you are trying to do does not match any known Homo Sapiens sensory configurations". Think e.g. how you would map a large and busy DAW screen [1] with hundreds of dials on a small mobile. You'd probably have to rethink the entire workflow, segment into small chunks, smoothly switch screens while providing summaries and connecting elements etc. [1] https://soundcamp.org/music-and-sound-production-blog/best-free-and-open-source-daws-music-recording-and-making https://soundcamp.org/music-and-sound-production-blog/best-f...

moribvndvs 3y ago

I hate the “hero” UX concept and how everyone uses it in a useless landing page. Scrolling and clicking through endless marketing BS to figure out what you do and why it’s relevant to me. It’s the business equivalent of restaurant sites that don’t put their hours, address, and phone right in your face.

hypertexthero 3y ago

I enjoyed making simple, fast websites using HTML, CSS and a smattering of JS for progressive enhancement, usually with Django on the backend. Industry got obsessed with JS frameworks made for giganto-orgs as a “solution” for everything. Eyes became fixated on the claustrophobic mobile-first screens. Went back to doing primarily graphic design. Less money, much happier.

AtNightWeCode 3y ago

Don't hire this guy, I guess. Mobile first problems was solved like what, 10 years ago? The problem the other way around is still way more prominent. The amount of sites that still can't function normally on any mobile is just silly.

AtNightWeCode 3y ago
I also wonder how the heat maps looks like during these tests. Let me guess, there are none...

seydor 3y ago

I wonder how a global brand like IKEA manages to have such a horrible browsing experience

6031769 3y ago
It's the only way to bring the horrible shopping experience of their bricks-and-mortar outlets to the internet user.

dsmmcken 3y ago

This study doesn't make any practical sense. These pages weren't designed to convey the maximal amount of information in the least amount of space, they were designed to sell a product. It's impossible to claim if these designs have a negative impact due to content dispersion or not unless you are measuring them against the purpose they were designed for. They explicitly studied ecommerce/product pages here. The relevant metrics are which page had a higher perceived product value? Which page had a higher conversion ratio? Which page resulted in a higher NPS? Which page created a more positive brand affinity? You don't sell portable speakers using specs, you sell it with aspirational images of it being used on a beach. Of course expanding an accordion of product details then asking "On a scale from 1-7, How well do you feel you understood the offering communicated on the page?" results in a higher survey score. If you said the more dense page converted better, then I would be surprised. It's like designing a study on the negative impact of hard F1 race car seats, adding a bunch of foam, testing which is more comfortable, then proclaiming one is better than the other because it was rated more comfortable, when the only metric they were designed for is lap time.

dutchCourage 3y ago
I'm late to the thread but would like to second this. The design choices the article criticizes aren't the consequence of mobile first design. Actually websites looked like that in the late 2000's, before responsive design became ubiquitous. e.g. Apple https://www.versionmuseum.com/history-of/apple-website https://www.versionmuseum.com/history-of/apple-website
notfed 3y ago
> You don't sell portable speakers using specs, you sell it with aspirational images of it being used on a beach I guess that works for some audiences. For me, this can be a strong signal of low quality bs.
supriyo-biswas 3y ago
Thank you for saying this, was wondering this all along while reading the article. They compared the information density of, what is essentially a marketing flyer or a billboard and then stated that it doesn’t convey everything: well that’s the point, an ad is meant to invoke the desire for a product in its viewer, instead of being a spec sheet.

utbabya 3y ago

Skimming through the paper format article I struggled to find any grounding. I was curious to see hard numbers such as time to parse information, instead I only see anecdotes like "one participant said". Not that I agree or disagree with the proposition, just not enough information to form opinion.

bitwize 3y ago

Sorry, desktop, you're gonna have to suck hind tit. Most users are on mobile, so that's what gets targeted. Even open source is like this now: GNOME, Wayland, and systemd are designed around the most common use cases their developers anticipate and if you fall into one of the more obscure categories... well, tough.

26fingies 3y ago

given how terrible the mobile web is i refuse to believe anyone is actually doing mobile-first web design

snvzz 3y ago

Some sites override the browser's scrolling behavior. That should honestly be a crime.

asdff 3y ago
There are websites that still back button hijack
- snvzz 3y ago
  Ouch.

blacklight 3y ago

I've been long advocating to get rid of the mobile-first approach and instead embrace a width-agnostic paradigm. It is possible to ensure that a div or image doesn't stretch too much on desktop by setting the right max-width. It is possible to ensure that a tabular div doesn't overflow on mobile by setting the right width in a responsive @media query. The problem is that mobile-first has become mobile-only, assuming that 80% will come from those devices and the others will figure out a way to cope with the eyesore. Real responsive design and craft of width is still possible (now like in 2010), but it takes time and testing - resources that companies are more than willing to save, since everybody in tech seems bent on pushing half-baked MVPs nowadays and call them products.

cambaceres 3y ago

I thought mobile-first web design meant that you start by designing for mobile and then adding features for the bigger screens upward, not to prioritize mobile screens.

rwl 3y ago

> Usability issues of dispersed content include:... > Increased cognitive load > Difficulty building a conceptual model for the page This completely agrees with my own experience. But if these things are true when viewing a "dispersed content" site on a desktop browser, shouldn't they be just as true on mobile? It seems to me that this is a big problem with mobile-first design in general: it's just not the right format for actually conveying conceptual information to users.