Hacker News new | past | comments | ask | show | jobs | submit login
No CSS Club (nocss.club)
235 points by Fred34 on July 16, 2023 | hide | past | favorite | 271 comments



Due to the long line length, I had to shrink my browser window in order to read this submission comfortably.

I dunno guys, I kind of like CSS.


On the other hand, if all sites were like this, we would just keep our browser windows at a smaller size and it would work fine.


We could also all go back to 800x600 monitors. That way, no one would have to be subjected to writing the 10 lines of css to make text heavy sites more readable ;)


No, because then you'd have a short line of text that takes up a huge amount of space.

Your lines of text on the screen should never be much wider than your hand at arm's length, ever, for any reason. Not even if it's an example of a one-liner in bash - wrap that line to make it easier to read.

Don't believe me? Angrily click <reply> on this post to tell me what an idiot I am, start to type your reply, and then hold your hand up palm out at arm's length to the screen so it covers up the text box you're typing in.

How big is it?

Told you so, didn't I? And it looks *perfect*.


> Your lines of text on the screen should never be much wider than your hand at arm's length, ever, for any reason.

No thanks. Ridiculously short lines are harder to read.

Edit: I also resize the reply text box because it's almost too small to be usable.


Decades of research show that long line lengths cause people to read more slowly, although it is of course possible that you process text differently than most.

"Ridiculously" short is another matter, but by my count, "significantly wider than your hand at arm's length" means well above 20 words per line.


Research also shows that light color theme works better.


> Not even if it's an example of a one-liner in bash - wrap that line to make it easier to read.

This is the one case (that I can think of right now) where I don't agree.

As part of a larger script, sure, wrap the line so it's not way longer than all the other lines.

But a single shell command in isolation is always easier to read as a single line, if sufficient horizontal space is available.


When writing outside of a terminal, I wrap single-line shell commands with backslashes and space indentation. The breaks are at logical clauses, as if writing a conventional programming language. I find this much more readable than the alternatives. Often my terminal will also get it this way, from a copy-paste.

This also usually helps in documentation.


If I have to do it twice I stick it in a proper script, with some comments, so I remember what it all does next time I go to do it. I do this particularly for stuff like complex ffmpeg filter chains where I need to do a lot of stuff to a video file. By simply running the bash script, at some later date I can get it to remind me what it does, and suitably mangle the video file.

Then, later on, often weeks later, I use command history to scroll back through everything I've typed until I find something that looks vaguely like what I originally typed, or I don't find it and figure it all out from scratch again, having totally forgotten about the bash script I wrote.

I suspect this workflow is surprisingly common.


Yeah, but how many times do you see a one-liner that's in a nice little boxout, but there's a scrollbar and you need to slide it backwards and forwards to read the whole thing?


ever, for any reason

I have a stylebot rule for stackoverflow that makes the default container 150% wider so I can read teh codes without h-scroll.

Also, I don’t always use HN on desktop.

But when I do, that textbox is too narrow for almost every code-related post. And too short in general.

Thankfully there is a sizer handle.


> we would just keep our browser windows at a smaller size

I wouldn't keep a browser at all, I would just read them in Emacs all the time or from the command line. I would also be able to use my preferred visual theme with the entire web, and not have to look at some really nasty web designs from time to time, albeit I do agree that as a game dev (long time ago) I do like when I see pretty graphic design.

However, I am not sure how my bank will do and all the other web services in just plain text. Perhaps it is possible, perhaps not?


I think the trick is to avoid the hr tag and to center the pages. I run a no css website https://www.pilledtexts.com/ and just have the readable content in .txt files where I can add a max width.


Which is pretty bad on mobile, because the lines wrap before the hard line endings, making a long-line/short-line repeating cadence which I find really difficult to read.


Honestly it's not great on desktop either.


Added a viewport tag for the html page, I may try to display the text in a page and then just link to the .txt file.


What's with the encoding on that website? It's virtually unreadable in my browser.

e.g. From https://www.pilledtexts.com/files/nick-land/february.txt

> “This can’t go on,” he said. “It’s too blatantly wrong. It’s insolence.”


It's UTF-8, but the server doesn't specify that so the browser treats it as windows-1252.


Edited my nginx file to display UTF-8, should look better now


Cool, the guy who ran the no CSS club added my site.


No one will ever need more than 800x600 pixels resolution


Unironically, somewhere between 1080 and 2K scaling is probably all anyone will ever need since humans can't focus on more real estate than that. The higher-res monitors all scale the UI to that.


What do you mean? It perfectly adapts to any browser width; if you want to resize it, just resize the browser window. It's perfectly readable on both a 4k screen and a small phone.

What more do you want? :D


To not have to resize my window for each website I visit?


The alternative is the "accessible" mush which is common nowadays - no matter how big your screen is, the content is compressed together into a small strip in the middle of the screen, almost like a phone.

No thanks, I'll take fullwidth content anytime over that....


