Earlier quoted context omitted.
[flagged]
[flagged]
JS DOM API is still abysmal and jQuery API is still great. No worshipping needed.
Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
211–220 of 359 posts
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#212Earlier quoted context omitted.
No, but basing capabilities solely on what they imagine "well-known websites" might want is .
And how would you do it sans imagination?
I mean the actual point of the article is to ask everyone, not just "well-known" examples.
So it seems there were some reasonably forces in the discussion that align with my stance without the unnecessarily antagonistic (and rhetoric) primer I should've probably left out.
Seems like a good approach to widen the discussion and improve the design.
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#213Earlier quoted context omitted.
For awhile it was just described as "Pinterest style." It has some use cases but for the most part it's literally a wall of unstructed information. Difficult to parse and build any mental hierarchy. It's also ... incredibly easy to do with existing css.
It's been called masonry before Pintrest was even founded.
I don't doubt it, but it certainly wasn't common web design terminology. Waterfall was one I encountered frequently.
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#214"Others are questioning whether or not this kind of layout is needed on the web at all — they aren’t sure that well-known websites will use it." Would it instead be possible to exclude anyone with that attitude from a discussion about an open standard? I know this sounds toxic, but I would argue that approaching public design this way is ultimately more toxic wrt the outcome and those affected by it. Or maybe I misun…
Why? When developing standards it's very good to have good gatekeepers. Not everything should be built inside the browser if you can achieve the same with existing technologies like JS. Otherwise your browser(standards) might become too complex.
That is an orthogonal discussion.
I need masonry layouts a lot and tend to be on the "we don't need another display class" side in this debate. But that's unrelated to my "rant".
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#215Earlier quoted context omitted.
So you're saying the a11y tree and tab ordering is bypassing the actual ordering of content and instead traversing the columns one by one? I'd call that a bug. In a masonry layout the expectation of a sighted user is that there is no continuity from column to column, but instead through the visual line. And the "unexpected" (disagree) ordering you show does that. I think the issue would be that tab ordering is ignori…
Maybe it's just me, but as a sighted user I have no idea how to read this kind of layout. My expectation would be that any sane designer wouldn't use this kind of layout in the first place. What's the "visual line" in the first example? It goes 1, 2, 3, 4; then down to 5; then a sudden break in the line as it jumps over 3 to the left to reach 6? Are we supposed to mentally sort the boxes by the top edge coordinates b…
My experience with it has mostly been on Flickr, and I hated it for this exact reason, even though that was mostly pictures not text. Sure, it's very pretty if you just want to look at the site and not engage with it in any detailed way, like professional designers seem to intend for us, but I always wanted to look at a page of pictures and scan my attention over them systemically, finding those that interested me, being distracted by them briefly, then returning to the scan and knowing where I'd left off.
Trying to do this with the "masonry" was horrible. What direction do you go in? Horizontally? Then how do you track which elements belong in which row, where you've already been? They're all interleaved. Vertically? Have fun scrolling down and down and down forever as the page loads more and more content dynamically. No, neither of those is how you're meant to engage, you're supposed to simply sit quietly and look at the big wall of pretty pictures.
Giving designers a non-javascripty way to do it is nice, I guess, but I really hope the effect is that the bad layouts we already have are at least better executed technologically, rather than that the better technology encourages designers to use bad layouts more often.
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#216Earlier quoted context omitted.
I can totally understand the quoted comment. I mean, we are talking about CSS as a language here. Anything that is formalized is expected to be implemented and supported by browser engines and vendors. Browser engines are already extremely complex, so it's fair to think closely about formalizing new things when it's not apparent that there is a big enough need. I'm not claiming this is the case with the Mansory layou…
I totally get that. But for me there is a fundamental difference between "big enough need" and "well known websites need this". How are potentially thousands of niche websites less of an argument than "instagram and co don't need it"?
Well-known == highly visited == native implementation will have large accumulated impact on end users (their performance, energy consumption, improved usability ...).
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#217Earlier quoted context omitted.
Yes, that's fair. Sure, today we have grid and vanilla CSS is sane and useable by anyone who takes the time to learn the modern way of doing things. But let's not forget what a long and tortured road CSS has taken to become what it is today. CSS was a total dumpster fire up until around when flexbox came out. It was SO HARD to make it do what you want for SO LONG. The MOST BASIC NOTION of layout, putting things in a…
> I can't explain why it took CSS such a long time It is weird to look back on but the web platform essentially went through a dark ages for a while. You could say the same about why it took us so long to get to ES6 JS, too. The standards bodies were frozen in ice (and I don’t quite know why either), everyone was debating HTML5 vs XHTML and somehow the rest of the platform floundered for years.
[deleted]
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#218So, the background story is that CSSWG DevRels from browser vendors are debating how to formally include the Masonry layout into CSS, at least since 2020, when Firefox first proposed it. The news here is that people at WebKit decided to push the debate to the public, inviting designers and developers to take some action (“post to social media, write blog posts”), in order to get past this. While it may look just like…
Is there a JavaScript polyfill today that can read the CSS properties in any of the proposed / implemented specifications that Just Works in Chrome?
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#219I built a masonry layout with only CSS and HTML 10 years ago. The site is actually still live. A scripting language is used to generate the HTML and CSS based on the dimensions of the images. But the masonry runs left to right not top to bottom.
That's not going to be responsive which is today a must have.
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#220I absolutely want this. I have wanted this for years. This is a form of grid so it should be in CSS grid. Especially since it has tracks.
Browser makers, please just ship this.