Live data from Hacker News

Hardest problem in computer science: centering things

tonsky.me

461–470 of 473 posts

Re: Hardest problem in computer science: centering things

#461
post #460

Earlier quoted context omitted.

Many public institutions was mandated to follow the WCAG (Web Content Accessibulity Guidelies) which recommend against tables used purely for layout. So it it not really about vague “guilt-pressure”, it is just that many web developers had to follow WCAG as part of their job.

Oof - I didn't know that. Kind of a weird requirement, were/are screen readers rendered so ineffective by the content being in a table as opposed to in divs?

Not inneffective as such, it just presented a confusing user experience because the screen reader would assume the table represented data structured in two dimensions and e.g present navigation options for going cellwise left/right and up/down.

This would be pretty confusing if the table was just used to create a margin and most cells only contained spacer gifs. Especially with deeply nested tables (as was the fashion at the time) it could be pretty confusing.

Today you can just add an ARIA-hint indicating a html table is used purely for layout and a screen reader can then treat it just as divs. But this did not exist at the time.

Of course the WCAG just assumed it was not a big deal to avoid tables for layout since CSS2 supported tabular layout through pure CSS. But the reality of a web dominated by IE6 made this a much larger problem.

Re: Hardest problem in computer science: centering things

#462

Earlier quoted context omitted.

The reason for the advice against tables was that the "semantic web" was all the rage (probably mostly because Google wanted to make it easier to index stuff). If you have tabular data, using tables was just fine. The issue was with using it solely to control the graphical presentation without any semantic basis for putting it in the table. Same reason you don't use just to make the text bigger.

> The issue was with using it solely to control the graphical presentation without any semantic basis for putting it in the table. There shouldn't be any semantic basis needed. HTML is not a semantic data exchange format, was not designed to be (the pathetic handful of semantic HTML5 tags added to be used ad-hoc included), and it inevitably includes content, style, and behavior (js). The semantics should belong to da…

Semantic markup is what makes both web crawlers and screen readers recognize that is a link to another URL. The web couldnt work without it.

Re: Hardest problem in computer science: centering things

#463

Earlier quoted context omitted.

