Stuff & Nonsense product and website design

Quotes & accents (& Dashes) and TextExpander

Jessica Hische made Quotes & accents (& Dashes). Remembering keystrokes for these characters is hard, but for me remembering character entities is downright impossible. So I made TextExpander do the remembering for me. Here’s how I did it:


  • Get TextExpander (obviously)
  • (Optional: In TextExpander, create a new group. I call mine ‘Entities’)
  • Decide on a trigger key to type before each entity. I use the § as it’s a key I never, ever use for anything else 1
  • Set an abbreviation for each entity. Mine are:
Entity TextExpander
“ Left double quote “ § option + [
” Right double quote ” § option + shift + [
‘ Left single quote ‘ § option + ]
’ Right single quote ’ § option + shift + ]
– An en dash – § option + -
— An em dash – § option + shift + -

I’ve created TextExpander abbreviations for &, $, ©, …, £ and € too. Now when I need to code a character entity into my HTML, I need only type the trigger key, then the usual keystrokes for that character.

  1. Why use a trigger key? So I can still use normal keystrokes to insert those characters into other types of documents without TextExpander turning them into entities.

Written by Andy Clarke who filed this in development .


Would you like advice and inspiration on making better designs for the web?

Get monthly design inspiration and insights based on my 25+ years of experience. View some recent emails, sign up today, and get:

    I promise never to share your email address and you can unsubscribe with just one click.

    Free set of Layout Love grid templates when you sign up today.

    Hire me. I’m available for coaching and to work on design projects.