Top all-time · #1163
Snook.ca
Personal blog · snook.cawebdesignprogramming
Snook.ca is a personal blog at snook.ca about web, design and programming. Since 2008, 62 different Hacker News readers have linked it 74 times, most often “Font sizing with rem”. It is still writing: the last post was on 2026-10-22, and you can follow it by feed.
Most-linked posts?
- Font sizing with rem4 people · 5 mentions · first linked 2011-05-01
- /technical/colour_contrast/colour.html4 people · 4 mentions · first linked 2012-01-20
- Bad manager2 people · 2 mentions · first linked 2016-06-30
- Selling eBooks on Amazon2 people · 2 mentions · first linked 2012-10-22
- Why I don't love JavaScript's Module Pattern2 people · 2 mentions · first linked 2009-04-30
- Why Did I Have Difficulty Learning React?2 people · 2 mentions · first linked 2019-07-09
- /technical/colour_contrast/colour.html2 people · 2 mentions · first linked 2017-01-06
- Why we don't have a parent selector - Snook.ca2 people · 2 mentions · first linked 2010-10-24
- /technical/colour_contrast/colour.html2 people · 2 mentions · first linked 2012-07-04
What Hacker News says?
lower contrast is not bad, I don't want all text to be #000 and #fff, but the contrast on DuckDuckGo is too low. As it says here your text should be as readable as #333 on #fff: http://ia.net/blog/100e2r/ There are also some WCAG guidelines on contrast. Here are some contrast checkers: http://snook.ca/technical/colour_contrast/colour.html http://webaim.org/resources/contrastchecker/ http://www.checkmycolours.com/
Comment linking /technical/colour_contrast/colour.html
on “The next version of DuckDuckGo”Submitted Going Simple with JavaScript as a story · 103 points
HN discussionVery nice! If anyone else was unfamiliar with "rem"s (root em), this short article helps: http://snook.ca/archives/html_and_css/font-size-with-rem It also expands on the comment in skeleton.css on how font-size: 62.5% skales 1 em to be 10 px (it would appear 16 px is the default).
Comment linking /archives/html_and_css/font-size-with-rem
on “Skeleton 2.0 CSS Framework”Submitted CoffeeConsole: A Chrome Extension as a story · 98 points
HN discussionYou might also really enjoy Snook.ca. The Six Revisions font-face-guide reminded me of this article ( http://snook.ca/archives/html_and_css/becoming-a-font-embedd... ) that Snook wrote, and which I have declared to be the most complete guide on font embedding whatsoever. It might focus more on 'front-end development' than design per se, but much of what he offers is invaluable.
Comment linking /archives/html_and_css/becoming-a-font-embedding-master
on “Design for Hackers: Why Monet Never Used Black, & Why You Shouldn't Either”Submitted HTML5 Forms Are Coming as a story · 62 points
HN discussionWe spent time juggling between em and px before but from few months we are using "rem" unit. It works nicely as we are also using font-icons everywhere. See: http://snook.ca/archives/html_and_css/font-size-with-rem
Comment linking /archives/html_and_css/font-size-with-rem
on “In CSS, “px” is not an angular measurement and it is not non-linear”Submitted Font sizing with rem as a story · 61 points
HN discussionem or relative font-sizing seems like a good choice. Also see rem [1] which was introduced with CSS3 to combat issues with font size compounding. Use pt for print stylesheets [2]. For a bit of ancient internet history: http://style.cleverchimp.com/font_size/points/font_wars.GIF [1] http://snook.ca/archives/html_and_css/font-size-with-rem [2] http://www.w3.org/Style/Examples/007/units.en.html
Comment linking /archives/html_and_css/font-size-with-rem
on “In CSS, “px” is not an angular measurement and it is not non-linear”Submitted Selling eBooks on Amazon as a story · 47 points
HN discussionCould we please not make text light grey on white? It’s just barely AA compliant when bolded. https://snook.ca/technical/colour_contrast/colour.html#fg=96...
Comment linking /technical/colour_contrast/colour.html
on “Logo Programming”Submitted The most subversive thing you can do is blog as a story · 17 points
HN discussion>Classes should therefore describe what something is, not how it's supposed to be presented. That's what we used to think when Semantic CSS was the big buzzword, lots of articles from '08-'11 preached it as the gospel. Turns out when a language is based on customizing presentation, presentation is semantic. > I had a number of locations that I highlighted with a blue background and rounded corners. I called it `loca…
Comment linking /archives/html_and_css/semantic-css
on “Shoelace.css – A back to the basics CSS starter kit”Submitted Building an iphone app with JQtouch in two hours as a story · 17 points
HN discussionI think relative font-sizing with "em" and "rem" [1] is a popular and good choice these days. "em" has been popular since 2004 after an article by Rutter [2]. IE9- (and Android 1.6-) didn't scale/zoom well when the font was set in px. But using px was widespread despite these (and other) cons because it was easy, reliable and consistent to implement across browsers. [3] Pt (point type) are only for printer style she…
Comment linking /archives/html_and_css/font-size-with-rem
on “CSS Zen Garden relaunched”Submitted When CSS modules overlap as a story · 11 points
HN discussionI really want to check this out, but my eyes hurt reading the page because the contrast of gray on black is so low. A vision-impaired person might not be able to read it at all. Please consider using this tool to pick a text color that provides sufficient contrast: https://snook.ca/technical/colour_contrast/colour.html#fg=90...
Comment linking /technical/colour_contrast/colour.html
on “Show HN: I published my first website – ShellMagic.xyz”Submitted Journey into the World of Vim as a story · 10 points
HN discussionFeel free to bump the text size up. The site's layout will adjust accordingly :) And, for the record, the background is white, and #333333 meets the criteria of both the W3C and the WCAG ( http://www.snook.ca/technical/colour_contrast/colour.html?fg... ) Thanks for reading!
Comment linking /technical/colour_contrast/colour.html?fg=333&
on “Buying Adobe Photoshop CS6”Submitted Why Did I Have Difficulty Learning React? as a story · 7 points
HN discussionDo you have any sources for this, or is it just anecdotal? The W3C states a minimum of 4.5:1 contrast ratio[0] for body copy, or 7:1 for users with poor eyesight[1]. If Snook's calculator[2] can be relied upon, this makes #444/#fff a contrast of 9.74:1. Even a darker bg of #eee yields 8.39:1. This also depends on the font weight, stroke, and size. [0]: http://www.w3.org/TR/WCAG/#visual-audio-contrast-contrast [1]: h…
Comment linking /technical/colour_contrast/colour.html
on “Typeplate - A Typography Template”Submitted Sizing with CSS3's vw and vh units as a story · 7 points
HN discussionYou can use multiple backgrounds in CSS3: http://snook.ca/archives/html_and_css/multiple-bg-css-gradie... Lots of details here and some catches to look out for (mostly browser support).
Comment linking /archives/html_and_css/multiple-bg-css-gradients
on “Use Google+ to Improve Your UI”Submitted Creative Use of Bitwise Operators as a story · 4 points
HN discussionNo, it doesn't, the foreground color is #57534a and background is #ffffff which gives a ratio of 7.7:1 WCAG 2.0 requires a contrast of 7:1 to reach AAA levels. [1] you can test it yourself with a bunch of tools but I couldn't find link to results on any of them [2][3][4]. [1] http://www.w3.org/WAI/WCAG20/quickref/#qr-visual-audio-contr... [2] http://webaim.org/resources/contrastchecker/ [3] http://snook.ca/technical…
Comment linking /technical/colour_contrast/colour.html
on “Design tip: Never use black (2012)”Submitted Windows Substitutes Helvetica for Arial as a story · 4 points
HN discussionThis doesn't seem like such an egregious example to me - I tried it in a colour contrast checker and it passes WCAG AA but fails WCAG AAA for normal size text (but passes for larger text): https://snook.ca/technical/colour_contrast/colour.html#fg=5A... I will admit I don't find the letter spacing on that font to be particularly pleasant, and if you turn the "Cantarell" declaration off, it does become easier to read…
Comment linking /technical/colour_contrast/colour.html
on “What the heck is a parser-combinator?”Submitted My Notes on Writing an E-book as a story · 4 points
HN discussionI'm also about to publish my first book (about a guy called Elon Musk). Here are some links I've saved that were interesting to read: Selling my e-book on Amazon ( http://snook.ca/archives/writing/selling-ebook-on-amazon ) How you can make a million writing your own e-book ( http://www.dailymail.co.uk/home/moslive/article-2040044/Kind... ) How to Write and Promote New York Times Bestsellers: Tim Ferriss and Jack Can…
Comment linking /archives/writing/selling-ebook-on-amazon
on “Ask HN: Has anyone here self-published a book? Any advice?”Submitted Creative Use of Bitwise Operators: Web-based calendar as a story · 4 points
HN discussion
