For the last 5–10 years, I’ve been using the Dvorak keyboard layout for typing.1 At this point, I’m pretty fast and usually don’t make a ton of mistakes. Since I almost never2 use a QWERTY layout,3 I’ve gotten really slow with it. So, when I’m helping a coworker with a problem, I’ll sometimes switch their keyboard to a Dvorak layout and try to type normally. But my hands will often think, this keyboard feels different; it must be another person’s keyboard; other people use the QWERTY layout, and so I keep typing words as though I were using a QWERTY layout, resulting in a big jumble of random letters. Or maybe it’s not necessarily that the keyboard feels different, and more that I know I’m using another person’s computer. Because when I plug a new keyboard into my own computer, I can usually use Dvorak without a problem.
I have two mechanical keyboards. At work, I use a keyboard with an ergonomic split-layout. At home, I use a tiny keyboard with slightly more traditional key layout. I can type reasonably fast on either of them. However, when I bring my home-keyboard into the office, my hands will just feel a mechanical keyboard, and since I am in the office, they assume I’m using the split keyboard, and keep trying to use it as such. When I tell my hands to insert a new line, suddenly my thumb will press the “Upper layer” button, because that’s where the enter key is on the split keyboard. This does not happen when I use the tiny keyboard at home, so, somehow, my hands can figure out whether I’m in the office or not.
Footnotes
I learned Dvorak back in high school because I was dissatisfied with the Neo layout’s performance for English text and, as a high school student, I could afford the approximately 1 month of being essentially unable to type. If you’re considering learning Dvorak because you think it’ll make you faster, the speed gains are negligible, and probably not worth typing slow for 1–3 months. If you have trouble with RSI and are looking for fun and quirky ways to address the issue, Dvorak may be for you – although I hear Colemak is better, so maybe try that instead. ↩
I do use a QWERTY layout when typing Chinese. Specifically, I use the Sougou Shuangpin layout. Shuangpin because Pinyin has me press way to many keys, and I don’t trust the autocompletion, and the Sougou variant because it was the first one in the list on iOS.
Also, I use QWERTY software keyboards, both on my phone and tablet. ↩
Ironically, the word “QWERTY” is more fun to type on a Dvorak keyboard than on a QWERTY keyboard, because you don’t get into that uncomfortable spot where your left index finger has to type 50% of the letters. ↩
The title for this section is a joke. I know proprioception has nothing to do with detecting when you’re in the office or at home. (Or, at least, I hope it doesn’t. Otherwise this footnote would be very embarrassing.) ↩
At my previous job, we were told not to use partials to clean up our view code, because each rendering of a partial would add around 10ms to the overall response time. After I was told this I did a quick test in my dev environment, but I’d never actually tested the claim on production … until today!
The setup
I created a new rails project and generated a scaffold I called things. On the index page, underneath the auto-generated table, I put the following:
<% if params[:manypartials].present? %> <p>Many partials:</p> <% 1000.times do %> <%= render "simplepartial", iterations: 1 %> <% end %><% else %> <p>One big partial:</p> <%= render "simplepartial", iterations: 1000 %><% end %>
I then created the partial simplepartial and added this code:
<% iterations.times do %> <p>This is a simple partial. Hello from the partial!</p><% end %>
Results
I launched the dev server with rails s and the production server with rails s -e production. I ran
time curl "http://0.0.0.0:3000/things?manypartials=true" > /dev/null
and
time curl "http://0.0.0.0:3000/things" > /dev/null
to make the requests. (The pipe to /dev/null is to reduce the time spent printing stuff to the terminal.)
Many partials
One big partial
Dev
44.365s
0.852s
Production
0.273s
0.152s
So it seems that rendering 1000 partials will cause around 100–200ms of extra rendering time. That’s certainly not great, but it may not be too high a price to pay for HTML templates not growing to thousands of lines.
When programming on low-resolution screens,
I like to use 10pt Monaco with antialiasing turned off.
But when switching to my MacBook’s retina display,
I want antialiasing turned back on.
Until now, I would manually comment/uncomment some CSS
in Atom’s styles.less file to change this.
Turns out, you can define
CSS rules based on the current screen resolution.
By adding the following to styles.less,
Atom automatically switches the font and antialiasing settings
as soon as you move the window from one screen to the other:
I’m currently trying out Atom as the main tool for my computer job and I wanted to make it more fun, so I added some CSS to make the cursor move smoothly and give the text-selection rounded corners. To try it yourself, click on Stylesheet in the Atom menu and paste this code:
atom-text-editor .cursor { transition: all 80ms;}atom-text-editor .selection { border-radius: 4px; transition: all 20ms;}
Having numbers and letters in the same text is a difficult challenge for typography:
Arabic numerals have a completely different origin, and thus completely different shapes than roman letters.
If you just somehow throw them in the middle of your text, the numbers will look out of place.
But (let’s pretend) you want them to look like they fit in.
You don’t want your numbers to show up at their friend’s party and someone walks up to you them and is like, “So how do you know the host?”, and you’re the numbers are like, “I study physics with them,” “We come from the other end of the world,” and the person is like, “Haha yeah, I figured, from the way you look.”
Because that would be embarrassing.
So the typography friends all sat down together and adapted numbers to look more like letters.
Since there are two kinds of letters, they made two kinds of numbers.
One kind to go well with upper case letters, for titles and tables, and one to go well with lower case letters, for body text.
They are called by many names, but we’ll call them upper case and lower case numbers.
Using upper case numbers in the middle of body text has the same effect as using ALL CAPS in the middle of body text: it makes the number seem damn important. That’s fine if the number is damn important, but most numbers are not.
During most of the nineteenth and twentieth centuries, lining figures were more widely known as ‘modern’ and text figures as ‘old-style.’ Modernism was preached as a sacred duty, and numbers, in a sense, were actually deified. Modernism is nothing if not complex, but its gospel was radical simplicity. Many efforts were made to reduce the Latin alphabet back to a single case. (The telegraph and teletype, with their unicameral alphabets, are also products of that time.) These efforts failed to make much headway where letters were concerned. With numbers, the campaign had considerable success. Typewriters soon came to have letters in both upper and lower case but numbers in upper case alone. And from typewriters come computer keyboards.
Typographic civilization seems, nonetheless, determined to proceed. Text figures are again a normal part of type design – and have thus been retroactively supplied for faces that were earlier denied them. However common it may be, the use of titling figures in running text is illiterate: it spurns the truth of letters.
Ok, let’s continue.
Unfortunately, uppercase numbers aren’t always bad. Especially the scientifically minded will often wish to have big tables of numbers, and the contents of tables are supposed to look nice and regular – “tabular”, you might say. In this case, it makes sense to take advantage of the uniform, blocky shapes of upper case numbers to make everything line up neatly. As a result, we’d want lower case numbers for text, and upper case numbers for tables.
Buuuuuuut, because fonts and the web and everything are complicated and we can be glad to even occasionally get half-decent fonts on the web at all, this is too much to ask. Instead, let’s see if we can find a middle ground where everyone is only sorta unhappy.
The solution – read this part
From what we’ve learned in the last section, if you ever want to have a table with numbers in your text, using lowercase numbers is kind of a nonstarter. Instead, we’re aiming for uppercase numbers that are less awful.
Let’s look at some fonts:
A number and a typo. From top to bottom: Times, EB Garamond, Palatino, Hoefler Text, Gentium Book.
{:.right.half}
In the first and third line (Times New Roman, Palatino), the problem is clearly visible: the numbers are absolutely gigantic and distract from the text. In the second and fourth line (EB Garamond, Hoefler Text), lowercase numbers emulate the dynamics of the text and thus blend in better. In the fifth line (Gentium Book), the numbers are upper case and thus usable for tables and titles, but they aren’t obnoxiously huge. Now, the makers of Gentium did not just scale down the numbers and call it a day. Instead, they lowered the entire cap height (see picture on the right or possibly above). This is especially visible in the “The” at the beginning of the line; the “T” is much shorter than the “h”. As a result, lowercase letters can retain their ascender height and don’t look squished, and numbers (which have cap-height) aren’t obnoxious. On top of that, you get the positive side effect of having nice-looking acronyms without needing small-caps, which has been another source of constant frustration for me.
I first saw this technique in the font FiveThirtyEight use:
By the nature of their content, they need a lot of numbers and acronyms, while still wanting to maintain a generally nice-looking page. Their font solves this problem wonderfully.
In conclusion: If you want good looking text and not worry about things and not bother with small numbers, find a font with a small cap-height and/or large x-height, and ideally with long-enough ascenders that it doesn’t look all cheap and squished. If you’re unsure, just use Gentium Book – that one’s in Google Docs, looks cool, and has all kinds of non-latin accents and stuff too.
{:.right.half}