5 ms·

I found the linked article "Axiomatic CSS and Lobotomized Owls" to be a decent read. I'm surprised that it hasn't been highly upvoted in the past despite having

by dvaun 5y ago

I found the linked article "Axiomatic CSS and Lobotomized Owls" to be a decent read. I'm surprised that it hasn't been highly upvoted in the past despite having many submissions to HN. Article: https://alistapart.com/article/axiomatic-css-and-lobotomized-owls/ https://alistapart.com/article/axiomatic-css-and-lobotomized... Prev. submissions: https://hn.algolia.com/?dateRange=all&page=0&prefix=true&query=https%3A%2F%2Falistapart.com%2Farticle%2Faxiomatic-css-and-lobotomized-owls%2F&sort=byPopularity&type=story https://hn.algolia.com/?dateRange=all&page=0&prefix=true&que...

noman-land 5y ago
It's an excellent article. I share it with people constantly.
chrisweekly 5y ago
While "Axiomatic CSS" per se has (unfortunately) not quite (yet?) gone mainstream, its origins -- see https://every-layout.dev https://every-layout.dev -- are a profoundly excellent resource, and have been highly influential.
- leephillips 5y ago
  That site is black on white¹, and has no other colors, images, fancy borders, nor any other obvious “design”—and yet it is remarkably pleasant to look at, even beautiful. The site sells the authors’ ideas; they obviously know something. (Plus no doorslams, cookie warnings, or other annoyances. And an RSS feed.) [1] Really very dark grey on very light grey.
  - juped 5y ago
    "and yet"? It's "and therefore". † The only problem is that the atrocious #fafafa on #050505 is made a whole lot worse because there aren't a bunch of even worse things distracting you from it.
    - chipotle_coyote 5y ago
      Okay, I'll bite. Why is #050505 on #FAFAFA (not the reverse, as you stated) "atrocious"? Are we playing the "anything less than #000000 on #FFFFFF is grey text on a grey background and entirely unreadable" card?
      - extra88 5y ago
        I don't understand their complaint either. Some people have a hard time with absolute black on absolute white (and/or vice versa) so easing up a little can be helpful. It's a small difference, 19:52:1 vs. 21:1 contrast ratio. I've seen advice to avoid exceeding 18:1 in large areas, maybe #111 on #f9f9f9.
        dotancohen 5y ago
        How do you calculate the contrast ratio?
        chipotle_coyote 5y ago
        I use the WebAIM contrast checker: https://webaim.org/resources/contrastchecker/ https://webaim.org/resources/contrastchecker/ It's basically a measure of perceived brightness. The actual formula involves calculating the relative luminance of the background and foreground colors, where luminance is a value from 0 (darkest) to 1 (lightest), and using the formula (lighter_luminance + 0.05) / (darker_luminance + 0.05) So the highest possible contrast ratio in this system is 21:1.
        dotancohen 5y ago
        I see, thank you.
        extra88 5y ago
        The WebAIM contrast checker web page is one of many. It's nice because the colors have lightness sliders so one can quickly try alternatives then copy the hex values into your CSS. I like checking with Lea Verou's https://contrast-ratio.com https://contrast-ratio.com because it can check colors written in many different formats, not just hex. Also, it can do +/- contrast ranges when colors include the alpha channel. In the Chrome and Firefox DevTools, you often can simply click the color swatch for the `color` property. The pop-up includes the contrast number vs. the background-color for that text and whether or not it meets a Web Content Accessibility Guidelines (WCAG) contrast criteria (Level AA if it's 4.5 or above for regular-sized text, Level AAA if its 7 or above for regular-sized text).
- dvaun 5y ago
  What a neat resource. Thanks for sharing!
- deleted 5y ago
  [deleted]
- mninm 5y ago
  I was trying to figure out what font they are using and when I was inspecting the page I found the comment below. I have nothing in particular to say about it. I just thought it was interesting. 
  - rocqua 5y ago
    Pretty sure that is from the church of satan. Which is not about worshiping satan but more humanist / atheist / there is no god but you should still be a force for good. It's just that their imagery is intentionally quite jarring to christians. To quote the satanists. It is not them who believe in Satan, its the christians who believe in Satan.
    - BongoMcCat 5y ago
      As a European, I find it quite amusing that religion is so central to american culture, that they even figured out a way to make a christian version of atheism.
