Live data from Hacker News

58 bytes of CSS to look great nearly everywhere

gist.github.com

81–90 of 254 posts

Re: 58 bytes of CSS to look great nearly everywhere

#81
post #31

Earlier quoted context omitted.

> Humans are good at reading columns at around roughly 80 characters What makes you say that? Anecdotally, I prefer using the full width of my screen.

Here's a literature review on the topic: https://www.researchgate.net/publication/234578707_Optimal_L... . The article content is inaccessible, but from the abstract: > Research has led to recommendations that line length should not exceed about 70 characters per line. The reason behind this finding is that both very short and very long lines slow down reading by interrupting the normal pattern of eye movements and m…

> (up to 10 inches)

here on HN in my 16" MBP, 10 inches is ~230 characters

Re: 58 bytes of CSS to look great nearly everywhere

#82

Earlier quoted context omitted.

Historical reasons. Default browser styling still carry a lot of heritage from back when screens were 640x480 and you had to squeeze as many lines as possible onto the 14" screen. Of course, if you change the default CSS now that 30 years of HTML have been written to rely on these defaults, almost every website will break.

That's true, but there could theoretically be more then one default. I'm not arguing in favour of it, just pointing out the possibility. it would be pretty simple to create a so that it's opt-in. I personally just don't see the point. There are a lot of bare bone frameworks around and if you're doing a static website (which would likely be the only type to benefit from that)... The <10 kilobytes gzipped css won't mat…

It will (maybe) matter in five years when standards have changed and that bare bones framework you grabbed isn't maintained.

IMHO it's a fairly big miss that default styling is bad, we're missing basic controls like drag & drop, and there's no native layouts like heros or hamburger menus and so on. A lot of cumulative effort has gone into reimplementing these things thousands of times.

Re: 58 bytes of CSS to look great nearly everywhere

#83

Not explicitly mentioned here, but worth bringing up: Text width should always be constrained to a maximum width to optimize for human reading. Every book ever printed has text with set within the same range for a reason. Full width text guarantees most users will have a poor reading experience.

I almost agree, but there’s a difference between number of characters and width, and also graphics and tables are a different beast.

Personally, I think websites should fill up the available space, increasing font size if it makes sense, perhaps using resizing images. So, no - text should not be constrained to a maximum width. If width were a problem, billboards wouldn’t be a thing.

Re: 58 bytes of CSS to look great nearly everywhere

#84
post #80
post #70

Earlier quoted context omitted.

Content on the web used to flow pretty well irrespective of those factors. The 'liquid' layout in Adobe's pdf reader works as it should, as does the simplified view in Chrome (which is suspiciously only offered on sites without ads). So, I'm optimistic that simplified layouts are worth pursuing.

If Google would stop the absurd block on text reflow and resize, on Chrome Android, we'd really be good. Seeing how slick and smooth and beautiful and handy it is on Opera, puts any ridiculous dev team rejections to waste. Text reflow missing from Chrome -- valid proof end user convenience is not a primary concern. I bet text reflow moves ads into the wrong position, thus the decade long block.

Designers want the latitude to place ads where they're likely to be effective. How does an ads company which incidentally also provides a browser balance that interest?

Re: 58 bytes of CSS to look great nearly everywhere

#85

Not explicitly mentioned here, but worth bringing up: Text width should always be constrained to a maximum width to optimize for human reading. Every book ever printed has text with set within the same range for a reason. Full width text guarantees most users will have a poor reading experience.

I don't like that. I can adjust the full text width by adjusting my window but if have a big wide screen and you limit it, then I'm wasting a lot of what I can see.

Give me customization, not "alleged optimization" that turns out not to be so

Re: 58 bytes of CSS to look great nearly everywhere

#86
post #84
post #80

Earlier quoted context omitted.

If Google would stop the absurd block on text reflow and resize, on Chrome Android, we'd really be good. Seeing how slick and smooth and beautiful and handy it is on Opera, puts any ridiculous dev team rejections to waste. Text reflow missing from Chrome -- valid proof end user convenience is not a primary concern. I bet text reflow moves ads into the wrong position, thus the decade long block.

Designers want the latitude to place ads where they're likely to be effective. How does an ads company which incidentally also provides a browser balance that interest?

How does an ads company which incidentally also provides a browser balance that interest?

Another argument for forced Alphabet breakup. Browser in one corp, on its lonesome.

Amusingly, Alphabet has given us the number of new companies. 26. Maybe Chrome can be called C, Google search G of course, M for gmail, etc.

Re: 58 bytes of CSS to look great nearly everywhere

#87

Earlier quoted context omitted.

I bet if they did an experiment where they changed the default styles a bit very very few would complain. Most people visiting tiktok or whatever wouldn't even notice.

Most people visiting tiktok don't do it in their browser

And the people visiting it in a browser wouldn't notice.

Re: 58 bytes of CSS to look great nearly everywhere

#88
Love things like this. This is why I can't stop reading HN.

I disagree about the font-size. I say go very small (pack more info on a screen). Very easy for people to make it bigger. People have known this for hundreds of years (old newspapers pack in the text, older readers can wear spectacles or use magnifying glass).

Re: 58 bytes of CSS to look great nearly everywhere

#90

Earlier quoted context omitted.

hopefully not too dumb a question, but why put this on html instead of body?

Au contraire. That is good question. Everything in the snippet except the font-size should also work with the body selector. The font-size is an exception here as it defines the root font size that the `rem` unit is based on. And that has to be defined on html. https://css-tricks.com/html-vs-body-in-css/

in my personal css framework, i only do fluid type on headers, not body text, as i found the effect to be too subtle to matter. but header text can be overwhelming on small devices without it.

then you can let the user (agent) set the default font size on root/html.

Post reply on HN