Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

The ideal viewport doesn't exist

viewports.fyi

Post reply on HN
Print view View original

51–60 of 202 posts

Re: The ideal viewport doesn't exist

#51

Post by afavour »

crazygringo wrote: post #50
afavour wrote: post #25

Earlier quoted context omitted.

The OP is talking about things like media queries that only look at screen width and imply other things like input method from that. IIRC SquareSpace does exactly what they're saying: on desktop sites will have a horizontal list of links but on mobile it's a hamburger icon that takes over the entire viewport when clicked. Functionality exists to target pointer type and things like that in media queries, it's just ver…

But that's what you want , no? I just visited SquareSpace and their homepage seems to work as I'd want. When my viewport is narrow enough that there isn't space for the horizontal navbar at the top, it switches to hamburger menu. Surely this is better than cutting off the navbar and half the page content in the middle vertically, and requiring the user to scroll horizontally?

The hamburger menu could just be a vertical drop down stack rather than something that takes over the entire screen.

The point is that the viewport-covering menu is huge because it’s designed to accommodate touch (i.e. imprecise) interaction. It could be much smaller when the user is using a mouse. But you rarely see such accommodation being made. The assumption is low width = mobile = touch.

Re: The ideal viewport doesn't exist

#52

Post by danielvaughn »

5350-uiop-1130 wrote: post #15

> "The main point we’re trying to get across is that you simply do not know how users are going to visit your website or web app. Instead of making design decisions on strict, limited breakpoints, keep in mind the sheer amount of fragmentation there is in viewports." I don't know how useful this is. setting breakpoints allows some sanity in the build and testing process otherwise you have an infinite scope for issues…

The problem is that at a real company, this is very difficult because you have to argue with your product/design team and explain why you don't want to implement [x] feature because it's "too complex". Inevitably they'll point to some competitor website that has the same feature, which makes you look like you're just lazy. It's possible to succeed in those arguments, but it's hard.

It's one thing to convince them not to do some weird scrolljacking, but even something like a dropdown or a popover adds a ton of complexity for responsive sites.

Re: The ideal viewport doesn't exist

#53

Post by traceroute66 »

5350-uiop-1130 wrote: post #15

> "The main point we’re trying to get across is that you simply do not know how users are going to visit your website or web app. Instead of making design decisions on strict, limited breakpoints, keep in mind the sheer amount of fragmentation there is in viewports." I don't know how useful this is. setting breakpoints allows some sanity in the build and testing process otherwise you have an infinite scope for issues…

> I don't know how useful this is.

The website that is the subject of this discussion comes from Andy Bell.

I would encourage you to see his other work, e.g. Every Layout[1], and the website[2] linked to a recent talk he gave[3].

In particular the answer to your question can be found at 14:38[4] in the talk, perhaps more precisely the slide he shows at 14:59.

[1]https://every-layout.dev [2]https://buildexcellentwebsit.es [3]https://www.youtube.com/watch?v=5uhIiI9Ld5M [4]https://youtu.be/5uhIiI9Ld5M?t=878

Re: The ideal viewport doesn't exist

#54

Post by dsr_ »

5350-uiop-1130 wrote: post #15

> "The main point we’re trying to get across is that you simply do not know how users are going to visit your website or web app. Instead of making design decisions on strict, limited breakpoints, keep in mind the sheer amount of fragmentation there is in viewports." I don't know how useful this is. setting breakpoints allows some sanity in the build and testing process otherwise you have an infinite scope for issues…

Fundamental dilemma:

* The web is a great way to publish information and access a few services.

* The web is the cross-platform operating system for applications.

Everything stems from the difference in those two approaches. Both are correct.

Re: The ideal viewport doesn't exist

#56

Post by aendruk »

Technotroll wrote: post #20
PMunch wrote: post #5