There's an ok in-between where wide windows get margins and narrow ones use the full width. But yes a lot of sites have the stupidly huge margins.


The best alternative is a site that is responsive that takes advantage of wider screens but not lazy fullwidth.


Why is full width lazy? It uses all your screenspace;)


Making text wider is lazy. At some point, you'll need to break it into columns so that the text is readable. Perhaps on super wide screens, three or four columns (akin to a two column book that's wide open or a newspaper) may even be more preferable.

Otherwise, the other option is to scale up thr text size, but that takes up precious vertical space on wide screens, and doesn't increase information density.

Obviously, text columns may only make sense it certain scenarios - a minimum amount of text might be required to justify a second column as opposed to just limiting the width of the first column.


Because it forces your users to make your site readable which is lazily passing off the responsibility.


And what if users want light or dark theme too. How do you guess it?


You don't have to guess. You can just use https://developer.mozilla.org/en-US/docs/Web/CSS/@media/pref...


How it plays with the idea of not passing responsibility to the user? User can request window width too.


No its not, there are lots of more alternatives.


Why do you have to resize it?


So that it's shaped more like a page of text than a telegram.


But why does that matter for reading it? It's just reading left to right either way. The submission was fine for me to read, and so is HN which has pretty thin margins by modern standards.


I browse all sites in a window of my preferred width, works fine.


Similarly, I can no longer browse HN on a Firefox browser on Android. I am not really sure what exact settings changed. This started a few weeks ago.


What browser are you using? Mine (Firefox on Android)wrapped the long lines nicely.


Ah, never mind. I understood it the wrong way around. So you have a big resolution and want shorter lines. Maybe use reader mode which applies some css. I still like this for content centric websites. My favorite blog also works like this for years


Desktop browser. Big monitor with high resolution and big window = long lines


Presumably they're on desktop: long lines don't tend to be an issue on portrait screens.


:) I think it's sarcasm.


reader mode ftw


"No HTML Club" stands as the only logical step forward in this evolution. Browsers are perfectly capable of rendering plaintext, what could we ever need those pesky "tags" for?


I agree. That's why I made http://no-ht.ml/

I submitted it to the site a few minutes ago.


If you serve this with:

    Content-Type: text/plain; charset=utf-8
You can actually have no HTML at all


I did try that, but a few mobile browsers seemed to choke without at least something vaguely HTMLish.


I prefer “application/json”. The user can write their own interface.


What happens when server responds with text/plain and css?

https://blog.openreplay.com/incorporating-css-to-a-page-via-... (no time to check, only works in Firefox, but that's one idea on how to trick the system)

Upd: checked and it works (e. g. add `Link: <https://unpkg.com/chota@latest>;rel=stylesheet;media=all`)


Discussed on HN last year: https://news.ycombinator.com/item?id=33645398 (32 comments)


Ah, cool, someone already had the same thought:

> I'll eagerly await the ASCII-only "You Don't Need Unicode"


the foreign language speakers here would like to have a word...


Good old codepage to the rescue!

(Yes, I know technically codepage isn't ASCII. I guess you could use box drawing extension to draw foreign language character if you wanted. Or maybe just SVG of the text)


please not codepages. finally being able to write multiple languages in a single document, which is something i need to do frequently, really makes a difference. codepages were a nightmare compared to the simplicity that unicode is in this aspect.


Yes, that's the joke.


They should have thought of that before they put non-ASCII characters in their language.


... but they couldn't...


The table didn't render that well for me: https://i.imgur.com/afFkYe1.png


I suggest you upgrade to a newer version of Internet Explorer.


I like the work you share Edent. Big fan of SuperTinyIcons!


Honestly your site is unnecessarily bloated with Unicode.

For an English language site, ASCII is enough.


I see you too read the flow chart.


Unless you go to a café.


These make me feel weird. On one hand, I love the way justified way it takes me back to old READMEs, GameFAQs, etc. but on the other all accessibility is thrown out the window.


Looks even better with view source on a dark background


This is art. Perfection, even.


Honestly, it looks really good. Cool work!


Nice ASCII art


Perfection


Great, finally back to the golden age of OS specific native applications with networking protocols.


The "No HTTP Club". Take a look at this beauty...

ftp://192.168.3.79/bestmo~4.txt

Of course, none of you have accounts, so please go ahead and postal-mail me for one, I'll get back to you in 6-8 weeks.

NO HTTP CLUB

PO Box 1147

Chungus AL 35035


Also no DNS club and quite likely no Unicode club as well (haven't checked)


> what could we ever need those pesky "tags" for?

Links.


Clicking on links is a bad idea, links are a bad idea. Besides from the horrendous potential for wasting your time you expose your reader to all kinds of dangers. Links could be changed in ways you don't control. They could point at offensive content, thinks you are not suppose to know, illegal things, phishing websites, hackers and much more you are better of not knowing about.

https://securityforeveryone.com/blog/unknown-danger-clicking...

Just like writing a program put all relevant information inline in the txt.


Not really if you know how to copy and paste :) (Keeping with the sarcastic tone of the ftl64 comment)


Hyper ones.


Made a CSS-only website just a few days ago https://www.kidsil.net/2023/07/css-only/


Look at Mr. hoity-toity here with his use of ASCII, as though ones and zeros alone can’t do the job.


No HTML and no HTTP would be even better, unironically.


right, because FTP was working just fine.


Telnet was clearly better.


well, obviously!

just the other day i logged into a MUD which presented me with an interactive world with a graphical map in color. the same MUD has a built-in http server so it can display the same information with the interactive and feature rich, yet compact telnet interface, as well as the round-trip heavy and verbose http/html interface.


Can we at least add this meta tag in the head of the document ? I don’t know if it is considered styling but it is not css. My eyes will thank you:

  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
Source: https://stackoverflow.com/a/39239194


It is considered CSS [1], which makes sense to me as this relates to styling. What has never made sense in my mind is to have completely unstyled pages rendered with microscopic fonts on smartphones. Doing so for old sites that, at the beginning of the mobile revolution, assumed on their CSS sheets 1024px wide screens is reasonable (though still debatable). Not so for CSS-free pages, whether they were authored in 1991 or in 2023.

I'm sorry if I got carried away, I wasn't replying to you in this last part :) For the record, I would also make this exception, though it would be neat to be able to select those without even the meta viewport tag.

