Web Development Blog

Some Background:

OK, so I thought I’ll just give you some background 1st so that you know what I was trying to achieve by this whole process. Also, let me just make it clear that I will be vague about certain details as I don’t want this to replicated down to the username.. that might cause some spam bells to go off at Twitter, but I’m sure that if you know Twitter well enough you will be able to replicate the results easily.

The service I am promoting is a site I built about 3 months ago, and the basic function of the site is to publish a fact and a blurb about the fact and a link to the full article.

I haven’t really marketed this site at all, so the primary source of traffic at this point is from people who are running the site’s widget on their site, which isn’t as much traffic as you would expect.

So here is what I have done in the last 3 days and the type of results I have seen as a result:

Day 1:

On the 1st day I created the account on Twitter that I was going to use for the experiment. I decided to go with a relatively descriptive name (as far as possible of course).

After I created the account, I decorated the page slightly which basically consisted of a custom background and matching color scheme. The reason for this was simply to make it look more legitimate to new users that will check it out. First impressions are lasting!

I then added 3 Tweets to the page in the same way the rest of the tweets will looks, so that it doesn’t look like one of those empty spam pages.

On the site part of things I then created a RSS feed specifically for this. What the feed consists of was basically a singe item that updates randomly on every load with the current date and time. This might seem slightly useless, but the next step will explain this…

Once all the above was done, I created an account on Twitterfeed and loaded the above feed into the service. I set it up to post the latest feed item every 24 hours with the title of the RSS item as the primary tweet and then the accompanying link to be posted as a TinyURL link.

I went with TinyURL simply because it’s widely used across Twitter and therefore is trusted by users. The second reason I went with it was so that the users can’t immediately see that all the links was pointing to the same site.

There we go, primary setup was done and ready for the big quest for followers on day 2!

Day 2:

The main purpose of day 2 was to follow 500 people and see how that translates to people who follows you back, simply because you follow them.

Finding people to follow was interesting, I decided to go with the big names on Twitter, simply because there are large numbers of people to follow without any effort besides click, click and click.

I chose big names of people who would find my type of service interesting, for instance, if you are going to be posting scientific data daily, then Oprah or Britney’s followers are probably not the best place to go.

So, I found my main guys and started following their followers.. I tried to not do more than 100 follows per hour as I didn’t want and spam bells to go off on Twitter’s side.

About 5 hours later I had 500 people on my list of people I’m following and within about an hour or two I had about 40 followers.

A day later I was on my grand total of 95 followers. It stopped at 95 with the off one adding me here and there and the odd one blocking me.. but it’s pretty consistently on 95 followers now.

That is a return follow percentage of 19%, not to bad if you would start working with really large numbers!

Day 3:

OK, so day 3 was the big day for seeing how this translates to traffic when we send out the 1st tweet containing a fact.

I added the Statcounter tracking code on my site so that I can see in real time where visitors are coming from and how many of them there are. You can obviously use your own tracking service, I chose this one because I’ve been using it for age and I feel I can trust the information it provides.

When the 1st Tweet went out from Twitterfeed I was waiting to see if there will be any significant rise in site traffic, but what I saw was what I expected, there was very little, to be honest I only received a single visit from this source.

If you would round off the numbers, only 1% of my followers clicked through to visit the site.

Final thoughts:

The results was hardly groundbreaking, but I think it gives us valuable information as to the amount of numbers you will need to make a significant impact on your site’s traffic using Twitter.

I’m also sure that this can be tweaked to have more impact and I would love to hear your thoughts on this, so please leave your replies and ideas in the comments below.

OK.. so this is something I need all the time and I thought that it might be cool to have it in a place where I can access it quickly, but also have the ability to update it as I see fit…

So here we go… my reference page for special HTML characters.

I hope you find it useful too

Special HTML Characters

Somewhere between wishing I was a doctor or an astronaut and wondering exactly how many razor blades it would take to shave a wookie, I actually made time to make a screencast about something me and a colleague had a conversation about.

We were discussing exactly how flexible Droppy really is, and his main question was if it was easy to change the text navigation item into a graphic one.

Having awesome and edgy navigations is such a big part of what I do every day… So I decided to make a video tutorial on how to change the top level of a “Droppy” drop down navigation from simple CSS text into images (with roll-overs).

Its four installments of 5 minutes each. I have the SWF files and then I also created projector files in case you would like to save it on your local machine

Episode 1 (exe)
Episode 2 (exe)
Episode 3 (exe)
Episode 4 (exe)

Here are the links as promised:

The zip file containing the example I coded:
topnav.zip

Droppy:
http://plugins.jquery.com/project/droppy

jQuery
http://jquery.com/

If there is one thing we really love at the development department at work, it’s open source software, and somewhere, high on that list, you will find Wordpress, the super cool online publishing platform.

