It’s no understatement to say that I became a web developer because of WordPress. I started blogging with Blogger in 2005, only to become frustrated and move myself over to self-hosted WordPress. I used the old K2¹ theme as the basis of my own theme, and tweaked it obsessively. WP provided just the right amount of ease and power for where I was at, and revealed all the more power the further I dug. Tweaking your WP template is a web development gateway drug.

The rest is a blur. I graduated from SSU with a BA (Honours) in the Humanities in 2008, having tinkered along the way with my ever-intriguing WP blog. I even did my first paid work on my school’s website, attempting to wrangle some disastrous table-based Dreamweaver templates into some semblance of tolerable. By the time I graduated with my gloriously useless degree², I realized that I could make better web sites than the majority of what I saw out there. So I took the plunge into freelancing with zero experience, connections, or prospective clients. And, many bumps in the road and umpteen trips to the codex later, it actually worked out.

I’d especially like to thank my friend and collaborators Modern Tribe and David Pensato, with whom I’ve had the opportunity to do a lot of fun and meaningful work over the last few years. I’d also like to thank the Winnipeg-based Automatticians Ian Stewart and Krista Stevens for slowly convincing me that I should apply. And of course, a huge thank you to the countless people who have contributed of their time, skills, and passion to the WordPress project.

I’m looking forward to this next chapter. I get to iterate and improve rather than build and hand off, and work with super smart people every day. And my work will be seen my millions of people. Fun. I start on Monday.

However, I couldn’t find a keyboard layout that I wanted to print and look at every day. I found a Mac Keyboard Vector with a CC license and made my own tweaks. I condensed the keyboard, and also greyed-out the keys that are unchanged from Qwerty. Download below:

Colemak Layout Printout

Consider it licensed under the same CC license as above.

And, here’s the links from the last slide in clickable form:

• http://blog.typekit.com/2010/10/15/type-rendering-operating-systems/
• http://www.typotheque.com/articles/hinting
• http://www.fontslive.com/info/typography/web-font-quality.aspx
• http://www.lucasfonts.com/fonts/thesans/thesans-office/features/
• http://cl.ly/9PBw
• http://www.freetype.org/ttfautohint/
• https://github.com/typekit/webfontloader/
• http://somadesign.ca/projects/fontfriend/

I’ve already criticized the WordPress.org Theme Review process when it first launched. Things seemed to be improving, but either the team is poorly organized, severely under-powered, or both.

The Erudite 3.0 has been in review for 3 months, 3.0.2 since Sept 28. The review ticket was assigned 5 weeks ago, but still no movement.

If you are savvy enough, download 3.0.2 from the project page. There’s a security issue in the current theme that makes updating a priority. You’ll need to install and activate the Options Framework to change any theme settings.

NOTE: you will lose your previous settings when upgrading. Annoying, I know, but the old settings framework was rickety and awful.

Firstly, you can grab the theme on GitHub. I’d probably even submit it to the official WordPress.org themes directory, except that it still doesn’t list child themes (it likely will in the future).

Secondly, you can grab the slides on Speaker Deck (or view below). And, if you’re interested in watching me present, there’s the archived livestream video.

Finally, here’s a few useful links from my presentation, and a few others for folks who want to go deeper:

• More Fields plugin
• Winnipeg WordPress Meetup
• Plugin & Theme Security Video (by Mark Jaquith)
• WP security & escaping functions
• WP Data Validation
• FlexSlider (the JavsScript library powering the portfolio slideshow)

For example, I’m working as a contractor on a project using the classic VAG Rounded font. 13px bold looks great in Photoshop comps and Mac browsers, but fails horribly under Windows. I decided to run VAG Rounded Bold through ttfautohint 0.2 to see if it would offer improvements. In short: wow. In the screenshots below, ttfautohint goes head-to-head with the Fontsquirrel generator’s autohinting (which I believe is powered by FontForge).

