ArghWebWorks

At DevelopmentNow, we’ve had people ask for “gamification” to help build site engagement. My favorite example of this is Fitocracy, where people earn points for exercise and complete quests and challenges. We built the beginnings of a game for Portland Fit.

The problem with “building a game” and “gamification” (aside from the terrible word) is that people hear “game” and their impression drops. It doesn’t need to be that way. This article (Why Gamification is the Exact Opposite of What You Think) does a good job of breaking it down for people.

Gamification is about laying out a problem, helping track progress to the goal, conferring status to the player, and giving a reward to the player. For instance, I have a goal in Fitocracy to outrun some zombies. To do this, I have to run a mile in less than 9 minutes. I average around 11 but can sometimes get down to 10 for short distances. And when I get there, I get a badge on my profile. We did something similar to this for Portland Fit where the goal is to compete in the Portland Marathon, you’re a member of a training group, and you get a badge for participating in the half-marathon on the program.

The first part of the article was good, the middle was good- and I especially liked the non-gaming examples of gamification (Airline miles, for one). But the end took a dark turn, and you should read the article.

One of my problems is that sitemap files sometimes get out of sync with the actual site, even with sites driven from a database. One thing I’m working on is testing those files; you could put this into the sitemap building script if you wanted to make sure the files existed even when you were writing the sitemap file.

So here’s a snippet of PHP code to help you do that.

$in=file_get_contents('sitemap.xml');
# yes, yes, I know, don't mess with xml with regex.
# but I'm in total control over this input
preg_match_all( '|(.*?)|ism', $in, $m );
$urls=$m[1];
$err=array();
foreach( $urls as $u ){
$code = is404( $u );
if ( $code ) {
print "404 | $u \n";
$err[]=$u;
}
}
print count($urls )." errors found \n";

function is404( $in ){
# I tried the get_headers() function as well as the file_get_contents() methods
# but using curl gave me an easily accessible status number that I could compare against
# 200 and 300 (see code) in case some 301 or 302 snuck in.
$handle = curl_init($in);
curl_setopt($handle, CURLOPT_RETURNTRANSFER, TRUE);
curl_setopt($handle, CURLOPT_NOBODY, true );
$response = curl_exec($handle);
$httpCode = curl_getinfo($handle, CURLINFO_HTTP_CODE);
curl_close( $handle );
if ( $httpCode >=200 && $httpCode <300 ) {
return false;
}
else {
return true;
}
}


I may put that is404 method into the script that builds the sitemap. That script just pulls data from the database and it should be right. Unfortunately it isn’t always right.

That was exciting. Like worrying away at the skin around a sliver in your thumb until the sliver finally pops free.

I was given some legacy code that was supposed to email a salesperson and a customer on completion of an order. The code used ActionMailer, and it was not working. Of course, I had to figure out what was wrong with it. To complicate matters, there was another team “doing a secure email configuration,” and I wasn’t sure about the line of demarcation between my bailiwick and theirs.

The first order was to figure out how to test ActionMailer from a console. So I navigated to the root of the production site and used “rails console production” to open up a console window. Wait a moment while the app initializes. Then I could examine SMTP settings with “ActionMailer::Base.smtp_settings” .

I used this piece of code (I used it often enough with minor modifications that I opened up a text editor so I could cut and paste it).

class MyMailer < ActionMailer::Base
def test_email
@recipients="(me)"
@from="(a real email address with a real domain)"
@subject="some subject"
@body="some body"
end
end


And then tried to deliver it with "MyMailer.deliver_test_email". Nothing happened, so I had to type this into the console window "ActionMailer::Base.raise_delivery_errors = true" and try again with deliver_test_email.

After two hours of troubleshooting, I narrowed down the problem. Essentially, ActionMailer was detecting that starttls was enabled in the exim config on this system, and even though I had turned off "tls" explicitly with :tls=>false (better example in a moment), I also needed to turn off "enable_starttls_auto".
Here's what I wound up with for smtp_settings:

ActionMailer::Base.smtp_settings = {:domain=>"(client domain here)", :port=>25, :tls=>false, :address=>"localhost", :enable_starttls_auto=>false}


You can play with the Rails environment pretty well, with this method; you’re setting up a new method for teh ActionMailer class, and then trying to deliver. And you can update the global environments. That doesn’t require a service / app restart. What does require that restart is when you make those changes in the config files.

