Taking back email – Part 1: My basic setup

Recently, I decided to revamp my email setup. I don’t have too much going on with email, but it’s such an important method of communication that I needed to get it under control. I’m going to put together a several-post guide explaining my reasoning, technical details, and my new email process.

All posts in this series (they will be linked here as the posts go up):

I’ll be sharing config and usage tips along the way. I haven’t seen an in-depth tutorial to getting all these tools working together, so that’s one of my goals with this series.


I have three email accounts that I use regularly. Each account duplicates some things – I have three inboxes, three archive folders, etc. Email clients take different approaches to showing mail from multiple accounts. Some, like Thunderbird, include an option to view “Unified folders” – i.e., all of your inboxes go together into one, etc. Others, like Evolution, prefer to keep things separate.

I pride myself on having a minimal email workflow:

  • Stuff comes in. I don’t want it to come in very often, so I like to only check once an hour.
  • If it’s actionable, I take a note of it outside my email system
  • Optionally, I leave the message in my Inbox to be replied to later
  • When I’m done with the message, it gets archived. I will search to find it again later.
  • I get some email that I never want to see again (notifications, etc). That gets deleted.

With three separate email accounts to handle this, though, it’s easy to miss things or to let email pile up in the Inbox (“I’ll take care of that later”). I decided I needed a system that would keep me a bit more accountable to myself. And logging into each account via webmail separately? Not an option. For me, this came with a change in the technical details of how I handle email.

The new setup: Basic email process

As I’m about to describe below, I aggregate all my email into one place now (I am aware that it’s three accounts – my setup will use the correct “from” address when replying to mail, for example).

  • All email is funneled into one inbox. I only check once an hour.
  • As soon as it comes to me, I’m going to get it out of the inbox in one of three ways:
  • Email I never want to see again is deleted directly (if applicable, I’ll unsubscribe first)
  • Email I want to keep, but is not actionable, is archived
  • Email I need to do something with (reply, finish a task, etc) is tagged “todo”.

After this, my inbox is empty.

When I’m done with a todo item, I archive it.

The new setup: Tools


My home server (this would work on a remote VPS as well) uses OfflineIMAP to fetch mail from all my accounts once an hour. They go into a folder structure:

  • mail/
    • account-1/
      • subfolder/
      • another-subfolder/
    • account-2/
      • etc…


notmuch is an email indexer and tagger. It’s used to create a searchable database of mails and to allow you to arbitrarily tag emails with different keywords.

After OfflineIMAP is finished pulling new email from the server, notmuch runs to make sure the mail database is up to date. Then, I use Syncthing to sync my mail collection and database to my home and work computers.

alot and khard

These are the programs I see and interface with in my process.

alot is an email client. It is specifically made for reading and working with databases created by notmuch. See the picture above to see alot in its full glory.

khard is a contacts manager which reads CardDav-generated contact databases. alot can use khard to autofill email addresses from your addressbook when you write a new message. Like my emails, my contacts are also synced from my server to my home and work computers.

I run alot, khard, and msmtp (below) locally on my work and home computers.


msmtp is a command line tool which sends out mail through your SMTP server. After you write the email in alot, msmtp handles the actual sending process.

Coming up next

I’ll dive into how I set up and configured OfflineIMAP on my home server.


The Simplest Sass / Flexbox Grid Ever

Until CSS Grid layout arrives, Flexbox is our best option for layouts.

Here’s a very simple set of SASS mixins to make it easy to build simple grids without needing a huge framework (even though I totally love Foundation). Even though a framework makes a lot of things simple, it’s overkill for 90% of the page layout work that I actually do in my job.

For me, the perfect grid system…

  • … is lightweight
  • … has columns that are flush to the edge of the container, with a gutter in between, and customizable padding inside
  • … allows an arbitrary number of columns in the container, with optionally wrapping elements to new lines
  • … makes it easy to resize columns individually

If I can do those things, I can build most layouts that I get from a designer.

The concept is simple, but a bit different than your traditional 12-column grid. In this system, you decide on the fly how many columns to have in your grid:

[row] { @include _fg(6); } // six columns

At this point, each child will use 1/6 of the available width of the container (with gutters in between). Want a particular child to use more – like 2/3 of the available width? Here’s how to do that:

.box { @include _fg_width(2/3); }

This will push subsequent items further out of the way, so they’ll wrap differently.

Edit 1/29/2017

The previous versions of this post featured all the code along with usage. But after a pretty major update to this mixin over the last couple days, I’ve decided it’s not a good idea to keep the code in this post as I’ll have to keep updating it. So instead of supplying all code here, I have it all available for you on Github: along with usage and documentation.

Please feel free to play with it and try it in your projects. Then, let me know what improvements need to be made! I would be particularly interested in documentation improvements too.

The big change that just happened is that we’ve augmented the _fg() mixin to accept a layout (which means you don’t need _fg_width() as often). So you can say:

@include _fg(2 1);

This will give you a 2/3 column + 1/3 column in your layout.

It may not be “simplest” anymore, but it’s sure still pretty simple and is better now.

Play with it

Try changing the mixin numbers I set above (number of columns, width of box 1), as well as the gutter and padding variables.