Hm, designed a bunch of websites and never tested for vertical desktop screens.
Seems there is failproof solution missing there for recognizing tablet, desktop and mobile.
Btw. many websites break also on quadratic screens ;)
Just because I have a vertical screen doesn’t mean I’m on a phone
121–130 of 399 posts
Re: Just because I have a vertical screen doesn’t mean I’m on a phone
#122I wish for once that requesting “Desktop version” on my phone would actually give me a desktop view, not the same exact mobile view. Sizing based on viewport (a “responsive design” principle that I hate) gives me hamburgerized unusable mess.
I want to be able to zoom out to see the same page features as I would see on desktop. A lot of websites USED to work this way on ios Safari before “responsive design” became a thing. Now, there’s no way to get a typical website to give you a desktop-like layout when you “zoom out” because it automatically detects your viewport and forces you to hamburger no matter that you selected “Desktop version.”
I understand why mobile view exists. It’s more comfortable to read for probably most people. But by ignoring “request desktop site” because of the hubris of “responsive design,” it means that there’s no way for you to get desktop-like functionality & experience on your phone browser. That is a reduction in functionality from the smartphone experience of 5-10 years ago on many site that’d give you a desktop-like layout if you zoomed out.
An example of this frustration is that on a forum I frequent, if the viewport is below a certain size, user avatar thumbnails are hidden and text tables of values are all reflowed to an unusable mess where before I could zoom out and get a desktop-like view where the tables (which are just fixed-width straight text, entered by forum users) could be seen clearly.
The refusal to allow some way to get a real desktop-like view in “responsive design” is user-hostile.
Re: Just because I have a vertical screen doesn’t mean I’m on a phone
#123The “solution” he gives for website devs is to “stop naively using screen resolution”. But the thing is, an iPhone 12’s resolution is 2532‑by‑1170-pixel at 460 ppi - bigger than his 1080×1920.
The iPhone doesn't report it's "real" resolution, though.
Re: Just because I have a vertical screen doesn’t mean I’m on a phone
#124Earlier quoted context omitted.
HN is a pretty minimal site though - it is just a message board.
Almost all websites are pretty minimal in terms of their features, but they're built as if they were an in-browser image editor. Reddit is barely more than HN with pictures and a LOT of bloat inbetween. It could be as minimal as 4chan-style imageboards if you add voting and a slightly different comment view. Youtube is just a tiled list of thumbnails or an embedded video player followed by a list of thumbnails. It co…
100% agree. The kneejerk reaction of "well HN is so simple, of course it has a simple design" has the causation backwards. You only realize how simple HN is because they stick to a simple design!
99% of websites are (could be) just static text and images. Facebook, Reddit, CNN etc could look like HN. Amazon could look like craigs list. The amount of sites that actually need and are enhanced by JS bloat is very low.
Re: Just because I have a vertical screen doesn’t mean I’m on a phone
#125How do they know it's your screen which is vertical, not just a window?
Re: Just because I have a vertical screen doesn’t mean I’m on a phone
#126Earlier quoted context omitted.
This doesn't address the author's central argument, which is that websites need an effortless way of letting fonts become bigger without affecting the entire layout. I've wanted it too. I don't really care if some text gets cut off on headers and looks weird, I just want to read stuff from the comfort of my bed with my laptop a few feet away.
This was tried in the mid-late oughts was it not? It is nearly impossible to logically derive what should increase in sized and what should not. Should the space given to sidebars increase? Should those sidebars disappear? What about headers and footers? How will the overfloat be treated? A single line, double lines? What about captions underneath images? How do you handle text that happens to be embedded within imag…
God forbid we use the scroll bar.
Re: Just because I have a vertical screen doesn’t mean I’m on a phone
#127I 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…
Yeah, I was trying to find a way to create a toolbar with buttons and make sure the buttons are not too small or not too big. DPI info is not present and different tricks to work around this will fail on different phone models. I wish I could ask the browser "what are the dimensions you the browser use for your buttons" so I can use same dimensions too and the user could configure this in his browsers and everything…
In theory this is what css { font: caption } should do. There are other font shorthand’s for menu text, icon labels, dialog box text, etc. that should clue you in to how a particular system UI is scaled, if browsers are doing it right. (Of course they also might not because of fingerprinting risk)
Note that this is different from { font-family : system-ui } which doesn’t include size information.
Caniuse sadly doesn’t have much info on font: caption support.
Re: Just because I have a vertical screen doesn’t mean I’m on a phone
#128Earlier quoted context omitted.
This doesn't address the author's central argument, which is that websites need an effortless way of letting fonts become bigger without affecting the entire layout. I've wanted it too. I don't really care if some text gets cut off on headers and looks weird, I just want to read stuff from the comfort of my bed with my laptop a few feet away.
That's how zooming (ctrl+scroll) in the browser used to work: It increased font sizes. It has been abandoned because it just wreaks havoc on the layout and is impossible to handle properly.
It was so standard, it wasn't even called "zooming", because it wasn't. It was called "increase text size". It worked well for most reasonable sites, certainly a lot better than an actual zoom typically does.
Re: Just because I have a vertical screen doesn’t mean I’m on a phone
#129Earlier quoted context omitted.
Sure. Now let's say you're shopping for a brand new rug for your living room. Are you going to buy it from a site the looks like HackerNews? If so, I'd venture to say you're in the minority. A used rug from Craigslist, perhaps, but a brand new rug costing hundreds, you're going to want a site that looks VERY professional.
So you’re saying “professional == follows modern design fads” as a proxy for how legitimate a site is. And maybe you’re right that is a somewhat useful (if unreliable) proxy for legitimateness, but it’s not an argument that it’s good design.
For a site that sells rugs, good design is design that accommodates all users and sells as many rugs as possible.
So an accessible site that follows modern design fads is probably the best thing to have (if that sells rugs).
Re: Just because I have a vertical screen doesn’t mean I’m on a phone
#130I don’t think this has much to do with your vertical screen as much as it’s the narrow viewport.
Exactly. CSS does not check that your screen is taller than it is wide. What it sees is a narrow viewport.
The CSS could very well be checking that
// The viewport is in a landscape orientation, i.e., the width is greater than the height.
@media (orientation: landscape)
// The viewport is in a portrait orientation, i.e., the height is greater than or equal to the width.
@media (orientation: portrait)