> Why doesn’t this website fill 100% of your 1080p or 4K monitor’s screen with text? There’s a very specific reason, and that is text measure.
>> A block of text or paragraph has a maximum line length that fits a determined design. If the lines are too short then the text becomes disjointed; if they are too long the content loses rhythm as the reader searches for the start of each line.
>> Wikipedia entry on “Measure (typography)”, 2019
> The optimal width of a paragraph of text is anywhere from 50–80 characters per line, depending on which of the many studies you cite. If a paragraph is too wide, your eye loses its place when tracking back to the beginning of the next line. This decreases reading comprehension—and increases my irritation when I realize I’m re-reading the same line.
OK, so have the text flow into multiple columns on wide displays.
I've been thinking that through today, actually. Newspapers don't choose multi-column layouts because it's the easiest to read--it's to make the most of an expensive resource available in a fixed size. Besides that, imagine the UX difficulty in unrolling a pre-Gutenberg scroll to catch up on the day's news!
For a computer, even if you could fit 4-8 text columns on a 5K monitor... What do you do if the content demands a 5th-9th column? You'll have to scroll.
As someone else pointed out in the first iteration of my design here, using non-standard behavior for the margin notes in the mobile view meant it took experimenting to figure out that tapping on a cross-in-a-circle icon would expand additional flavor text. A distinctly un-cool surprise.
When presented with a multi-column text layout, would a user know how to intuitively use the site? They're trained to look for a scrollbar on the right side of the screen to indicate "Hey, friend! More content below." Would you keep adding columns and scroll horizontally indefinitely? There are a lot of challenges to overcome in that design.
The appeal of the Tufte-styled site, for me, is the side notes/margin notes. The whole site is ~1200px wide in three columns. 200px nav, 600px text body, and 315px side notes--the rest is padding between columns. The design takes advantage of the "wasted" space to add in delicious flavor text that I'd otherwise cram in with loads of em dashes and lengthy parenthetical asides.
I designed the page on a/for a 1080p screen, assuming most 4K+ users are used to seeing websites hang out in the middle of their massive TV-sized displays.
Someday, though, it'd be interesting to see if there's a way to combine more information density on a high resolution display without sacrificing readability/usability.
My display is only 1900 wide, and it annoys me to scroll 80-character columns. Especially when they blow up to 30+ points, and I need to resize the browser window.
If WP for DOS could format multi-column pages, I can't imagine that it's that hard. Scrolling sideways is pretty intuitive. And it's become common for image slideshows. Or one could replace continuous scrolling with jumping to the next page.
Side scrolling is also common for online epub readers, and with a visual 'assist' of looking like a book, or large left-right arrows it's rather intuitive.
I think my next blog redesign might incorporate a 'book-ish' horizontal scroll, rather than the infinite vertical scroll...
> If WP for DOS could format multi-column pages, I can't imagine that it's that hard
Funnily enough browsers have this support already (using column-width, or a prefix version of it), so for the web it's basically free, and trivial to add to a site:
Columns don't really work well with scrolling, unfortunately. You can do multiple pages of multiple columns or one scrollable column for longer content - personally, I prefer the latter (and it's simpler technically), but either works.
Multiple columns don't work well for vertical scrolling. They should work fine if you horizontally scroll to see more columns (for example to the right for writing in English).
This would allow more content to be displayed for users with larger screens without overly penalizing users who could only view one column at a time.
The challenge would be to convert the normal vertical scroll to a horizontal scroll in an intuitive way (ie not too jarring for the user).
But you can get display size, and paginate with ~80 character columns. So there's no need to scroll. As you say, scrolling really only works with one column. When I need to read lots of stuff that's hard-coded with two columns, I rotate my monitor to portrait.
Current Microsoft's UI guidelines seems to prefer viewport height columns and horizontal scrolling, which makes much sense, but the UI which presents sane UX with that idea simply is not there yet.
This line length stuff probably only applies to books/mobile/tablet, but not desktop where it's easy to keep track of where you are w/ scrolling & the mouse cursor.
>> A block of text or paragraph has a maximum line length that fits a determined design. If the lines are too short then the text becomes disjointed; if they are too long the content loses rhythm as the reader searches for the start of each line.
>> Wikipedia entry on “Measure (typography)”, 2019
> The optimal width of a paragraph of text is anywhere from 50–80 characters per line, depending on which of the many studies you cite. If a paragraph is too wide, your eye loses its place when tracking back to the beginning of the next line. This decreases reading comprehension—and increases my irritation when I realize I’m re-reading the same line.
OK, so have the text flow into multiple columns on wide displays.