5 ms·

Create solid markup, uncluttered by additional elements that the past tells you that you need. Design your site using what Grid and other new methods have to of

Create solid markup, uncluttered by additional elements that the past tells you that you need. Design your site using what Grid and other new methods have to offer. Then look at how you deal with the browsers without support, by serving them something slightly simpler. Perhaps a fallback like, oh I dunno, <TABLES>?!

robin_reala 9y ago
You lost that battle 15 years ago, and rightly so.
- ourmandave 9y ago
  Jeez, I'm like a 150 in internet years (or 1,500 in JS framework years). crumbles into neatly stacked dust
  - dabber 9y ago
    That's a very modern approach for someone 1,500 years old ;D crumbles[1] into[2] neatly[3] stacked dust[4] [1] https://www.npmjs.com/package/crumbles https://www.npmjs.com/package/crumbles [2] https://github.com/sindresorhus/into-stream https://github.com/sindresorhus/into-stream [3] https://www.npmjs.com/package/neatly https://www.npmjs.com/package/neatly [4] https://github.com/linkedin/dustjs https://github.com/linkedin/dustjs
stephenr 9y ago
Tables don't work in a world that requires responsive layout. I don't want to be pinching and zooming all over the place to read content on a handheld device.
- Animats 9y ago
  At least with tables you can view all the content and you can zoom in. There are many botched sites now where on some devices you can't scroll, or can't scroll far enough to even see all the content, or can't zoom in far enough to read it.
  - stephenr 9y ago
    That's an argument against botched sites (or, for good css), NOT an argument for tables.
- slavik81 9y ago
  HN is one of the most mobile-friendly sites I visit and it's still table-based.
  - stephenr 9y ago
    Then you visit some very unfriendly sites. The only part of HN that is remotely easy to read on mobile are the homepage/etc list pages, which recently became slightly better to read sometimes (I don't know why but the new mobile-friendly scaling doesn't always kick in). Those pages have zero need for a table based layout - they're vertical lists of stuff. The comments threads are honestly terrible to read on mobile.
  - npunt 9y ago
    just wait until someone quotes someone and you have to scroll all the way over here ---->
    - garaetjjte 9y ago
      Because this is not quote, but code block.
      - pbhjpbhj 9y ago
        Or when the nesting gets deep and you have about 3 words per line ... or you're trying to visually identify the comment hierarchy.
    - deleted 9y ago
      [deleted]
  - detaro 9y ago
    It also doesn't really have much along the lines of a "responsive layout" in the sense of one that changes (outside of scaling) with different browser sizes/shapes. (But the typical clean forum also doesn't really need one, so using "outdated" tech is fine. CSS Grid is nice because it allows to do things that weren't (easily) done before, but not everybody wants or needs them)
  - 9y ago
- tootie 9y ago
  Pinching and zooming is very underrated. I like it better than scrolling and digging through hidden menus.
  - stephenr 9y ago
    Responsive design isn't about hidden menus. At its most basic, it's just reflowing content to fit the given viewport width.
paulie_a 9y ago
It really is 1999 again. I shudder at the days of design patterns that utilized nested tables.
rachelandrew 9y ago
That wouldn't work because it would rely on markup although display: table is pretty handy as a fallback for small UI elements in particular. The grid (and flexbox) specifications define how fallbacks should work, making it pretty straightforward to create good - not identical (because what would be the point?) experiences for the browsers you need to support. So, for example with display: table which generates anonymous boxes, the spec defines that box generation won't happen. I detailed a bunch of this stuff here: https://rachelandrew.co.uk/css/cheatsheets/grid-fallbacks https://rachelandrew.co.uk/css/cheatsheets/grid-fallbacks
rado 9y ago
Tables seem better than Grid, because of vertical alignment, too bad they don't have wrapping.
- rachelandrew 9y ago
  Grid has alignment: https://rachelandrew.co.uk/css/cheatsheets/box-alignment https://rachelandrew.co.uk/css/cheatsheets/box-alignment

robin_reala 9y ago

You lost that battle 15 years ago, and rightly so.

ourmandave 9y ago
Jeez, I'm like a 150 in internet years (or 1,500 in JS framework years). crumbles into neatly stacked dust
- dabber 9y ago
  That's a very modern approach for someone 1,500 years old ;D crumbles[1] into[2] neatly[3] stacked dust[4] [1] https://www.npmjs.com/package/crumbles https://www.npmjs.com/package/crumbles [2] https://github.com/sindresorhus/into-stream https://github.com/sindresorhus/into-stream [3] https://www.npmjs.com/package/neatly https://www.npmjs.com/package/neatly [4] https://github.com/linkedin/dustjs https://github.com/linkedin/dustjs

stephenr 9y ago

Tables don't work in a world that requires responsive layout. I don't want to be pinching and zooming all over the place to read content on a handheld device.

Animats 9y ago
At least with tables you can view all the content and you can zoom in. There are many botched sites now where on some devices you can't scroll, or can't scroll far enough to even see all the content, or can't zoom in far enough to read it.
- stephenr 9y ago
  That's an argument against botched sites (or, for good css), NOT an argument for tables.
slavik81 9y ago
HN is one of the most mobile-friendly sites I visit and it's still table-based.
- stephenr 9y ago
  Then you visit some very unfriendly sites. The only part of HN that is remotely easy to read on mobile are the homepage/etc list pages, which recently became slightly better to read sometimes (I don't know why but the new mobile-friendly scaling doesn't always kick in). Those pages have zero need for a table based layout - they're vertical lists of stuff. The comments threads are honestly terrible to read on mobile.
- npunt 9y ago
  just wait until someone quotes someone and you have to scroll all the way over here ---->
  - garaetjjte 9y ago
    Because this is not quote, but code block.
    - pbhjpbhj 9y ago
      Or when the nesting gets deep and you have about 3 words per line ... or you're trying to visually identify the comment hierarchy.
  - deleted 9y ago
    [deleted]
- detaro 9y ago
  It also doesn't really have much along the lines of a "responsive layout" in the sense of one that changes (outside of scaling) with different browser sizes/shapes. (But the typical clean forum also doesn't really need one, so using "outdated" tech is fine. CSS Grid is nice because it allows to do things that weren't (easily) done before, but not everybody wants or needs them)
- 9y ago
tootie 9y ago
Pinching and zooming is very underrated. I like it better than scrolling and digging through hidden menus.
- stephenr 9y ago
  Responsive design isn't about hidden menus. At its most basic, it's just reflowing content to fit the given viewport width.

paulie_a 9y ago

It really is 1999 again. I shudder at the days of design patterns that utilized nested tables.

rachelandrew 9y ago

That wouldn't work because it would rely on markup although display: table is pretty handy as a fallback for small UI elements in particular. The grid (and flexbox) specifications define how fallbacks should work, making it pretty straightforward to create good - not identical (because what would be the point?) experiences for the browsers you need to support. So, for example with display: table which generates anonymous boxes, the spec defines that box generation won't happen. I detailed a bunch of this stuff here: https://rachelandrew.co.uk/css/cheatsheets/grid-fallbacks https://rachelandrew.co.uk/css/cheatsheets/grid-fallbacks

rado 9y ago

Tables seem better than Grid, because of vertical alignment, too bad they don't have wrapping.

rachelandrew 9y ago
Grid has alignment: https://rachelandrew.co.uk/css/cheatsheets/box-alignment https://rachelandrew.co.uk/css/cheatsheets/box-alignment