I wish more pages took the pointer and resolution media queries into account. So many times I open windows side-by-side on my desktop and end up with the menu collapsing into a hamburger menu which fills the entire screen when clicked. Many phones today have very high DPI and very low precision in touch, so it makes sense to have massive visual elements and buttons, but my desktop with the same size in pixels as my p…

This is an interesting observation. Do you have some examples of this?

Screenshots: https://cloudflare-ipfs.com/ipfs/QmUL69cYwCs2sWV7eHqtt14BEcn...

Re: The ideal viewport doesn't exist

#57

Post by withinboredom »

danielvaughn wrote: post #52
5350-uiop-1130 wrote: post #15

> "The main point we’re trying to get across is that you simply do not know how users are going to visit your website or web app. Instead of making design decisions on strict, limited breakpoints, keep in mind the sheer amount of fragmentation there is in viewports." I don't know how useful this is. setting breakpoints allows some sanity in the build and testing process otherwise you have an infinite scope for issues…

The problem is that at a real company, this is very difficult because you have to argue with your product/design team and explain why you don't want to implement [x] feature because it's "too complex". Inevitably they'll point to some competitor website that has the same feature, which makes you look like you're just lazy. It's possible to succeed in those arguments, but it's hard. It's one thing to convince them not…

If your company cares one iota about accessibility, you can usually get those features off the table instantly just by arguing that point. "Yeah, well it's pretty clear that competitor doesn't care about blind people" is a pretty easy argument.

I invite you to learn to use a screen reader and try using your app (whatever it happens to be). It's seriously pretty terrible for some of these websites with all the fancy crap.

Re: The ideal viewport doesn't exist

#58

Post by withinboredom »

crazygringo wrote: post #48
PMunch wrote: post #5

I wish more pages took the pointer and resolution media queries into account. So many times I open windows side-by-side on my desktop and end up with the menu collapsing into a hamburger menu which fills the entire screen when clicked. Many phones today have very high DPI and very low precision in touch, so it makes sense to have massive visual elements and buttons, but my desktop with the same size in pixels as my p…

I'm actually not entirely sure what you're talking about. I'm very familiar with websites switching to mobile layout with hamburger menu instead of a navigation bar, when you reduce the width of the browser window on your desktop. BUT I don't think I've ever come across a resolution change where the website elements (either hamburger menu or content) get massively larger. Can you provide an example of one or two main…

The resolution doesn't change, but a 64x64px icon button doesn't need to be that big on a desktop.

Re: The ideal viewport doesn't exist

#59

Post by depressedpanda »

5350-uiop-1130 wrote: post #15

> "The main point we’re trying to get across is that you simply do not know how users are going to visit your website or web app. Instead of making design decisions on strict, limited breakpoints, keep in mind the sheer amount of fragmentation there is in viewports." I don't know how useful this is. setting breakpoints allows some sanity in the build and testing process otherwise you have an infinite scope for issues…

> setting breakpoints allows some sanity in the build and testing process otherwise you have an infinite scope for issues which of course would be pretty lucrative for a boutique agency.

Honestly, now that container queries are available, I see very little use for breakpoints. Container queries allow for easy reuse of components, and a truly fluid and responsive design.

Re: The ideal viewport doesn't exist

#60

Post by crazygringo »

withinboredom wrote: post #58
crazygringo wrote: post #48

Earlier quoted context omitted.

I'm actually not entirely sure what you're talking about. I'm very familiar with websites switching to mobile layout with hamburger menu instead of a navigation bar, when you reduce the width of the browser window on your desktop. BUT I don't think I've ever come across a resolution change where the website elements (either hamburger menu or content) get massively larger. Can you provide an example of one or two main…

The resolution doesn't change, but a 64x64px icon button doesn't need to be that big on a desktop.

But this is my point, I haven't been seeing any 64x64 px (logical pixels) hamburger menu icons out in the wild. That would be too big for mobile as well.

The hamburger menu buttons all seem normally sized to me when I make a browser window narrow on my desktop.

Post reply on HN