I mean, semantics are also good! Yes, CSS grids are a lot like tables in some ways, but not having to add 25% more DOM elements to fake a table layout (display: table/table-row/table-cell; that's 3 divs for one row!) is also a thing to be celebrated. Plus, in practice, grid is a lot more powerful than doing a few common layouts. Grid took so long precisely because they were trying to think a little further ahead rath…

> I mean, semantics are also good! Yes, CSS grids are a lot like tables in some ways, but not having to add 25% more DOM elements to fake a table layout (display: table/table-row/table-cell; that's 3 divs for one row!) is also a thing to be celebrated. Semantics in the context of CSS is a stupid idea web designers came up with. They heard the concept of "semantic", and had to fit it in, to appear smart. Should have a…

Semantics is what makes both web crawlers and assistive technoligies know that is a link.

Re: Hardest problem in computer science: centering things

#464

Earlier quoted context omitted.

> Nearly all layouts people actually want are table-like, and I think CSS really was misguided in its text-flow as layout approach. I think this is the core misunderstanding in this discussion. CSS 2 supported both text-flow and tabular layout and both layout models were reverse-ingeneered from how Netscape rendered HTML. There is this weird idea that CSS is somehow opposed to tables or tabular layout, while a signif…

I don’t think there’s much of a misunderstanding here. There are historical reasons why CSS was so weak on layout for so long, but there’s always reasons. To understand what was missing look at what they’ve added (flexbox and grid). I don’t like the implementation of either, but they are in the right space.

[deleted]

Re: Hardest problem in computer science: centering things

#465

Earlier quoted context omitted.

Is accessibility for the visually impaired a cult? How could Google even work if content could not be seperated from its visual presention?

> How could Google even work if content could not be seperated from its visual presention? Approximately. Like it did and does. The simplest way is to just strip the markup (or, for purposes of indexing, just ignore any token that resembles a HTML tag). That'll easily get you 90% there. You'll lose important information that's tied to form, but that's a consequence of operating in plaintext land. If doing this to bui…

How would you crawl the web in the first place if there was no way to recognize a link in the HTML?

Re: Hardest problem in computer science: centering things

#466
post #454
post #128

Earlier quoted context omitted.

“Naming things” can’t be listed first, the joke doesn’t work if you put naming things first.

Enlighten me please, sincerely. I’m apparently too thick to understand.

Ok. The original joke is —

~~~~~~~~~~

There are only two hard things in Computer Science: cache invalidation and naming things.

~~~~~~~~~~

Let’s analyse how the joke words.

A quick warning though -

Explaining a joke is like dissecting a frog. You understand it better but the frog dies in the process. - E.B. White

First the Setup —

“There are only two hard things in Computer Science:“

We’ve established there are two things and they are hard, and they belong to computer science. This immediately begins to establish an expectation of technically difficult topics.

“Cache invalidation” is the first example and this is a pair of words that look technical and difficult, even if you don’t know what they are.

This completely reinforces the expectation that the next thing will be even more bewildering.

Punchline:

“And naming things.”

In the third part of the joke - we subvert expectations. “Naming things” is a very down to earth concept, anyone can immediately understand. And anyone can readily appreciate the truthiness — naming things is hard.

This subverted expectation is what makes it a joke.

If the two things were listed in the opposite order, it would still be true and still be insightful - but it wouldn’t be a joke.

The popular addition:

“And off-by-one errors” works even though it is “putting a hat on a hat” because the very first expectation was

“Two things”

… and now we’ve subverted that expectation. And in a paradoxical manner we’ve retained the truthiness present in the first two examples.

So the short answer is - don’t start with the punchline.

Re: Hardest problem in computer science: centering things

#467
post #72

That's because CSS layout was designed by people who thought "float" and "clear" were a good idea, tables were bad, and, when in doubt, make it Turing-complete and dump the problem on someone else. 2D and 3D tools get this right. CAD programs, game engines, and animation programs are all far better at positioning things. They have far better layout engines and constraint systems. This is really a constraint problem.…

I think (despite the article’s digs) iOS had the right idea with everything having a relative layout to parents and siblings. It makes it much easier to know what “center” actually means when you have a notion of what it’s supposed to be centered to.

Could you elaborate? I've never worked on any iOS apps before but this sounds very similar to what I'd like UI development on the web to be like.

Re: Hardest problem in computer science: centering things

#469
post #297
post #108

Earlier quoted context omitted.

Before CSS people used to use tables, often nested, for all kinds of layout. Eg if your page had a header, a sidebar and a main text area, you would create a table with cells of the right relative widths, with invisible borders, and put each layout element in one possibly merged cell. This was essentially standard practice for a while. CSS allowed layouts like this to be done without tables. It still supported tables…

Funny thing is that it still easier, even today, to use a frameset rather for header, sidebar and main area rather than fiddle with the new grid system.

Use position: absolute; or position: fixed; for both header and sidebar. Main area gets margin as big as header and sidebar. No framesets needed. That's at least what I did in 2001 and it worked like a charm. Even matching background elements of header and sidebar without any gaps.

Re: Hardest problem in computer science: centering things

#470
post #157

That bright yellow background imprinted my eyes for 5 minutes, there's other way to leave an impression than fucking up with my senses, like writing a clear concise article instead of a never ending list of examples interrupted with distracting fake mouse move. An horrible web experience through and through.

I quite like the yellow. You should try and use your brightness slider, because it is not brighter than most real world yellow (i.e. illuminated by the sun which is orders of magnitude brighter than your screen) Unless you are adapted to live in a darkened cave, that is.

If you like a yellow background, I guarantee you are an outlier
Post reply on HN