I am curious what a regular website looks like on ultra wide screens.<p>Do they just stretch all the way or at which max width do websites stop? Are most websites centred or left aligned when cropped?<p>Most important question I have, if you are an ultra wide screen owner, what website behaviour do you prefer most?<p>If owners of ultra wide screens could post some screenshots of some websites that would be awesome. I'm interested to see what Twitter looks like, StackOverflow, the BBC website, Reddit and even HackerNews.
If you're curious, it's feasible to test various sites using headless Chrome.<p>See here for general details:
<a href="https://developers.google.com/web/updates/2017/04/headless-chrome" rel="nofollow">https://developers.google.com/web/updates/2017/04/headless-c...</a><p>I'm away from my computer, so cannot readily test it, but I believe you should be able to do this with commands of this form:<p>chrome --headless --disable-gpu --screenshot --window-size=3440,1440 <a href="https://www.bbc.co.uk/news" rel="nofollow">https://www.bbc.co.uk/news</a>
This will be website style sheet dependent.<p>If the website's style sheets impose a maximum width, the width will be constrained. If not, they will likely flow to the edges.<p>But, do note that it is possible to run your browser with a window width less than the width of the monitor (i.e. not maximized) if "flow to the edges" is also too wide.<p>My browser windows are all about 55% of the width of my 16:10 monitor, and I seldom ever maximize the browser window. And when I do maximize it, most often for map websites, when I'm done I return the window to its normal about 55% width.
Even on typical 16:9 screens it's rare that I would maximize a browser window. And on my ultrawide, usually I'll have browser windows at 30%-50% of the screen width. So websites look normal - I'm not looking for any special "ultrawide" behavior from the site. For me the ultrawide replaced a multi-monitor setup so I am generally looking to use the extra space for multitasking, not simply for making everything huge.
Use this in Chrome to easily preview:
<a href="https://developer.chrome.com/docs/devtools/device-mode/" rel="nofollow">https://developer.chrome.com/docs/devtools/device-mode/</a><p>It's what web developers generally use. I'd guess most sites stop their main content expanding beyond a standard desktop width and center the content. I've never worked with a web designer or client who has specified what should happen on very large screen widths, it's just not on their radar.
I am ultrawide monitor owner but use it in vertical mode almost always.<p>>Do they just stretch all the way or at which max width do websites stop? Are most websites centred or left aligned when cropped?
They have tiny amount of content centered and huge spaces of nothing on right and left. Some Russian websites has a fashion called "rubber layout" so sometimes text might be streched across the width which makes the content very unreadable. BTW using browser on horisontal ultrawide fullscreen is kind of wrong, IMO better to place several different windows across the width. So, if using several different windows, rubber is better, but if using browser in fullscreen - tiny amount of centered content might be better.<p>> If owners of ultra wide screens could post some screenshots of some websites that would be awesome. I'm interested to see what Twitter looks like, StackOverflow, the BBC website, Reddit and even HackerNews.
Ping me after several days if nobody will answer. I can switch to horisontal, but it takes a little of time to do that screenshots and to reswitch.
Most sites set a max width and generally center the content. Some sites also have certain “full bleed” elements which stretch outside the main container but typically similarly have a max width for the contents of those elements.<p>My site does all of this, except it leans slightly off-center to the left on viewports larger than ~a phone. Tested on my 4k@1x display, though I very rarely extend a browser window beyond the width of my laptop screen. Edit to add: less common but my site also scales the text size up on larger viewports to target a ~60 character column width. I know the readability benefits are debatable but I personally prefer shorter line widths and know a lot of other people do too.<p>Some very creative sites make use of greater horizontal space by eg switching to a more horizontally flowing layout (and I’ve considered this for my site), but I think it’s rare because it’s such an unusual setup that it’s only worth the effort for very specific things.
I have a 49" ultrawide. Most websites simply center themselves in the window. Occasionally they will position on the left. And very occasionally, but most annoying of all, they will try to take the entire width of the monitor, or adjust their font and image sizing to fit the width, but not consider the height. Some websites will put UI controls on left and right, and content center, which sucks when you need to move the mouse four feet to click on something.<p>For the most part I specifically size the browser window to how I want it to be. On Windows there are programs that let me hotkey size and position of windows, which makes it easy to tile three browser windows across the desktop. Unfortunately nothing quite like that exists for macOS or Linux at this time that both understands the hotkey, how to apply it to a window, and will consistently apply the change on the 49" monitor but not on the laptop screen.
Zoom out a bunch of times and then size your window to the ratio you want. If you open the developer console in chrome it will show the resolution of your window.