It’s also published as a Google Chrome extension.

Use it—because it’s awesome sauce.

The PosteRazor cuts a raster image into pieces which can afterwards be printed out and assembled to a poster.

Yep, that’s right, you can assemble a poster from copy paper on the cheap. But “how can I avoid the ugliness of scotch tape and paper curl?” you might ask. Good question!

I found 8.5x14 legal sized sheets with removable adhesive backing from onlinelabels.com which would let you slap your paper right onto the painted wall surface — no tape, no curling. Woohoo!

Smart mobile navigation without hacks

This option makes use of the :target CSS pseudo-class selector, which lets you style elements referenced by the URL #fragment.

It’s a CSS-only solution that works on most modern browsers (Chrome, Firefox, Safari, IE 9+), however, it is currently incompatible with Opera Mobile since the :target CSS doesn’t seem to trigger a page update. Doh!

Cool, huh? Bravo to Aaron Gustafson for coming up with the solution. Hopefully an Opera Mobile workaround will be available soon.

An alternative to select elements as navigation in narrow viewports

Instead of using a select drop-down on narrow screens, why not recreate the experience with toggleable blocks that you style your way?

Interesting alternative to using the somewhat awkward select drop-down. Maybe I’ll give it a shot.

For a large site with lots of menu items (e.g. a resource site) how do we cram it all into a usable menu with a good mobile UX?

It’s tempting to just take the “easy route” to mobile menus and use native select (dropdown) menus. While it’s snappy and usable, it’s a little disorienting as it removes the user from the look and feel of your website.

I came across this drill down menu from 2009 and think it might work well on a small screen. I haven’t tried it out yet, but nothing else looks promising at the moment.

Thoughts?

I finally ended up replacing colorbox with lightly (5KB source). While it doesn’t have many features, it did seemingly solve my problems.

Apologies in advance if you’re viewing this site on IE < 8.

Topic of the day: I love Trader Joe’s Breakfast Burritos.

One tiny addition: my twitter feed is on the sidebar now. Exciting.

Fixing My Screwed Up OS X 10.6 Account After 10.7 Upgrade

Here’s what I did to fix my account (in the present tense)…

• Reboot and hold apple (command) R to enter recovery mode
• Open Terminal from the Utilities menu
• Run ‘resetpassword’ to open the Reset Password utility
• Select your harddrive, then select the root user from the users menu
• Reset the root password, and also reset the ACL
• Reboot, then login as root
• Once logged in as root (System Administrator), you can go to System Preferences, User Accounts, and then add your old 10.6 username, choosing to reuse the existing directory. This may take a few minutes.
• Reboot once more, and you should be able to login as your old 10.6 username.

I hope this helps someone that had the same problem! Let me know if this works for you.

Duplicity in a Nutshell

Duplicity…

• is an easy to use backup and restore command line utility
• supports encryption and signing of archives using gpg
• is bandwidth and space efficient
  • uses rsync to transfer only the modified parts of files, with support for binary files
• uses a standard file format (gnu tar and rdiff incrementals)
• supports multiple protocols including local storage, scp/ssh, ftp, rsync, and Amazon S3

See full list of features and documentation

Getting Started With Duplicity—Quick Guide and Examples

Downloading and Installing Duplicity

Duplicity has several requirements so you may want to use a package manager to install.

MacPorts Installation:

1

sudo port install duplicity

Ubuntu packages:

You should install the duplicity package along with python-boto for S3 support.

Trying Out Duplicity

You can try out a simple Duplicity backup locally by running:

1

duplicity <source-directory> file://<destination-directory>

See more examples.

After you’ve succesfully created your first backup, you should see some backup statistics including the total count and file size of new or modified files.

Creating a GPG Key For Encryption

To encrypt your backup, you will first need to create a gpg key. You can create a key for use only with Duplicity, which will protect your files from being viewed in transit or in remote storage (e.g. Amazon’s servers).

Run gpg --gen-key in your shell.

1
2
3
4
5
6
7
8
9
10
11

#~ gpg --gen-key
gpg (GnuPG) 1.4.11; Copyright (C) 2010 Free Software Foundation, Inc.
This is free software: you are free to change and redistribute it.
There is NO WARRANTY, to the extent permitted by law.

Please select what kind of key you want:
   (1) RSA and RSA (default)
   (2) DSA and Elgamal
   (3) DSA (sign only)
   (4) RSA (sign only)
Your selection?

• Choose kind of key, keysize, and expiration. I used the defaults.
• Enter a “Real Name” (e.g. Duplicity Backup), email address and comment, then O(kay) to continue with key generation.
• Enter a passphrase to protect your private key (this should be sufficiently long and difficult to guess). A passphrase may contain spaces.
• At this point, the key will be generated. On a remote host, you may have trouble generating enough random entropy. In this case, you might want to run some find commands or something to generate random data. It can take a minute or so for this step to complete.
• After key generation, note the key identifier for use with Duplicity.
  • The key identifier is an 8-digit hexadecimal number (e.g. D7E2BEC8). It’s displayed on a line beginning with pub, after the /.

Signing Up With Amazon S3

Amazon S3 is a fast and reliable storage system which can be used along with Duplicity. It is relatively inexpensive, costing $0.10 per GB uploaded, $0.15 per GB downloaded, and $0.14 per GB-month storage. It’s designed to provide 99.999999999% durability and 99.99% availability (of objects over a given year).

Sign up for Amazon Web Services (AWS) and Simple Storage Service (S3). You’ll need to use your S3 security credentials with Duplicity, so be sure to copy down your Access Key ID and Secret Access Key.

Creating a Duplicity Backup Script

You can use this bash script template to get started. Use your Amazon S3 security credentials, and the gpg passphrase and key identifier from the section above.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

#!/bin/bash
ulimit -n 1024 # I needed this to increase the maximum number of open files on OS X 10.5

# your Amazon S3 security credentials
export AWS_ACCESS_KEY_ID="XXXXXXXXXXXXXXXXXXXX"
export AWS_SECRET_ACCESS_KEY="XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"

# your gpg passphrase (needed to sign files with duplicity)
export PASSPHRASE="XXXXXXXX"

# your gpg key identifier (8-digit hexadecimal number)
GPG_KEY="XXXXXXXX"

# backup source directory. if you set this to / (root), be sure to exclude /tmp, /proc, /dev, and probably /sys too
SOURCE="/Users/Example"

# destination URL (Amazon S3 bucket)
# Note: bucket need not exist but does need to be unique among all Amazon S3 users.
DEST="s3+http://your_unique_bucket_name"

duplicity \
  --verbosity 4 \ # default verbosity. use 5 to see added/changed files, 0 for silence
  --full-if-older-than 30D \ # option to create a new full backup after X days
  --encrypt-key=${GPG_KEY} \
  --sign-key=${GPG_KEY} \
  --s3-use-new-style \
  --s3-use-rrs \ # reduced redundancy storage option. use for less important backups. provides cheaper rates.
  --exclude=/Users/Example/Junk \ # exclude a path (uses shell globbing)
  --exclude=/Users/Example/Downloads \ # supports multiple exclude switches
  ${SOURCE} ${DEST}

# reset the environment variables
unset AWS_ACCESS_KEY_ID
unset AWS_SECRET_ACCESS_KEY
unset PASSPHRASE

Automating Your Duplicity Backup Script With Cron

Edit your crontab:

1

crontab -e

I perform a daily incremental backup early in the morning. My crontab entry looks like:

1

0 6 * * * bash -l -c 'duplicity-backup'

Note: This would run the wrapper script daily at 6:00 AM. I use bash -l -c <command> to load up an environment very similar to an interactive shell session, so my PATH is set properly. The -c option tells bash a command follows. The -l option tells bash to load the entire environment.

More about cron.

Creating a Duplicity Restore Script

Below is an example restore wrapper script I use.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

#!/bin/bash

# requires argument: relative (not absolute) path of files to restore (e.g. Documents)
if [ -z "$1" ]
then
  echo "Need restore source path argument"
  exit
fi

ulimit -n 1024 # I needed this to increase the maximum number of open files on OS X 10.5

# your Amazon S3 security credentials
export AWS_ACCESS_KEY_ID="XXXXXXXXXXXXXXXXXXXX"
export AWS_SECRET_ACCESS_KEY="XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"

# your gpg passphrase (needed to sign files with duplicity)
export PASSPHRASE="XXXXXXXX"

# your gpg key identifier (8-digit hexadecimal number)
GPG_KEY="XXXXXXXX"

# source URL (Amazon S3 bucket holding your Duplicity backup)
SOURCE_URL="s3+http://bucket_name"

# destination directory
DEST_DIR="/Users/example/restore"

mkdir -p $DEST_DIR # create the destination directory if it doesn't exist

duplicity \
  --encrypt-key=${GPG_KEY} \
  --sign-key=${GPG_KEY} \
  --file-to-restore "$1" \
  ${SOURCE_URL} ${DEST_DIR}

# reset the environment variables
unset AWS_ACCESS_KEY_ID
unset AWS_SECRET_ACCESS_KEY
unset PASSPHRASE

Conclusion

That should get you started with creating your own secure, incremental, remote backups. Please reply if you’ve tried the examples above and report your success or failure. Thanks!

There are many CSS image replacement techniques out there. Notably, the FIR or “Fahrner Image Replacement” technique is among the most popular. However, this method is not deemed accessible.

The goal of image replacement techniques is to be compatible with the most possible browser (user agent) configurations and to be accessible. This means we want to support browsers with a 1% or greater market share in various configurations (e.g. CSS on/off, images on/off), as well as screen readers and other assistive technologies.

My personal preference for image replacement involves using an a (anchor tag) inside an h1 or other block element. It is called the “LLJ” method, and it should work on all major browsers, including IE6+.

Below is the HTML/CSS to implement this technique. It’s also hosted on jsfiddle.

HTML:

1
2
3

<h1 id="title">
  <a href="http://example.com" title="example title">Meaningful Text</a>
</h1>

CSS:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

h1#title {
  position: relative;  /* allows child element to be placed positioned wrt this one */
  margin: 0;           /* adjust margin as needed */
  padding: 0;          /* needed to counter the reset/default styles */
  height: 50px;        /* height of replacement image */
  overflow: hidden;    /* hide the text */
}

h1#title a {
  position: absolute;  /* defaults to top:0, left:0 and so these can be left out */
  height: 0;           /* force 0 height */
  width: 100%;         /* width of parent */
  padding-top: 50px;   /* match height of h1#title above */
  background: url(replacement-image.png) top left no-repeat;
}