[1] https://drafts.csswg.org/css-viewport/


No problem, really. Thanks for the correction. This is indeed css. I must have automatically associated meta tags to non css data only. And I totally agree with you concerning the microscopic font and the meta tag.


I don't understand why it has to be added to every single page. Is there a reason this is not implemented as a default browser behaviour for devices where it matters (i.e. mobile phones)?


That'd force a pretty substantial breaking change to a lot of sites that don't currently use the tag.


If the webpage has no CSS at all then nothing will be broken, either adding it internally or pretending that it's included.


Webdevs can always say those aren't their target audience.


All you need is initial-scale=1.0, and width is redundant.

I discuss this in more detail here: https://news.ycombinator.com/item?id=36112889


That applies only to Safari. How about other browsers?


Counterargument: sane users expect consistent presentation across all browsers and viewport dimensions.

A CSS reset overrides the user-agent stylesheet and the rest of the CSS determines the final style. This is the best practice. If you don't like web pages, then don't use them.

The final form of this club would be to settle on their favorite serialization format bit banged into their nervous system so they can be one with the matrix. /s


This is still subjective. Some users would prefer to see consistency across all sites they visit rather that consistency on the same site across all browsers.

When every site uses it's own reset there's no consistency while in the same browser, which is way more common for most users that don't have a separate browser for every site they visit.


This is one of the main use cases for reader mode for me—I already have an ad blocker to remove noise, reader mode means I don't have to deal with whatever each random site's designer thought would be the most readable thing, I can standardize all my reading in a format that works for me.


There's Lynx Browser for that https://lynx.browser.org/


I'd rather look at this club as some sort of 'code golf' than take it seriously as a manifesto. Actually, even as a manifesto their point is valid, as a form of minimalist art. I consider the web as to be a canvas for many artists too. You don't need to agree to admire their work (e.g. dadaism is not frowned upon today)


Ok if this is the serious intent (minimalism) then they probably want SGML, not HTML. They would also not want this delivered using the seven layer burrito that is the OSI model.


Salesmen expect consistent branding, not users. Users expect consistent presentation across sites.


I guess those who prefer reader mode and user-agent styling are insane, then? /s


To all No-CSS webmasters : you can still respect your readers light/dark mode preference with this simple line :

<meta name="color-scheme" content="light dark">


I consider that the browser's obligation. If I'm not specifying any font or background color, I cannot be responsible to add special media queries because someone chose a dark theme.


Thank you for bringing this up. I had been looking for an “easy” way to enable a Dark Mode on my website without overriding user-configured default colors and this seems to do it pretty well.

My page uses a minimalistic CSS and only changes the colors for syntax highlighting -- which is now slightly broken in the dark mode but probably still an improvement over the white background for those people who want the dark mode :)


> only changes the colors for syntax highlighting -- which is now slightly broken in the dark mode

might be of use:

  @supports (color-scheme: dark light) {
      @media screen and (prefers-color-scheme: dark) {
          code { ... }
      }
  }


My current solution is to switch the syntax highlighting to monochrome which should work fine for both modes. I love the colorful syntax highlighting, though. So maybe I will revisit this later to find out if I can do something along the lines of what you suggest.


One problem though is that the default link colors can be unreadable in dark mode. That's why I use @media (prefers-color-scheme: dark) to set a:link, a:visited, a:active colors.


i like the default (unstyled) link colors chrome uses, they seemingly do accessibility the best. on the other hand, safari's default link colors for dark mode are quite poor, e.g., a:link is dark blue, a:visited is purple