I put parent classes to work for me in what I thought was an interesting way. Most of the time when I’m writing a PHP class out, I include a db property (which is actually a reference to a preinstantiated $db object) and a _log method, which appends to a file some debug output. Then I can define DEBUG somehow and if we’re debugging, then output a variety of things. It’s usually “time|memory usage|(message)\n”. Each time I build a new class, I’m adding these things.

It finally filtered my old reptilian brain that I could use an base class to define these and then I’d have them in the class without having to rewrite the thing.

So, my base class looks somewhat like

class Thing {
var $db;
function __construct(){
global $db;
$this->db =& $db;
}
function _log( $input ){
$input=trim($input);
if ( strlen( $input ) == 0 ){ return self::_log( "_log called with empty input"); }
$fh=fopen("/tmp/debug.log", "a");
if ($fh ){
fwrite( $fh, "$input\n");
fclose( $fh );
}
return strlen( $input );
}
}


Hope that gives you some ideas.

By “Social Verbs,” I mean how users of your social website “approve” of each other’s posts. Obviously, Facebook has the Like button (and they’re adding more). Two sites I’ve been using lately have switched to “give props” (Fitocracy) and “Healthy” as in “I find this healthy” (Runkeeper).

I can see why they chose different verbs, and I agree that it’s important to distance a site from Facebook (conceptually, although it’s also important to bring it closer to Facebook, it has a wide audience and they’re doing something right). However, “giving props” works very well on an instant thing (giving props for lifting 200 pounds), but “finding healthy” – I don’t think it works as well.

Pedantically, “Healthy” refers to a person, while “healthful” refers to a thing the person does (a healthful dinner). But more important to my point, “healthy/healthful” refers to an arc, a path- starting the Couch to 5K and dropping 20 pounds, that’s healthy. Running half a mile once a month, not so much.

Also, the voice is broken. I “like” your post on Facebook. I “give props” to you for your lift. I “find healthy” your run. Just doesn’t work.

I think leaving it as “like” would have been better. In fact, my “liking” posts has gone down on Runkeeper just because of what I’m mentioning above, which has the opposite effect from what the Runkeeper guys want. All social sites want to increase social actions. Choose your actions wisely, or people won’t be doing them.

I am the first to admit that when I’m building a website for someone, the last thing I do is work out the design. Which is strange, because I usually consider myself to be pretty evenly balanced, left-brain, right-brain.

But when you’re building something for someone, the functionality; what they want to happen, that’s resolved. “We want a website for Portland runners to join up and follow scheduled programs, for training for the Portland Marathon.” Ok, done, with a facebook integration, some database tables, some forms. But “we want it prettier than a 1992 website” — now you’re talking subjective judgements. And who’s going to say whether my idea of “prettier” is what you have in mind? Everything from the color scheme to the shapes of the icons is dangerously subjective.

You can put twenty hours into a project, adding gradients, icons, a color scheme, some ajaxy effects to load a user’s information into a little window. And then the client sees it and is going to say one of three things; “Hey, that’s great” or “Hey, not what I had in mind, but let’s change to a black and tan layout” or “It’s obvious that you’re not a designer” (that last one actually happened to me). And then what do you do with those hours I put into the project to “make it pretty” ?

However, if you do no design stuff and leave it completely rudimentary, the situation is like a builder who puts up studs and drywall but doesn’t bother painting. Who’s going to call that job complete? Not me. I’d be rather angry at a contractor who did that.

I think the solution might be one of two things. First, do the design part first- this helps the client see “a finished site” and maybe they’ll stop asking when it’ll be done. Secondly, work with a designer friend who is willing to help you out (for a fee). You can either subcontract the work to them (which I do not prefer) or you can connect the client to the designer directly which will get you out of that discussion.

However, I think you should always do some design work on a site, and you should make sure to build it into your invoice for the client, unless your designer friend provides you with all the things you need.

I found a neat plugin – WordPress Backup to Dropbox. It dumps your database to your /wp-content directory and then copies the entire directory tree to your dropbox.com account.

It’s also neat because it uses oauth; it doesn’t store any usernames or passwords, it just requires that you go over to the dropbox site and authorize it. Then you can set a day and time for your site to be backed up and how frequently you want it. There’s even an option to start it now.

