Earlier quoted context omitted.
It just seems like confusing wording. I think you are right that most people use their programs full-screen on laptops (As an aside, it is funny that thin-and-light-ism has managed to progress to the point where the average person finally gets the 2008 experience). But I think what they meant is: it is safest not to presume that desktop or laptop users are filling their entire screen with a browser. The way they wrot…
I'm kind of surprised here, myself, and am very interested in seeing real numbers because, just from the replies to this comment I'm seeing a lot of difference of opinion. Personally, I always use a browser full screen and most everything else is 'windowed'. My browser usually ends up being the "background" of my monitor, only traded out when I'm writing code, in which case my IDE is the "background" (full screen). E…
The ideal viewport doesn't exist
191–200 of 202 posts
Re: The ideal viewport doesn't exist
#192Earlier quoted context omitted.
I presume you're talking about maximized windows, but that still does not equal "filling the entire screen", because browsers have their own user interface around the viewport. Go maximize your browser and enter this into your dev tools: console.log(`${window.innerWidth}x${window.innerHeight}`) Does that equal your screen resolution?
I did differentiate here ;) and even mentioned that I "sometimes even [see] the entire screen (in fullscreen mode on MacOS) [being used]"
Re: The ideal viewport doesn't exist
#193Earlier quoted context omitted.
> And disabling zooming? I had a weird experience with Google Groups recently - I zoomed in because the text was too small and ... the page resized the viewport to its original pixel size even though the font was scaling. Ended up with about 10 characters in an unscrollable viewport. HILARIOUS.
I had the opposite problem with a web page the other day. When I zoomed in, the text resized itself to still fit the same amount of text in the viewport, but since other elements would zoom correctly, the more I zoomed in, the smaller the text got.
Alternate horror scenarios that are all too common:
Zoom only to have one picture take over the whole page, pushing text off the side (not even down, off screen to the side).
Zoom only to have the text immediately become wider than the screen, forcing you to scroll sideways for every single line.
Re: The ideal viewport doesn't exist
#194Earlier quoted context omitted.
You're mad at the wrong people here. I've never met a frontend dev who doesn't hate moving stuff vertically or scrolljacking. It's the marketing people that want it.
The one that hurt me the most was making a page that started at the bottom and scrolled up. I left a comment somewhere in the JavaScript apologizing for it.
Re: The ideal viewport doesn't exist
#195Things I like about this article: + A focus on viewport size instead of screen size. Few people browse websites in full screen in fact "Full Screen" browsing is used almost entirely for people using a web browser for presentations or physical kiosks. A completely different use-case than regular desktop browseing. I loathe the fact that when I tile my windows to half my screen size the website "helpfully" switches int…
I feel like I must be a minority, My workflow is almost entirely switch desktop+ switch tab.
Re: The ideal viewport doesn't exist
#196> If you’re on a desktop device reading this, how many windows are filling the entire screen? How much screen space does the browser you’re reading from take up? > It’s safest to presume that users on desktop or laptop devices are not filling their entire screen with a browser. Is this true? If you're reading this casually (and you are reading this casually) is your browser not at full size? I almost exclusively use…
Re: The ideal viewport doesn't exist
#197My favorite viewpoint anecdote: Many sites like to assume (like the article mentions) that a good 'mobile view' cut point is 768px. And some of those sites, in particular NodeBB (back when I used it), use the particular media queries `max-width: 767px` and `min-width: 768px`. On the right laptop, on the right version of everything, if you drag the title bar to one side of the screen so it resizes to fit half the scre…
Re: The ideal viewport doesn't exist
#198Earlier quoted context omitted.
I'm trying to learn some JS in my spare time, if only to show in interviews that I can do it, but I understand why one wouldn't want to. I'm just doing bare JS for now, but even with a framework, there is so much to manage in the DOM to make consistent interfaces, and CSS3 is so much more complex (but also convenient, in some ways!), putting together good interfaces is legitimately hard. Responsiveness is the big hur…
Web dev frontend has a thousand quirks but has a billion more hours of human hours development time spent on it. CSS is annoying but way better than trying to jiggle random attributes and subclassing stock components to do something basic like right align a label. You'll notice that a lot of GUI toolkits have already adopted something like CSS (Qt Style Sheets, JavaFX CSS, etc.). Yet they will never become as good, j…
I've been practicing webdev since 1999 or so; I understand how useful CSS is and still remember the dark times of inline style attributes. :)
Making something on the Web is a bit strange due to needing to set up 3 different technologies, and line them up just so, and pray a future browser update doesn't mess up some logical assumption you made along the way.
It appears CSS classes are used somewhat like UI 'states', in a JS app. It's taken some time to adjust to using more logically meaningful class names instead of structurally meaningful that I used with regular non-JS webdev. Toggling a class somewhere sometimes requires doing other things in the UI, too. I've found lots of tiny little UI bugs as I develop and learn more about how things need to work in an event-based system.
As a result, I find I do not like this way of building things. Sure, it's cross-platform, because the browser-makers do all the heavy lifting. But Tcl/Tk is cross-platform. Allegro and wxWidgets and Qt are, too. Tkinter is a single `import` away. Each has its own challenges that get added on as a result of not relying on a multi-gigabyte-per-instance virtual machine, but software is all about trade-offs is it not?
Lesser used things aren't changed as often, for example. You can rely on them to not change so quickly. Compared to Mozilla or Google, who are competing for highest software version number and have a new release every 6 weeks.
Re: The ideal viewport doesn't exist
#199Earlier quoted context omitted.
No offense, I had to try that.. https://upload.wikimedia.org/wikipedia/commons/3/3d/LARGE_el... Look how fast and responsive it is!
That supports touch zoom just fine, it just has a low limit to how far in it goes.
Re: The ideal viewport doesn't exist
#200The visualization, I think, could be improved. Make a graph of points, where X and Y coordinates correspond to width and height of the viewport, this is like imagining all those viewports having the same left top corner and recording bottom right corner. Those points on the graph which correspond to more frequently occurring viewports should be brighter (if not bigger circles). Many points for large number of small v…
https://i.imgur.com/9cJ13ue.png (alternative link: https://imgur.com/a/uBG5KUD)
(The area of each circle is proportional to the count, clamped to a minimum value. Axes a are linear.)
Uses the data from https://viewports.fyi/data.csv.
Code:
import csv
from math import sqrt
import sys
csv_reader = csv.reader(sys.stdin)
headings = next(csv_reader)
data = [tuple(map(int, row[:3])) for row in csv_reader]
max_w = 7100 # max(row[0] for row in data) + fudge
max_h = 7100 # max(row[1] for row in data) + fudge
max_count = max(row[2] for row in data)
margin = 200
svg_width = max_w + 2*margin
svg_height = max_h + 2*margin
max_r = 90
min_r = 4
print('')
print(f'')
print('Visualization of viewport sizes from https://viewports.fyi/')
print(f'')
print(f'')
print(f'')
for i in range(0, max_w, 200):
print(f'{i}')
print(f'')
for i in range(0, max_h, 200):
print(f'{i}')
print(f'')
print('')
for w, h, count in data:
r = max(min_r, sqrt(count) / sqrt(max_count) * max_r)
print(f'')
print('')
print('')