worth noting, browsers also treat the default dark mode background colors differently: chrome uses black, safari uses dark gray, and firefox uses dark navy


Maybe it's time to add some decent looking CSS defaults to browser, but only for websites without CSS includes. Page width, better fonts, maybe even mobile specific improvements could be added. Of course, I understand that would introduce incompatibility with old websites.


> Of course, I understand that would introduce incompatibility with old websites.

Why, though? If the website has no styling (we can exclude sites that use <font> and friends), the whole premise of HTML from very early on was that it only specifies content and the user agent controls formatting.


The browser is the user agent, so I don’t see why changing the default styles would contradict that.


That's what I'm saying—websites that don't specify styling cannot have compatibility problems with changed default styles.


That sounds good, but it'd most likely end up as YACL (Yet Another CSS Library).


If the browsers implemented it officially it wouldn't be a library, it would just be a sane default style.


A "sane" default style would require "default" content coupled with a "default" viewing device. None of which exist. There can't be a one-size-fits-all solution.

In addition, content is more than just text - style, design, and layout are information, too.


I don't think anyone is suggesting that the new defaults be standardized. Each browser should pick defaults that make sense in the context they're used.


Doesn't the reader view already do this?


For completely unstyled sites, reader view should be the only view. What guidelines or rules should the other/s view/s be following? I say definitely not "nostalgic" view!


Dennis Ritchie's site is given as an example, but it's filled with ancient bgcolor and width HTML attributes, which are, how to put it, not better than CSS.


They’re literally mapped to styles internally in modern browsers.


I wonder if what we're really lacking is just a decent set of default web fonts. The main modification I do when I kick out a basic HTML presentation of some data is throw in bootstrap so I can get a more comfortable font experience.

Shouldn't this be the default though? Why is the default bad?


I'm a big fan of minimizing JavaScript as much as possible, and will actively try to use CSS in place of it wherever I can.

No CSS as well? No thanks, I want my sites to look somewhat modern and aesthetically pleasing by modern standards.


The defaults take between 5-50 years to catch up. But they'll still ship plenty of crap you don't care about in the meanwhile.

I have now webgpu running in my browser out of the box but the same shitty fonts.

By the time web components started being used, React went out of fashion.

Don't let me ramble about how much time I spent on rounded corners back in the days.


> I'm a big fan of minimizing JavaScript as much as possible

Me too! I like to minimise it to 0 bytes.


These websites have no individual identity, they all look the same.


This probably says more about yourself than these websites. Identity should go beyond visuals...


Unfortunately the web is a visual medium and humans evolved to identify things with their eyes.

Unless your audience is entirely the blind and partially sighted, visual identity is pretty important


True hackers only read the web directly as source files fetched by CUrl and opened in Nano anyway. Only normies need anything more than their minds to "parse" or "compile" source.


Most books get by with a cover and hundreds of pages of only text.


I have a bookshelf of books next to me and the only ones with even slightly similar spines are books in the same series, not to speak of the covers.

I opened a couple of text heavy ones and they all had different font choices and minor variations on page layout. Most of them had elaborate and unique chapter headings.

Book typesetting is a fascinating subject, I would recommend anyone who works with websites to look into the way typography influences the reader's subconscious. (Maybe we'd have less Helvetica spaffed all over the internet!)


> I would recommend anyone who works with websites to look into the way typography influences the reader's subconscious.

To me, paradoxically, it reached a point where my subconscious associates light or poor typography with serious material, and pretty web pages with empty ad-ridden content:

Serious vibe: http://fmwww.bc.edu/repec/bocode/t/transint.html

Intermediate vibe: https://drewdevault.com/2023/06/30/Social-and-parasocial-med...

Empty content vibe: https://www.theverge.com/2023/7/12/23792382/google-notebookl...


Ebooks used to be plain text files, it worked well.


You can use table, bgcolor, <font> etc. Or worse, images in tables. Just like the old day.


Needn't be in a table, you can still get supercool effects https://meyerweb.com/eric/css/edge/raggedfloat/demo.html


Then you can't join the no CSS club.


Yes, but then just use CSS.


Content provides identity too.


Yes, but only half


You think the content of a newspaper or a blog is only half the identity? I'd say it's probably more like 99%.


58 bytes is all you need.

  main {
    max-width: 38rem;
    padding: 2rem;
    margin: auto;
  }


CSS will improve your readers / users quality of life if you use it properly. To me that's enough to keep using it.


In the mid 2000s there was (and still is) CSS Naked Day, at 9. April, when you disable the CSS on your website to show of your semantic HTML markup:

https://css-naked-day.github.io



After the No HTML club trumps the rest, we’ll need to have No Web Server to finish the job. I see only upsides to this.


There's gemini already....


and gopher still exists


I used to be no CSS, but a little CSS can improve readability. There's nothing magical about the browser default fonts, margins, etc. And no max-width can be problematic.