Rendering modes are shown in the captions. Click for full size. (I’m restricted to screenshots because the font is only licensed for the client site.)

Standard (grayscale)

GDI ClearType

DirectWrite ClearType

As you can see, there’s a dramatic improvement in all 3 Windows rendering environments. 11px-13px sizes move from awful, with completely closed counters, to suprisingly readable. At 14px, the counters open up with standard hinting, but closer inspection reveals other defects such as no separation between the body and dot of the i and j characters. The improvements are even more dramatic under Standard (grayscale) antialiasing, which looks terrible below 18px. Even under DirectWrite ClearType, ttfautohint produces superior results (although a true test would also provide a completely unhinted version to see what the DirectWrite rasterizer is capable of on its own).

The only real downside is a modest file size increase. I haven’t tested across multiple fonts, but in this case our font jumped from 49kb to 63kb. I consider it an excellent trade-off for such improved rendering.

So, you want to use it? Well, first you should support the project. Currently you need to compile ttfautohint, but with our support, Werner will build a GUI version for the command line-phobic. If you’re on a Mac and want to compile, I put together an installation script.

Edit: In an email exchange, Werner pointed out that Dave Crossland—who has done much of the ttfautohint promotion—had the actual idea to use FreeType for hinting, although Werner still deserves massive praise for the execution. Werner also pointed out that VAG Rounded is a good showcase font, and that ttfautohint will not perform such striking results in all circumstances.

I quickly discovered that a good metric for higher-quality fonts was the presence of at least one alternate. The Google Web Fonts directory does not allow that type of filtering, so I built this simple one-off page that allows you to browse multi-variant typefaces. The layout is responsive, and clicking the font name takes you to Google’s specimen for that font.

All listed fonts are all downloaded. It should go without saying that the page will load slowly.

Missed the link above? Go view Better Google Fonts. And, if you like code, it’s on GitHub for your forking pleasure.

Environment Canada is my go-to forecast provider, but their site has been beaten with the Canadian government’s standard website ugly stick. And, while a mobile site exists, it’s not much better. In fact, it’s worse in some ways.

All of this has led me to make a mobile web app version. Or, at least, a mobile web app version for Winnipeg, where I live. I scrape the HTML via a proxy and restyle it in a iOS-esque style. (I might get around to integrating a city-switcher, but that’s a lot of work and I built this for me and for fun.)

I optimized the design for two uses: 1) what are the current conditions? and 2) what’s the immediate forecast? Most other forecast data is hidden by default, but can be shown. There are a few media queries for portrait/landscape view, and I snagged icons from the open-source Oxygen project to replace the drab ones from Environment Canada. It also makes use of HTML5 Application Cache to speed up launch time. And, although it should work anywhere, it’s been heavily optimized for iOS Safari.

View my Winnipeg mobile weather app. The source is on GitHub, of course.

I’ve started using FontFriend extensively on my Soma Web Font Specimen (or, if you like, on the original) as a great way to evaluate Google Web Fonts, as the directory looks like an app, not a web page (although v2 of the directory looks awesome). If you have FontFriend installed already, you’re already up to date. If you don’t, go install it now!

Kill Adminbar Search

WP 3.1 introduced the admin bar, which is generally quite useful. However, because WordPress’s search is generally not useful, having the search field take up so much real estate is somewhat frustrating. So, I made a plugin to remove it. You can download Kill Adminbar Search from the plugins repo.

Use Helvetica Dangit

WP 3.2 (currently in beta 2) has revamped the admin styles. It looks good, but we’ve made the grievous error of placing Arial before Helvetica in the font stack, which I protested. What we should do instead is simply declare font-family: sans-serif; and be done with it: this would render Helvetica Neue on Macs, Arial on Windows, and whatever Helvetica-like default system sans-serif is set on any given Linux distro. But, since my plugin is optional, I’ve declared every Helvetica variant under the sun, because nobody should have to look at Arial if they don’t have to. Download Use Helvetica Dangit from the plugins repo.