Since your web host probably kills off long running scripts, this backup plugin monitors the status and if it appears to go away, it’ll try to restart the process. It’s pretty slick.

I saw this in Craigslist today:

(snip)
I am increasingly asked to design WordPress websites, and asked to make them so they are easily findable on the first pages of a major search engine like Google, Yahoo, Bing, etc. In fact, just today, I got an inquiry on this very matter. The client wants me to redesign their existing website using WordPress, so I can show them how to update and maintain it, AND they want people to be able to find the website on the first pages of a major search engine. …Two weeks ago, was the last inquiry I got on this very matter, so there is potential for work on 1 or 2 websites a month, if I can resolve this, potentially. …I would love to partner with a mentor webmaster who could either take on that end of the websites or could instruct me. I’m open, and would like to resolve this ASAP. …HELP ME!!!!
(some more snipped)

I’m not a SEO guy; I’m a web programmer (among other things) with some ideas about SEO.

I didn’t send them an email offering my elite services as a SEO guy to help them get first page results. I started off by pointing out that the first thing they needed to decide was the keywords they wanted to rank for– and that “camera lenses” would be a lot harder to rank for than “used canon lenses in Portland.” So the first step would be to define some better keywords.

And for on page SEO, frankly, you could do worse than WordPress- that is, with some SEO plugins, good choices of keywords, pretty URLs, you know, all that stuff a good webmaster would set up for you.

However, you also need to look at the kinds of content you have, the quantity and quality of links to your site and even the responsiveness of your web server.

In a handful of nutshells, you need quality posts that are over 300 words long, using but not overusing your keywords. They should be the kinds of posts that people who search for what you’re offering are looking for, helpful or interesting, or whatever.

You need “some” links. You can’t have an exact number because it’s not an exact science. If they’re all from hack blogs, you might need thousands of them. If they’re from solid domains with some personal accountability, you might need hundreds. But don’t run out and buy them all in one bunch, you want them to be gradually built up.

And starting last year, Google started factoring in the response time of your server; a more responsive server gets better results. Pages loading in a couple of seconds get better results than pages that take a minute to load.

However, keep in mind that none of these are really solid rules; they are differently weighted tests that you could consider as you go through a SEO offering. To add to that, Google (and probably Yahoo and Bing, but they’re less well publicized) changes its ranking algorithmic about once a year. So you might find that your carefully tweaked and optimized WordPress site sits at number seven for three months and suddenly slides to thirty three, and there were no changes.

What I try to tell people (but I believe most people don’t hear me) is that the search engines are trying to help people find stuff. They’re not “screwing the webmasters” or “being completely obtuse” or even “gaming the systems.” Search engines want to be used to find stuff. So make your stuff easy to find and worth finding, let the search engines do their dances, and just do your best in terms of making quality stuff.

All that being said, if you need a good Search Engine guy, talk to my friend Chris Bigler. I’ll post his email or something when I have it (should be Real Soon Now).

Hand crafting your site’s HTML for the best mobile experience can be a real pain in the neck.

Mobile Moxie’s Page Code Grader can help lighten that burden. It’s pretty straightforward to use; put in your site’s URL and pick a user-agent, and then their script will get the site and run a bunch of checks on it. They have a bunch of different UserAgents paired with the page layout images so you can get a rough idea of how your inspected page would look on that device.

Like most tests on the web, however, you should take this test as a guide and not as a rule. When I ran this test on a mobile site, I was surprised to get dinged for the use of tables (this particular site doesn’t use tables) and dinged for style tags (this particular site might have style tags, but I don’t think so). And I’m not sure how to get a 1 pixel border without specifying the border width in pixels.

However, there were some good things it caught; it steered me toward the use of handheld.css (as opposed to the style.css file I normally use; apparently the name is important) and it reminded me to use relative measures rather than the absolutes I had previously (I had a line height of 24 pixels, and changed it to 2em). It correctly found that my images are nice and small. It liked my text-buttons (as opposed to some unwieldy image buttons).

Overall, I give this tool a B. It’s in my list of tests to run, but it’s not the last one I’d use.

If you’re having a problem with your image sizes, give Dink a try: Dink does resizing of images for mobile devices, on the fly, so you don’t have to. And it has drupal and ruby on rails plugins.