You might want this to prevent the text size from changing when you rotate to landscape on mobile:

  html {
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
    -moz-text-size-adjust: none;
  }



That's an implementation detail of the user agent, not anything to do with the website.

The point is "your user agent should make this readable by default, somehow". If it chooses to do so by way of a CSS style sheet, that's the user agent's prerogative, but the standard doesn't care how it goes about rendering a style-free page.


You can say "should make this readable" and talk about "the standard", but in real life you've chosen this specific stylesheet (or its 2 or 3 variations), which effectively hasn't changed since the beginning of the Web, for 99.9% of the times someone looks at your webpage as your stylesheet because it's already preloaded as opposed to choosing a different stylesheet because it looks better or some other criteria.


Is this like "No Nut November" but for Web Developers?


Fewer neo-Nazis, though.


There’s definitely something to be said for “hardly any CSS” websites that are brutally functional.

For example was looking at http://www.steephill.tv/ yesterday for cycling news (recently shut down sadly)


> There’s definitely something to be said for “hardly any CSS” websites that are brutally functional

Yes, but only if we exclude those like the one you linked that require horizontal scrolling because of their <table>-based layout.


Another one is https://www.friesian.com/history One of my favorite references for philosophy.


Wow. How drastically edgy. What an independent thinker. Really sticking it to The Man. Epic.


The browser's default CSS can be removed with:

   document.head.insertAdjacentHTML(
     'beforeend', 
     '<style>* { all: unset }</style>')
Or compile a browser without them.


this is the real no-CSS.


I mean, all the best websites are no-CSS.

I felt guilty at adding "<meta name="viewport" content="width=device-width, initial-scale=1.0">" so my no-CSS site wouldn't look on mobile like a website for ants.


https://motherfuckingwebsite.com/ is the same as this except more entertaining to read.


And, ironically, with Google Analytics.


The List is a fantastic CSS-less site I've been using for years to discover Bay Area live music shows: http://www.foopee.com/punk/the-list/.

I don't know the full history and I discovered it in the early 2010s, but it's been around since at least 1996 if the page content is to be trusted. I use a script to scrape the site and filter by artists I care about.


Update/disclosure: The List sadly uses Google Analytics, disqualifying it from the club (except in spirit).


If everyone had a non-css version and browsers had configurable style/themes, the web would be a beautiful thing.

Maybe there should be an optional MIME Content-Type: text/plainhtml header target.


Maybe I’m in the minority, but I enjoy the modern web for the most part. I’d be pretty upset if HTML was the only formatting we were allowed.


Is the lack of <body> prevents readability mode from enabling?


The HTML in the page is LITERALLY SATAN. It doesn't have a body tag and it is not prettified.


He didn't say that you can't use an SVG element..


Richard Stallman[1] should be appointed honorary president

[1] https://stallman.org/


He'd be disqualified because there's loads of CSS on his site.

Just because it's ugly doesn't mean he didn't use CSS!


But he do have CSS on the site:

https://stallman.org/common/stallman.css


His site is on my blogroll. I still check it for his political takes -- not that I tend to agree with him on a lot.


I’m surprised by how often he posts, and that his posts aren’t usually related to free software.


https://watercss.kognise.dev/ I would argue classless css is the way to go, you just include a single css file, then write your html without touching any css anymore, all related tags in html are inherently css-ed for you. a nice trade off for me sometimes.