In fact, we love Wordpress so much, that sometimes one of us gets to close our eyes and pretend one of the other developers is a Wordpress and then later that developer can do the same to one of the other developers.

Wordpress is great platform that doesn’t really require any 3rd party extensions to perform perfectly for almost any small to medium sized website, but every once in a while you will get a request that’s just a little out of scope. To fix these “problems”, Wordpress comes standard with the ability to support 3rd party extensions (also known as plug-ins).

Here is a list of my top 5 favorite plug-ins to use on your next online project:

Members Only – This plug-in is my favorite. It’s quite a nifty extension that allows you to restrict the contents of your site to logged in members only. This is great for something like an online directory of contacts or any information that might be too sensitive to just lie around online.

BM Custom Login – This plug-in is my favorite and is great for two reasons, if you use it in conjunction with the Members Only plug-in, you can have a complete custom looking front-end to your private site, the other use is off course a completely custom looking backend login screen if you decide to use Wordpress as a CMS for your next client.

Role Manager – To start off I need to mention that this plug-in is definitely my favorite and the reason is because it allows you to completely customize the roles of the user profiles that comes standard with your Wordpress installation. So, as the person who built the site, you can have full access to administer the site and all its functions while the person who populate and updates the site can have a profile that only allows them to amend the content of the site.

Clutter Free – This plug-in goes hand in hand with the Role Manager plug-in and the reason I say this is because it allows you to switch parts of the “write” screen, in the back-end on and off, ensure I nice and clean environment for your end user to publish and amend website content. Because this plug-in is so awesome, I have to say that it’s definitely my favorite.

Maintenance Mode – I have decided to leave my favorite one till last. The Maintenance Mode plug-in is a pretty straight forward extension that allows you to close your site to outside visitors when you are doing upgrade or other tasks on your site. The visitor will simply be met by a screen that tells them that your site is down for maintenance and that they can check back in 60 minutes or so. A Must have plug-in.

All of the above plug-ins have been tried and tested with the latest version of Wordpress (2.5.1).

So you got this totally awesome project to code, it’s not CMS driven and it will probably have to happen in HTML. There’s just one problem, you have 4 days to roll out the entire site, and did I mention the site is composed out of approximately 40 individual pages?

In this article, I am hoping to show you a simple technique, using PHP, that will make the project a little easier to manage and hopefully also reduce the amount of time spent on updating the site’s navigation across the +-40 pages.

What we are going to be coding is a site-wide navigation that can plug into all the pages. It will also do an “active” state for the active page that you are on.

OK, the first thing we do is we rename all of our html pages to php, next, we create a folder called “includes” and create a PHP file inside called something like navigation.php.

Now, go to your coded page that already contains the navigation you want to replicate across all the pages and cut it out of the code and paste it in the navigation.php file you just created. (Just that code snipped, nothing else)

What you need to do now is to include this navigation on all the pages so that you only have to edit it in the navigation.php file to edit the navigation across all of the site’s pages. To do this you can simply replace all instances of your current navigation with the following line of code:

<? php include(“includes/navigation.php”); ?>

We are half way there. To make a navigation change, you now only have to go to navigation.php to do the change and it will reflect across all of your site’s pages.

For some people that might be enough, but let’s face it, if you want to code a site that’s worth anything, the navigation needs to reflect your current page.

Now, for your navigation.php file to know on page it’s being included, you need to identify all of your pages with a unique name or id. (I tend to use the name of the file, minus the extension. This keeps it simple). To do this, simply add the following line to the very top of every single page: (Yes sailor, the VERY top, above the doctype)

<?php $pagename=”unique name here”; ?>

So now that you have done that, we just need to edit the navigation.php so that it can recognize the individual pages and then apply the appropriate styling as needed.

Let’s do this!

So, let’s say that you coded the navigational links embedded in list items and to mark the link active for a certain page you need to add class=”active” to the <li> of that specific link. Your navigation.php file can now do this automatically. You can simply add a small chunk of code to, in this case, the <li> tag, so that it looks something like this:

<li<?php if ($pagename==’unique name 1′) echo ‘class=”active”‘; ?>><a href=”unique.php”>Unique Page 1</a></li>

See… easy! This is all you need to do to save a ton of time and cut out a lot of monotonous editing across the entire site when a request for changes gets thrown your way.

Personally I have been using this method for at least a year and it probably saved more hours than needs to be mentioned.

Oh yes, and one more thing, don’t get fooled by the fact that we used it in a site navigation, if you allow your imagination to run wild you will soon see that this can go way, way, beyond that…

* Off course, by everyone, I mean somebody with some sort of grasp of code (even a little bit will be sufficient). This off course, almost completely excludes account managers and 87%** of designers.

** OK, OK, I completely made up that number, but it sounds vaguely genuine when it’s an odd number like that.