- mobilemidget 5y ago
  thanks for the site link, did not have that as a entry on the resource list myself :)
sings 5y ago
I didn’t really understand why the sibling selector was introduced as a scoped version of the lobotomised owl, as if that was the canonical implementation. The sibling selector has always been underrated.

by dvaun 5y ago

noman-land 5y ago

It's an excellent article. I share it with people constantly.

chrisweekly 5y ago

While "Axiomatic CSS" per se has (unfortunately) not quite (yet?) gone mainstream, its origins -- see https://every-layout.dev https://every-layout.dev -- are a profoundly excellent resource, and have been highly influential.

leephillips 5y ago
That site is black on white¹, and has no other colors, images, fancy borders, nor any other obvious “design”—and yet it is remarkably pleasant to look at, even beautiful. The site sells the authors’ ideas; they obviously know something. (Plus no doorslams, cookie warnings, or other annoyances. And an RSS feed.) [1] Really very dark grey on very light grey.
- juped 5y ago
  "and yet"? It's "and therefore". † The only problem is that the atrocious #fafafa on #050505 is made a whole lot worse because there aren't a bunch of even worse things distracting you from it.
  - chipotle_coyote 5y ago
    Okay, I'll bite. Why is #050505 on #FAFAFA (not the reverse, as you stated) "atrocious"? Are we playing the "anything less than #000000 on #FFFFFF is grey text on a grey background and entirely unreadable" card?
    - extra88 5y ago
      I don't understand their complaint either. Some people have a hard time with absolute black on absolute white (and/or vice versa) so easing up a little can be helpful. It's a small difference, 19:52:1 vs. 21:1 contrast ratio. I've seen advice to avoid exceeding 18:1 in large areas, maybe #111 on #f9f9f9.
      - dotancohen 5y ago
        How do you calculate the contrast ratio?
        chipotle_coyote 5y ago
        I use the WebAIM contrast checker: https://webaim.org/resources/contrastchecker/ https://webaim.org/resources/contrastchecker/ It's basically a measure of perceived brightness. The actual formula involves calculating the relative luminance of the background and foreground colors, where luminance is a value from 0 (darkest) to 1 (lightest), and using the formula (lighter_luminance + 0.05) / (darker_luminance + 0.05) So the highest possible contrast ratio in this system is 21:1.
        dotancohen 5y ago
        I see, thank you.
        extra88 5y ago
        The WebAIM contrast checker web page is one of many. It's nice because the colors have lightness sliders so one can quickly try alternatives then copy the hex values into your CSS. I like checking with Lea Verou's https://contrast-ratio.com https://contrast-ratio.com because it can check colors written in many different formats, not just hex. Also, it can do +/- contrast ranges when colors include the alpha channel. In the Chrome and Firefox DevTools, you often can simply click the color swatch for the `color` property. The pop-up includes the contrast number vs. the background-color for that text and whether or not it meets a Web Content Accessibility Guidelines (WCAG) contrast criteria (Level AA if it's 4.5 or above for regular-sized text, Level AAA if its 7 or above for regular-sized text).
dvaun 5y ago
What a neat resource. Thanks for sharing!
deleted 5y ago
[deleted]
mninm 5y ago
I was trying to figure out what font they are using and when I was inspecting the page I found the comment below. I have nothing in particular to say about it. I just thought it was interesting. 
- rocqua 5y ago
  Pretty sure that is from the church of satan. Which is not about worshiping satan but more humanist / atheist / there is no god but you should still be a force for good. It's just that their imagery is intentionally quite jarring to christians. To quote the satanists. It is not them who believe in Satan, its the christians who believe in Satan.
  - BongoMcCat 5y ago
    As a European, I find it quite amusing that religion is so central to american culture, that they even figured out a way to make a christian version of atheism.
mobilemidget 5y ago
thanks for the site link, did not have that as a entry on the resource list myself :)

sings 5y ago

I didn’t really understand why the sibling selector was introduced as a scoped version of the lobotomised owl, as if that was the canonical implementation. The sibling selector has always been underrated.