Chicmath (https://www.ocf.berkeley.edu/~abhishek/chicmath.htm) is a classic showcase.


That's horrible to read.


Why in the holy hell can we not just PICK THIS FOR OURSELVES?

This is the thing, right? Perhaps we could shoe-horn this in behind the ADA or something. Require every website to provide a "pocket" or whatever mode.


You didn't remove all the default styling added by all browsers? This site is styled differently depending on browser.

I suppose that means "you're trying to cover up your lack of interesting information"?


Worth noting that this doesn't have to restrict you to Times New Roman: just put this opening tag at the start of your HTML, like it's the 90s:

    <font face="helvetica">


Let the user change their own default font.

For me it shows up as sans serif by default.


Is that even a feature of mobile browsers these days?



Reminds me of https://motherfuckingwebsite.com/, except they seem to be serious about it


> If you need "style" that just means you're trying to cover up your lack of interesting information.

They must really hate books, comics, magazines, ...


Books have mostly plain text style. No javascript, no cookie consent, no hover bars, no broken scrolling, no light gray text on white background, no crooked google fonts.


> No javascript, no cookie consent, no hover bars, no broken scrolling, no light gray text on white background, no crooked google fonts

Sure but what I quoted just said "style" - nothing about "bad style", "user-hostile style", etc. (Javascript would be out of scope since it's not CSS)

And that's before we consider that "style" can include "the style of writing" - should everything be written in the plainest, driest prose?


The whole reason for nocss is absence of good styles in the wild.


I’m sure Mozilla used to allow you to apply your own style sheets. I’m a huge fan of producing semantic markup and adding in a style sheet to do all the… styling.


The purpose of clothes is to cover up your body and keep warm.

If your clothes have any extra color on it that means you are frivolous and should be ashamed.


all these minimal “layout rejection” website trends look horrible and offer nothing to the collective conscious

they are readable and … load. so, congratulations?


You actually don't even need the dang internet.


As ever, the staggering difference in readability between https://motherfuckingwebsite.com/ and http://bettermotherfuckingwebsite.com/ (on desktop at least) demonstrates that rawdogging the internet is generally a bad idea.



> Bump that body copy to render close to 16px or more

also known as the default font size in browsers, don't you dare override the user's preferred font size for body copy, scale everything else in units of rem instead.


> don't you dare override the user's preferred font size for body copy

I’d bet you that 98+% of users don’t even know you can change the browser font size. For that overwhelming majority of users the size reported by their preferences and their actual preferences do not necessarily align. This is not a defence of setting smaller-than-16px font sizes, but it is a defence of setting larger sizes if testing shows it improves user experience.


> I’d bet you that 98+% of users don’t even know you can change the browser font size.

The users that need that to be able to read (e.g. vision problems) definitely do know that. It's about accessibility


I disagree, I field a lot of reasonable adjustment requests and a staggering number of people don't know about basic functionality. They are also not interested in them.


I’m not going to re-solve problems for users that already have a solution but refuse to use it.


> This is not a defence of setting smaller-than-16px font sizes

See: HN, that sets a "10pt" font size, otherwise known as 13px.

At least they have a reason and it fits for me. :)


On the contrary, I've always found HN's font size to be one of the worst parts about the UI. I actually have a userstyle set to override it

  body {
      font-size: larger;
  }
  
  .comment, .default, .comhead {
      font-size: 14px;
  }
  
  .subtext, .pagetop {
      font-size: 13px;
  }
  
  .title {
      font-size: 16px;
  }
It's not the prettiest CSS or the most well done, but it works and it's better than the defaults imo.


I do use HackerNews at 150% because otherwise it's unreadable


They do on mobile.


Don't scale everything in units of rem; we want "zoom text only" to continue to do what it says on the tin. Only scale the things that need to be text-sized.


Things like border-radius are especially fun to watch then they're sized in rem.

What was a regular border, eventually becomes a half-circle.


Also spacing/padding increases to much that then at some point you only have like 1 word per line, and the screen is half blank space


Is there a reason for certain CSS frameworks like Tailwind to scale absolutely everything in units of rem and ignore px like the plague? Or is that just too far?

I did mean font sizes though. :)


