Live data from Hacker News

Just because I have a vertical screen doesn’t mean I’m on a phone

shkspr.mobi

51–60 of 399 posts

Re: Just because I have a vertical screen doesn’t mean I’m on a phone

#51

The real problem is that designing for different screen sizes, especially with responsive design, is very difficult. For my personal projects, screen size is the factor used to determine layout. Mobile/tablet/laptop/desktop is irrelevant. My goal with smaller viewports is to make the layout as similar as possible, without the user having to scroll horizontally. Because I don't want to change the layout too much, I do…

> Hamburger menus are terrible - I see them as a design copout.

I am genuinely interested in why. The only reason I can think of, is that they may me unintuitive, but I think this is becoming less and less of a problem.

Hamburger menus are an accepted and pervasive design element. That does not means it’s good design, but it means that users are familiar with the concept. Familiarity goes a long way to ensuring good UX.

Re: Just because I have a vertical screen doesn’t mean I’m on a phone

#52
post #42
post #21

Earlier quoted context omitted.

Exactly. CSS does not check that your screen is taller than it is wide. What it sees is a narrow viewport.

Is that what this is for? https://developer.mozilla.org/en-US/docs/Web/CSS/@media/aspe...

You can query for aspect ratio in CSS, yes. This can be useful for figuring out whether it's better to place something as, say, a sidebar vs a footer. The sites they are complaining about, however, are only looking at the horizontal dimension.

Re: Just because I have a vertical screen doesn’t mean I’m on a phone

#53

Wait, so sniffing on screen resolution is the way web developers distinguish desktops from mobile? That's just crazy . There should IMO be a preference sent, "I'm on a portable, touch-enabled device". I'm guessing it doesn't exist because it would add a bit to the fingerprint.

Yes, they define a bunch of @media filters in css for different known screen widths. You usually get a surprising look when pointing out that it is crazy. “How else would you know that?”

Something as simple as “use-case: handheld | bellyheld | desktop” property? Css designers missed this opportunity completely.

Re: Just because I have a vertical screen doesn’t mean I’m on a phone

#54
post #20

I feel like this is a more complex problem to solve than it seems at face value or the author implies, especially considering tablets of varying dpi. CSS dpi media queries are unsupported in Safari mobile and desktop, so that increases the complexity significantly. Beyond that, the fact is most web layout is still done in px or other non-fraction-of-the-width units, so it’s often a matter of the wider layout simply b…

There’s a good reason why there are no real DPI media queries: You should not decide how big things appear on the screen, that’s up to the user. The user has the ability to change resolution or to change the website’s zoom level, you should never access the real size and decide that a button must be exactly 1cm wide in real life on every screen for everyone.

Just design for the default and then people will zoom or change resolution if the default isn’t enough.

Re: Just because I have a vertical screen doesn’t mean I’m on a phone

#55
post #42
post #21

Earlier quoted context omitted.

Exactly. CSS does not check that your screen is taller than it is wide. What it sees is a narrow viewport.

Is that what this is for? https://developer.mozilla.org/en-US/docs/Web/CSS/@media/aspe...

I think primarily that's for constraining a div's aspect-ratio. Like making sure you have a div that's always 16:9 to hold a video player. I'd be interested in hearing other use cases, though.

Re: Just because I have a vertical screen doesn’t mean I’m on a phone

#57
I think many developers/designers ignore device and dpi detection now. It has become too complicated, and the benefits are too few.

@media rules with min-width or max-width is really all you need; just make sure the breakpoints aren't so ridiculous that you serve the "mobile" version of your site to desktop users.

Re: Just because I have a vertical screen doesn’t mean I’m on a phone

#58
I'm kind of confused about this - I'm sure the author experiences real problems, but I wonder if there's something else at play here?

I've never actually seen screen aspect ratio media queries used in practice, nor have I really seen them advocated for. When I load www.theguardian.com on my portrait monitor (1441 x 2561) I get the desktop layout https://imgur.com/a/ZpUI95Z

Absolutely yes design your breakpoints around screen width. Using aspect ratio seems like a poor choice.

Re: Just because I have a vertical screen doesn’t mean I’m on a phone

#59

The real problem is that designing for different screen sizes, especially with responsive design, is very difficult. For my personal projects, screen size is the factor used to determine layout. Mobile/tablet/laptop/desktop is irrelevant. My goal with smaller viewports is to make the layout as similar as possible, without the user having to scroll horizontally. Because I don't want to change the layout too much, I do…

The real real problem is that so many sites overcomplicate their design.

HN works beautifully on any window / screen size.

Post reply on HN