If you use Foursquare on an iOS device, I highly recommend trying out the Checkie iOS app. It's an incredibly minimal and efficient interface for checking into Foursquare.

Though I'm a big fan of the numerous innovations that Foursquare has made, the user efficiency of Foursquare's fundamental check-in feature has been steadily deteriorating since the days we could simply send a text message to Dodgeball.

Foursquare: 5+ steps with waiting to check-in

Now it takes several steps check-in with Foursquare:

1. Launch Foursquare
2. Tap the "Check-in" button
3. Wait for network response
4. Spend time reading/scrolling to find the venue you want
   • if you don't find it, search and wait for network response again
5. Tap a venue in the list
6. Wait for network response to fill in information
7. Tap the "Check In Here" button
8. Consider entering a message (and/or photo)
9. Tap the "Check In" button

On the other hand...

Checkie: 2 steps to check-in

With Checkie, it's two steps:

1. Launch Checkie - it lists the venues from the last time you used it (in easily readable nicely sized black on white Helvetica to boot), so if you're nearby, it's easy to immediately find your new venue. Or if you wait a few seconds it will quickly and automatically refresh the list.
2. Tap a venue to immediately check-in

That's it, you're done. Power-button-lock your device and put it away, no need to wait to see the UI update, though it eventually does, showing you the number of points you got for that checkin. You can also optionally tap-and-hold a venue in the list, and Checkie will take you to a second screen where you can add a message to the check-in.

Mobile UI = focused, task-oriented, minimal

Minimizing the number of steps it takes to check-in is super-critical for an application like Foursquare, where you're typically out and about, and want to spend very little time interacting with your device before putting it away. I wrote most of this recommendation to use Checkie as a comment on Edd Dumhill's Google+ post where he lamented: "I never have time [to check-in] when I'm somewhere interesting." Edd's observation is spot-on. Mobile UI design must be focused task-oriented in order to be cheap enough in terms of time/attention cost to be worth using. Get in, minimal steps to do the task, get out. All the "distract me looking through a seemingly endless stream of random unrelated things" features should be buried or secondary at most.

Toward IndieWeb Checkins

I find Checkie not just useful, but inspiring. If a third party client can provide a better check-in experience than Foursquare itself, then perhaps by adopting such designs we can provide a better IndieWeb check-in experience. Such an IndieWeb check-in interface would first post a check-in to your own site (perhaps privately or with limited access), and then syndicate it out to Foursquare (and potentially other check-in sites) so you could keep in touch with friends still in the silos. The best part: Checkie is on github.

Bottom line: if you have an iOS device and use Foursquare, get Checkie, use it, be inspired, build something similarly minimal and useful for your own site. Hat-tip to Edward O'Connor for showing me Checkie earlier this year.

Additional Reading

• 2012-05-02: Single-tap check-ins come to iOS with Checkie by Chris Thompson
• 2012-07-03: Checkie gets more advanced check-in options by Chris Thompson

Previously

• 2007-02-19: Three Hypotheses of Human Interface Design
• 2012-06-07 14:30: DO NOT UPGRADE iOS @Foursquare. [...]
• 2012-06-07 14:39: Old @Foursquare nearby checkins was nice clean focused quick glance #mobile #UX. [...] [I'm still using v4 of the Foursquare Client due to the v5 app's horribly bloated and ugly (1+1=3 noise) composite stream/list of checkins, reviews, likes, etc.]

It's the end of another year and holiday season, and thus a good time to help make sure those you visit have Java disabled on their browsers in order to reduce the chances they'll get exploited. Originally posted in 2010, here are the instructions (with few changes) to turn off Java in Chrome, Firefox, Opera, and Safari.

Disable Java in Chrome

• There is no direct UI in Chrome. You have to:
• Go to chrome://plugins (if clicking that link doesn't work, copy/paste it into a new tab)
• Scroll down to Java ...
• Click the blue underlined Disable text link there
• Consider disabling Flash and others too

Disable Java in Firefox

• From the Tools menu, choose Add-ons
• Click Plugins on the left
• Scroll down the list til you see Java Plug-in ...
• Click the ( Disable ) button on the far right
• You should see (disabled) immediately to the right of the Plugin name.
• Consider disabling Shockwave Flash and others too
• Close the Add-ons window

Disable Java in Opera

• Go to opera:config#Java|Enabled (if clicking that link doesn't work, copy/paste it into a new tab)
• Uncheck the Enabled [ ] checkbox if any
• Click [ Save ]
• Click ( OK ) to dismiss the dropdown sheet
• Choose Quit Opera from the Opera menu
• Relaunch Opera

Disable Java in Safari and WebKit nightlies

• From the Safari menu, choose Preferences...
• Click the Security (with lock icon) in the top row
• Uncheck [ ] Enable Java
• Close the Preferences window (titled Security at this point)

Bonus: Disable Java in Camino

• From the Camino menu, choose Preferences...
• Click Web Features (with globe/switch icon) in the top row
• Uncheck [ ] Enable Java
• Close the Preferences window (titled Web Features at this point)

Performance boost: disable Flash

Disabling Java will not only increase security (by avoiding all the above-mentioned Java vulnerabilities) but it will increase performance as well because your browser won't waste any network time downloading Java applets, nor will it waste any CPU time running them.

Disabling Flash, though it has fewer vulnerabilities than Java, will likely cause sites to load faster, since much more network/CPU is wasted by all the Flash ads that sites have these days. I disable Flash everywhere but Safari and run ClickToFlash (the 1.6b9 beta works fine) to selectively run Flash on video sites like Hulu and YouTube.

Additional Reading

More on the subject of Java (and Flash) vulnerabilities, additional sets of disabling instructions, etc.

• 2010-10-27: Disable Java NOW / Why does the New York Times Chicken-Little HTML5 When Java Exploits Are Real?
• 2012-08-30: How to turn off Java on your browser - and why you should do it now by Graham Cluley
• 2012-10-01: How to disable Java in IE, Firefox, Chrome, and Safari by Dennis O'Reilly
• 2012-10-18: Apple gets aggressive - latest OS X Java security update rips out browser support by Paul Ducklin

Search the web for "CSS classes" and you'll find numerous well intentioned references which are imprecise at best, and misleading or incorrect at worst. There are no such things as "CSS classes". Here's why you should refer to HTML classes, CSS class selectors, or even CSS pseudo-classes, but not "CSS classes".

Terminology Summary Table

Wondering what to call "classes" and don't care why? Here's a handy table of examples and terms.

the thing	what to call it
class="h-card vcard"	class attribute, HTML class attribute
h-card vcard	classes, class names, HTML classes / class names, or class attribute value
h-card	class, class name, or HTML class (name)
.h-card	class selector, or CSS class selector
:active	pseudo-class, pseudo-class selector, or CSS pseudo-class (selector) - except for :first-letter,:first-line,:before,:after
::first-letter	pseudo-element, pseudo-element selector, or CSS pseudo-element (selector)

Why "CSS classes" is imprecise or incorrect

There's no such thing as a CSS "class". Optimistically what may be happening is that people who say "CSS class" are using it as an imprecise shorthand for "CSS class selector". However, in articles / conversation I've seen / heard that's not the case. They're incorrectly referring to the "class" itself, just the class name, e.g. "h-card" in the above table/examples.

Both "h-card" and "vcard" are just "classes" or "class names" (as well as being root class names for the h-card / hCard microformats). If you need to be explicit that you're talking about web technologies, prefix the phrases with "HTML", e.g." "HTML class(es)" or "HTML class name(s)".

Why saying "CSS classes" is bad practice

This isn't just pedanticism. By using the phrases "CSS class(es)" or "CSS class name(s)" you're not only being imprecise (or just plain wrong), you're tying the presentational context/framing of "CSS" to class names which implies and even encourages the bad practice of using presentational class names.

Why saying "HTML classes" is good practice

In conversations, discussions, and especially when teaching workshops, it's better to be consistent about calling them "HTML class(es)" because that more accurately refers to their effects on structure and semantics. It's upon that structure and those semantics that we can then write whatever CSS rules we need to achieve the design of the day/week/month (which inevitable gets changed/tweaked far more often than the underlying markup / classes).

Hat-tip to Jonathan Neal, who asked about a "css naming convention guide" in a certain Freenode CSS related IRC channel, to which I answered text similar to the above and then decided I should blog it for reference. Oh, about class naming conventions: a big part of where microformats came from was the desire to come up with naming conventions for common components/chunks/modules in pages like people, organizations, events, reviews, etc. Want to explore more such class naming conventions? Join us in IRC: Freenode: #microformats, or if you're in the San Francisco Bay Area, come by the microformats meetup & drinkup tonight (Facebook, Google+, Plancast).

Last month I documented A Few San Francisco Election Flyer Statistics. Here is an update of what I've received since and final totals.

Flyers after 2012-10-21

After 2012-10-21 I received the following flyers for specific propositions and candidates:

• 1 Yes on 33
• 1 Yes on 39
• 1 Yes on A
• 1 Yes on B
• 2 Yes on C
• 3 Yes on E
• 1 Chris Jackson for Community College Board
• 5 London Breed
• 1 doublesided doorhanger with London Breed on one side and Thea Selby on the other (both for district 5 supervisor). I think I will count this as half a flyer for each.
• 1 Julian Davis for district 5 supervisor
• 4 John Rizzo for district 5 supervisor

And the following flyers from committees, groups, coalitions advocating for (y) or against (n) propositions and candidates:

• 2 Small Business Action Committee - advocating: 30n, 32y, 40y
• 1 Sierra Club Voter Guide - advocating: 31n, 32n, 37y, 39y, Cy, Mark Leno, Phil Ting, Tom Ammiano, John Rizzo
• 1 Election Digest / Coalition For Literacy Newsletter - advocating:30y, 32n, 33y, 37n, 38n, 39y, Obama, Feinstein, Klivans

Flyer Totals

With the above flyers included, here are the updated flyer totals for various issues and candidates, with the winners highlighted in green and rejected propositions in red. Results are from SFDOE Results and California General Election | California Secretary of State.

Committees, Groups, Coalitions

A number of flyers were from various groups that advocated for (or against) particular propositions and/or candidates. It made the most sense to list those flyers separately by group. In alphabetical order:

• 2 Budget Watchdogs (re: 30-37, 39)
• 1 Election Digest / Coalition For Literacy Newsletter - advocating: 30y, 33y, 39y, Obama, Feinstein, Klivans
• 1 San Francisco Firefighters (re: 30, 32, A-E, F, supervisors, state senate/assembly)
• 1 Sierra Club Voter Guide (37y, 39y, Cy, Mark Leno, Phil Ting, Tom Ammiano, John Rizzo)
• 4 Small Business Action Committee (32y, 40y). One flyer had the URL "readityourself.org" which is apparently about Packard Humanities Institute and doesn't mention Small Business Action Committee at all.

California Propositions Flyers

Flyers primarily about specific California (CA) state propositions:

• 1 Yes on 33
• 1 Yes on 39

Most California propositions failed. 5 out of 11 passed. It's not clear whether their outcomes had any relation to flyers distributed.

San Francisco Propositions Flyers

Flyers primarily about specific SF city propositions:

• 1 A
• 4 B
• 3 C
• 4 E

All San Francisco propositions passed except for F (draining the Hetch Hetchy Reservoir and identifying replacement water and power sources) for which there were no flyers. However, it's not clear that the flyers had anything to do with the results - the one that failed was seemingly obviously not in the best interest of any San Francisco resident.

SF School Boards

Flyers for school and community board positions:

• 2 Matt Haney for school board
• 1 Chris Jackson for Community College Board
• 2 Hanna Leung for Community College Board (No URL)

SF District 5 Supervisor Flyers

Sorted by family-name:

• 10.5* London Breed
• 3 Julian Davis
• 4 Christina Olague
• 5 John Rizzo
• 2.5* Thea Selby

*I received a doublesided doorhanger with London Breed on one side and Thea Selby on the other, and thus decided to count it as half a flyer for each.

If we look at the number of votes each candidate received, there is a rough ordered correlation with fliers sent. The top 5 vote receiving candidates were the 5 candidates that sent out flyers, and only in the case of incumbent Christina Olague vs. John Rizzo did a candidate who sent fewer flyers receive more votes - perhaps due to an incumbent advantage factor.

Sorted by votes received:

candidate	votes	flyers	v/f
LONDON BREED	8821	10.5	841
CHRISTINA OLAGUE (I)	6203	4	1551
JOHN RIZZO	5130	5	1026
JULIAN DAVIS	4786	3	1595
THEA SELBY	4287	2.5	1715

London Breed sent out more than twice as many flyers as next most spammy candidate, and she won the election. It's not clear how much (if at all) the number of flyers helped her win, or if the number of flyers merely reflected some other factor (e.g. amount of campaign funding raised) that helped get more votes.

Now to recycle all those flyers. I might first see if it is possible to arrange all the flyers on the floor and take a photo of all of them. Will post a follow-up if that works out.

I expect there are more interesting ways to present some of this data. If you'd like to do anything with these statistics, please help yourself as I'm licensing this entire blog post and the research contained therein with the Creative Commons Attribution 3.0 license.