Incompetence, and thus obedience to a mistakenly-generalised caricature of "good practice", is my guess. I used to use em everywhere for exactly this reason. (The only reason I didn't shift to "rem everywhere", "flexbox everywhere", "web fonts everywhere", etc. was obedience to some different caricature of "good practice".)

I've never seen a CSS framework that's good. (Unless you count https://simplecss.org/, but that's of very narrow usefulness.) They're all made by the kinds of people who don't understand web technologies, and seek to hide them behind a layer of abstraction so they don't have to think about them any more. Unfortunately for them, there's a reason the web's how it is. Some of it's backwards-compatibility, but most of it is that a large group of very clever people failed to find a way to make it any simpler without breaking something important; and so, the framework people tend to break important things.

If you find yourself reaching for something like Tailwind or Bootstrap, just use inline style attributes. It's easier for everyone involved.


Good luck using pseudoclasses, pseudoelements or media queries in inline styles.

Wrt Tailwind I still have not used it enough to decide whether it is good™ but it is not that different from writing inline styles.

Apart from optional plugins it is more like a CSS preprocessor than a framework (every class expands to one or few CSS declaration)

The most frameworky features it has is that it predefines CSS variables to allow further customization


If you need any of those things, you should be using a proper stylesheet. Use <style scoped='scoped'> in the <body>, if you really must.

A crude "not that different from writing inline styles" classy framework just makes it harder to refactor your CSS in future, because it's all tucked away under incomprehensibly-named CSS classes, and there are otherwise-useless <div>s all through the HTML.


I should clarify that I primarily touch html via React, so the unit of reusability is not CSS but rather components.

For handwritten html I believe that tailwind has significant downsides (unless you abuse @apply), but that the case I focus on.

I should have mentioned that I believe tailwind to be applicable only if you have some strong templating support

> Use <style scoped='scoped'> in the <body>

This seems to have been removed from everywhere since at least 2017


Joke's on you: I avoid inline CSS like the plague whenever I can. Which is to say, I use it as intended.


This does not suprise me, inline CSS is very unwieldy


Everyone jumped on the only-use-rem train when mobile started dominating because it provides relative units that scale better rather than absolute pixels.

In practice it doesn't really mean much outside of blog-like text so when doing layouts it's more of just a standard everyone agrees on using everywhere because it's easier to stick to one for consistencies sake and it does the job. I don't think many frontend devs ever test zooming text using a browser anyway, their main concern is variations in screen sizes, basically device variation not manually zooming text. But I get the arguments to limit it to text.


Modern browsers zoom by increasing the CSS pixel size, so now all units are relative


Zoom can use different algorithms, it's a setting.


text-align: justify ruins the readability of the text. Won't ever work until browsers become much better at hyphenation.


Uh, hyphenation ruins readability much worse than justified text.


If you’re interested in sites loading quickly in more… practical scenarios, read this:

https://community.qbix.com/t/qbix-websites-loading-quickly/2...


I have mixed feelings about the second one. Yes, line width highly improves readability. But I think the grey font makes it more difficult to read. And I'm no fan of the increased font height, though that might be more personal.


I agree about the reduced contrast. Not cool.


There's a design tenet to never use pure black or white, that's probably what is going on here


Yeah my #1 peeve is a striking pure white background especially when I'm browsing at night. Maybe they should offer day/night contrast options?


I have never understood this. Black text on white backgrounds is fine at night, maybe you should stare at screens more or something? Or use something that adjusts brightness to ambient light, like most phones do now. I personally do not like all this low-contrast nonsense, clear and legible is the way to go.


I think the comfortability of contrast is subjective. I have several coworkers who use higher contrasts themes and swear by them, but my eyes start to hurt if I look at content that’s too high contrast. White text on black is by far the worst for me, but I know people who find that very readable.


Computers have been high-contrast since the first GUIs dating all the way back to Xerox PARC (https://crm.org/articles/xerox-parc-and-the-origins-of-gui)

Yet I have only ever heard of people complaining about it recently, when GUI designed started debasing itself by making everything web-based, and zoomers started demanding dark mode everywhere. Before that, and in my lifetime of computer nerditry dating back to the mid-90s (on self-luminescent CRTs!), I have never heard of people intentionally turning down the brightness or complaining about contrast of anything, whether its a tube TV or computer screen.

Which makes this whole preference for low-contrast incredibly suspicious. Like it was another one of those learned 'ailments' that spread around society like a shitty meme.


Ok, well. Sorry my preferences disturb you so.


Decrease your brightness.


Experiment with monitor brightness.

My phone is always on low brightness at night, but for some reason my monitor is always at 100% without question, which means light theme during the day (to match paper/pencil in front of me) and dark theme at night because it is otherwise too much light. Then one day, I tried a light theme at night at 50% monitor brightness and my eyes relaxed immediately. I realized that I have been squinting constantly to brace against the maximum brightness.

The usual advice is to instead increase ambient/room light but I have the room light set perfectly for writing and reading on paper.


Decreasing the brightness reduces the contrast which also decreases the readability of it. A dark background with light text has both higher effective contrast and less light hitting your face.


There appears to be a different design tenet to use tiny fonts. Also not cool.


Sadly, no one ever stops at bettermotherfucking and that turns out to be the problem.

I'd be happy with a No Ads And No 3rd Party Trackers, Analytics or Other Shit Club.


And still, none of them really works on mobile.

If I zoom in to increase the font size and make it more readable, the text doesn't reflow so it forces me to drag left and right to read the whole line.

There used to be a time where you could have actual adaptive reflowing zoomable text content, but web designers and browser developers conspired to break it and make it worse.


On iOS Safari, there’s a little “ᴀA” button left of the location bar which lets you zoom to make the text larger, reflowing the way you expect.

This makes sense to me. Pinch to zoom is a specific affordance which means “make the line segment between my fingers be this long”. It wouldn’t make sense with reflow.


Interesting.....

But if you change the font size setting on your browser you will get exactly what you want. Odd how zoom and font size are not linked the same as on desktop - at least for me on Firefox mobile.


Yes, but compare changing the size of small text on a per-site basis by changing the browser settings vs simply doing a pinch gesture...

There used to be a Firefox extension to force text reflow on any website, but recent versions with the new extension API don't allow installing it.


It's just browser developers. And I think it's largely caused by the brain worm of "you don't need that on mobile".


Ironically, both sites attempt to load Google analytics.


How the 'motherfuckingwebsite.com' looks is entirely up to your user agent. If it looks terrible that's not the fault of the website.


You can customize the user agent. Firefox I can set the colors & fonts …and this includes different settings for dark themes as well. I prefer this experience­­; namely on my OLED displays I like being able to have #000 black backgrounds & on my e-reader, I much, MUCH prefer #000 text on #fff for maximum readability. There so many contexts where the designer doesn’t need to get overly involved versus letting users decide.


The first one respects my wishes. If I want to adjust the line width I will just adjust the size of my browser window. I have a 38" monitor, the second page is an ocean of grey pixels. I view white space as a direct insult to my intelligence.


I definitely do not want to live in your world where I need to manually adjust my window size on each website I visit.


Why would you adjust it on every site? You just do it once and you're done. It's less effort than all the scrolling required by modern CSS.

I don't know about you but I typically have more than one window open. Information density is valuable to me, even on a large screen.


The first is more readable to me, mainly due to the lack of contrast in the second one.


Some sites take the 'reduce line width' way too far though, and on a widescreen desktop display you're looking at a narrow column in an ocean of whitespace.

(It's one of the more glaring flaws of the Reddit redesign...)


Personally, the childish "saying motherfucker is shocking/bold" style is a bit of a cop out to make a proper argument.

I don't even say it with the typical puritan TV USA mindset but just the, give me the facts, not the show. Yelling won't make you right, just 14. Specially when it's clearly not a visceral reaction but a thought out post.

It's like comedy that thinks saying fuck or shit is funny when that's basically the lowest bar of humor. Say it, but style matters, the word in itself is not funny (unless you're a kid and afraid of someone telling you off, again: boldness).


While I appreciate the sentiment, I feel you're missing the point. This is akin to maddox's writing. It aims to strike a nice balance between satire and self-immolation, but might stumble in its attempts.

You're supposed to feel conflicted between the obnoxious tone and the rational message. The writing makes fun of know-it-alls while also making a well reasoned argument.


I don't think you can just say "Maddox" in 2023 and assume people will know what you're talking about.

maddox.xmission.com


Just read a Maddox (didn't know who they were) post and, boy, is it full of edginess and self confidence to mask that they don't have a good point.

Of course it's easy to rant and monologue. Dozens of TV presenters do it but sometimes it's very easy to find fault in their subjectively humorous generalizations.

http://maddox.xmission.com/c.cgi?u=bob_dylan_is_a_podcaster

https://youtu.be/MMFj8uDubsE

Blowing in the wind, the first song that comes to mind, doesn't fit this at all.

A quick Spotify search through the most popular songs and I can't find any in 10-15 that fits that example soundbite he used, to extrapolate this "emperor's got no clothes" argument on bob Dylan.

I'm not particularly a fan of Dylan except a song here and there I like (looking at the list), but it just shows the style over substance and strength of argument.

To this, someone will call "don't be such a buzzkill, it's just a joke" and that's fine but then you've left the land of making valid points and into the self congratulatory "ironic" content.

I didn't miss the point, it seems, but you did miss mine.


I find it fairly cringe, personally.


It reminds me of the extreme advertising meme.


> I don't even say it with the typical puritan TV USA mindset but just the, give me the facts, not the show. Yelling won't make you right, just 14. Specially when it's clearly not a visceral reaction but a thought out post.

Yeah, but if they had done it your way neither you nor anyone else would know about it.

Looks to me like they put a lot of thought into the marketing of that thought out post


Yelling or cussing doesn't make you 14. I like cussing and think that there should be more of it in technical literature.


Agreed. The idea that words can bring curses or displease some fictional deity is a dated trope with no place in modern society. Which means the only reason left is that it displeases certain people to hear them... but fuck those folks for trying to impinge on freedom of speech


This is not about freedom of speech. I explicitly stated it was not a puritan thing. Fuck your strawman, if you want. See? That did very little in terms of argumentation.

Now it was about using insults instead of proper arguments and pretending the mere use was funny. Which isn't.

Also, it's funny how you "insult" in generic third person because if you insult me directly you might get banned. Hey, feel free to insult me directly. I won't care. You just won't necessarily have a good argument because of it and you might also get your comment deleted, but let's see if you're as "brave" to argue with the would be censors then.


You may also like writing in 1337speak. That's not an actual argument for it being an effective mechanism to convey an argument, which the website presumably tries to.

Finding an insult funny just because it's an insult is definitely childish, as I've said before and you haven't tried to address, it relates to rebelry against some authority, which just isn't there in this case.

I won't be offended by the insult, but using in the way the website in question does is just superfluous content and can effectively serve as an mechanism to hide less than solid points.


Your response is definitely childish. Not in the immature sense but an underdeveloped sense of historical social transformation.


You've said nothing and basically held a mirror that says "no u".

How about you actually try?


It is now apparent that you are an actual child. Have a good one


An actual child that signed up to HN in 2013 when they were 1 or something and has worked on the industry for a while, huh?

Running away with a false accusation and a dishonest "good wish" is just sad.



I agree, I like a well-placed swearword, but when used as a crutch for humor, it falls a bit flat.


If you read it in Samuel L Jackson’s voice it makes it a lot better.


Well, given the former of the two is much better…


And all it takes is a few typographic rules in a style tag.


I like CSS a lot, but this is almost like a web ring, and web rings are even more awesome than CSS


Why does the No CSS club add in no javascript?

Is there a club for people who eschew CSS but are comfy with JS?


technically there is CSS, that is the useragent CSS. so you mean no custom CSS.


I'm already in the no CSS club (I just use React styles).


If you got content, you only need markdown.


The bold headings made my eyes hurt.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: