Archive for the ‘Website building’ Category

How to point 1and1 domain to HostGator hosting

Friday, May 27th, 2011

Using HostGator for your web hosting, and 1and1 for your domain name is not too difficult to set up.

Configure HostGator so it knows about the domain name

First of all you have to make sure that your HostGator hosting account knows about the domain name. If you have already added the domain to your account by either setting it up as the primary domain or as an addon domain then you need do nothing further at the HostGator end.

If you haven’t done this then log into your HostGator cPanel. Then in the Domains section click on Addon domains.

hostgator cpanel

Enter your domain name and all the other details you need and click on Add Domain.

hostgator create addon domain

Configure HostGator so it knows about any email addresses

Whilst you are in the HostGator cPanel configure any email addresses for the domain name. Once you point the 1and1 domain to HostGator, 1and1 will no longer be responsible for collecting email to this address. HostGator will now have control of the email, so setting up any email boxes in advance to save you from losing any emails.

Configure 1and1 to point the domain to HostGator

Login to your 1&1 Control Panel. Click on Domains.

1and1 domain settings

Select the domain name you want to point to HostGator and click Edit DNS Settings from the DNS pull down menu.

1and1 edit domain dns settings

You’ll get a warning saying the following.

Please note:
Full functionality cannot be guaranteed if you choose DNS settings other than the original 1&1 settings, such as e-mail and web space. Domains can be (re)set to 1&1 default settings by clicking Reset

This means that if you change the name servers to point to HostGator then 1and1 will no longer be hosting your website, or your email. You will have to configure both your website and email via HostGator from now on.

Select the option for ‘My name server’.

1and1 point domain to hostgator hosting

Then enter the HostGator name server names (there should be two of them) into the boxes. You can find the name server names on cPanel.

hostgator name servers

Then confirm the settings on the 1&1 Control Panel. You’ll get a message saying it will take some time for the settings to take effect. This could be 24 hours, or even more depending on what DNS server you are using. After changing the settings keep checking the new domain so you spot when the changes are live you for. But beware – just because you can see the new site doesn’t mean everyone can. Leave the old site in place for at least 48 hours so you can be sure that all DNS records have updated.

Advanced topic – minimising downtime

If there is already a live website at your original 1and1 hosting then you might have to think about copying the files over to HostGator before updating the domain to minimise any website downtime. This is fairly easy to do if your website just contains static HTML files.

If however you are moving a dynamic website there is a lot more to think about.

Whilst the DNS settings are propagating some people will see the website from the 1and1 hosting, and others from the HostGator hosting. What if someone posts a comment on the 1and1 hosted site, and someone else posts on the HostGator site? It could be a nightmare to merge all the comments back together. You may therefore want to consider setting the old (1and1 hosted) site to read-only by disabling all new comments on it.

A further difficulty is that moving a dynamic site requires more than just moving the files. You will have to create new databases, import the database tables and maybe customise .htaccess files or other config files if the configurations need to be different between the two hosts (which is often the case).

One way to work around this is to set up the new version of the site in full at the new hosting provider using a secret dummy domain name. You can register a domain just for this purpose if you don’t have a spare one that isn’t in use. Just make sure not to tell anyone about it, and even better protect access to it to just your IP address using a .htaccess file.

There are a lot more complexities involved in moving a live dynamic site from one host to another. If you want more information about moving a WordPress blog between hosts have a look at http://codex.wordpress.org/Moving_WordPress.

How to test your website in ie6

Friday, May 27th, 2011

Although Internet Explorer 6 is heavily out of date, a large number of people (especially in companies) are still using it. For example on one of my sites I still get over 1000 visitors a month using ie6 (as of 2011).

If you don’t have a computer or OS old enough to have ie6 installed it can be hard to find a way to find out what your site looks like in ie6.

There are lots of online services that can test your site in different browsers, however many of them are commercial, and most of the free ones have many hour waits between submitting your request and getting the rendered ie6 image.

Fortunately there is IE NetRenderer which lets you get screen shots of your site running in ie6 (as well as ie5.5, ie7, and ie8) in just a few seconds. Here is what one of the pages on this site looks like when rendered by IE NetRenderer.

ie6 website render

As well as standard rendering options, it has some very useful options so you can produce a mixed image using two browsers. For example you could compare the page in both ie6, and ie8.

This image shows the kind of output you get. Both Internet Explorer renders are overlayed on top of each other. The closer the images are to each other the less differences there are between browsers. You can see here that there is only a 1-2 pixel difference between both browsers on this page.

ie6 ie7 mixed website render

Ad Injection plugin for WordPress

Monday, December 6th, 2010

Ad Injection is a free WordPress plugin that injects any kind of advert (e.g. Google AdSense, Amazon Associates, ClickBank, TradeDoubler, etc) into the existing content of your WordPress posts and pages. You can control the number of adverts based on the post length, and it can restrict who sees adverts by post age, visitor referrer and IP address. Adverts can be configured in the post (random, top, and bottom positions) or in any widget/sidebar area. There's support for A:B split testing / ad rotation.

ad injection plugin for wordpress 1 450

PayPal – The safer, easier way to pay online.

Download

Download Ad Injection plugin for WordPress for free from this link. Or just search for Ad Injection from your WordPress install and WordPress will automatically install it for you.

Features

Automatic advert injection

The ads can be injected into existing posts without requiring any modification of the post. The injection can be done randomly between paragraphs, and there is an option to always inject the first advert at a specified paragraph (e.g. the first or second). Randomly positioning the adverts helps to reduce 'ad blindness'. Two additional adverts can be defined for the top and bottom of the content. Widget adverts can be defined as well for your sidebars.

ad injection plugin for wordpress 3 450

Widget support

Widgets can be added to your sidebars, or other widget areas on any pages. The same ad display restrictions that you setup for your other ads will also apply to the widgets.

Ad rotation / split testing

You can define multiple adverts for the same ad space which are rotated according to the ratios you define. Works with random, top, bottom and sidget/sidebar ads.

Ad quantity by post length

The number of adverts can be set based on the length of the post. It is a good idea for longer posts to have more adverts than shorter posts for example. Adverts can also be turned off for very short posts.

ad injection plugin for wordpress 4 450

Ads on old posts only

Adverts can be restricted to posts that are more than a defined numbers of days old. This prevents your regular visitors from having to see your ads.

Category, tag and post type filters

You can configure the adverts to only appear on specific categories, tags, or post types, or block the adverts from specific categories, tags or post types.

Search engines only (dynamic feature)

You can specify that ads should only be shown to search engine visitors (or from any other referring websites) so that your regular visitors (who are unlikely to click your ads) get a better experience of your site. You can define which search engines or any other referring sites see your adverts. A visitor who enters the site by a search engine will see ads for the next hour.

Block ads from IP addresses (dynamic feature)

IP addresses of people who shouldn't see your ads can be defined. These could be the IP addresses of your friends, family, or even yourself.

ad injection plugin for wordpress 2 450

Not tied to any ad provider

The advert code can be copied and pasted directly from your ad provider (Google AdSense, adBrite, ClickBank, etc) which will help you to comply with any terms of service (TOS) that state their ad code may not be modified.

Flexible ad positioning

Easy positioning options are provided for left, right, center, float left, and float right. Extra spacing can be set above and below the ad. Or if that isn't flexible enough, you can write your own positioning code using HTML and CSS.

You can specify a specific paragraph for random ads to start from, or if you need per-post control of the random adverts you can insert tags into the post source to say where the adverts should start and end.

ad injection plugin for wordpress 5 450

Inject PHP and JavaScript

As the plugin will inject whatever content you like into the page you can write your own ad rotation or a/b split testing code for the ads you inject. PHP code can be automatically executed.


Full documentation is available on the WordPress Ad Injection page.


If you do get any errors please use the 'Report a bug or give feedback' link on the plugin to send me the error details.

Non–blocking Facebook and Twitter buttons

Friday, November 19th, 2010

On all the posts on this blog (like on most other websites you probably visit) you’ll see buttons to ‘Like’ a post (from Facebook) and to ‘Tweet’ about a post (from Twitter or TweetMeme). These buttons are very popular but if you use the iframe versions of the buttons (which are easy to install) you may have noticed a problem.

twitter facebook tweetmeme logos

If either the Facebook, Twitter, or TweetMeme servers don’t respond quickly enough when your browser requests the page content, your page loading may well block. On this site I’ve seen the Facebook Like button delay the page by 1-3 seconds. The bad part about the type of blocking is that in most browsers the rest of the page doesn’t render whilst the browser is waiting for these 3rd party servers to respond. There’s a more in depth explanation of why this is so on Steve Souders’ High Performance Web Sites blog.

Browsers usually start loading resources in the order that they are specified in the HTML. Below is a screenshot of one of the pages on this site (this one in fact). The red line shows the order of loading of the page. This order is typical for blogs.

rml page load order facebook twitter

If you place the social bookmarking buttons before your content then the problem is particularly noticeable as they can block your whole content from loading. During which time your visitor may decide to go elsewhere.

Is there a solution? Yes there is a well understood solution to this problem. Simply load these externally hosted buttons after your content. Here’s how I did it on this site.

Use a div to reserve space for your buttons

You should reserve the correct amount of space for your buttons. If you don’t you’ll cause the page to be re-rendered once the buttons are inserted.

<div class="socialbuttons" style="width:450px; height:28px; text-align: top;">
</div>

In my case I’m including the compact Facebook like button which is 25 pixels high, and either the TweetMeme button (20 pixels), or the Twitter Tweet button which is also 20 pixels high. More about how I decide on which Twitter button to include later.

For this blog I’m including the buttons at the start of my content, and at the end. If you are using WordPress you could add the div to your content either directly in the template (single.php) or by using a plugin such as PostPost.

I’m including the top div in the template, and the bottom div using PostPost. The reason I’m using PostPost for the bottom div is because this plugin gives itself a priority of ‘1’ which means that it inserts the div before most of my other plugins insert their content.

User JavaScript to add the Facebook/Twitter buttons after the content has loaded

You’ll notice that the div has the id ‘socialbuttons’. This allows us to easily find the element and insert the social bookmarking buttons after the content has loaded.

Here is the WordPress specific JavaScript that I’m using. I add it just before the closing </body> tag. For WordPress this means editing the footer.php template.

<script  type='text/javascript' language='javascript'>
<!--
var permalink='<?php echo urlencode(get_permalink()); ?>';
var socialhtml='<iframe src="http://www.facebook.com/plugins/like.php?href=' + permalink + '&amp;layout=standard&amp;show_faces=false&amp;width=300&amp;height=25&amp;action=like&amp;font=arial&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:300px; height:25px; display:inline;"></iframe>';
<?php if (new_twitter()) { ?>
socialhtml += '<iframe allowtransparency="true" frameborder="0" scrolling="no" src="http://platform.twitter.com/widgets/tweet_button.html?url=' + permalink + '&via=reviewmylifeuk&related=reviewmylifeuk&text=<?php echo the_title(); ?>" style="width: 130px; height: 20px;"></iframe>';
<?php } else { ?>
socialhtml += '<iframe src="http://api.tweetmeme.com/button.js?url=' + permalink + '&style=compact&source=reviewmylifeuk&b=2" height="20" width="90" frameborder="0" scrolling="no" style="border:none; overflow:hidden; display:inline;"></iframe>';
<?php } ?>
var divs=document.getElementsByTagName('div');
var divcount=divs.length;
for (var i=0; i<divcount; ++i) {
	if (divs[i].className=='socialbuttons'){
		divs[i].innerHTML=socialhtml;
	}
}
//-->
</script>

This JavaScript works by find all the div tags with the class ‘socialbuttons’ and then inserting the Facebook and Twitter HTML inside the div tags.

I’ve highlighted in red my Twitter account name. You’ll want to change these values to your own Twitter account name. If you aren’t using WordPress you’ll need to replace the get_permalink() function with something that correctly encodes your current page URL.

You may be wondering what the new_twitter() function is.

PHP to select TweetMeme or Twitter Tweet button

TweetMeme is handing over the Tweet button to Twitter. As of July 2010 the recommended button to use (recommended by both TweetMeme and Twitter) is the official Twitter one. Unfortunately the Twitter Tweet counts will only be correct for articles posted after July 2010. Therefore for the moment I’m using the TweetMeme button for articles posted before July, and the Twitter one for articles posted after.

Here is the WordPress specific PHP that checks if the current post is after July 2010 (you could make it a one-liner if you like).

function new_twitter(){
	$twitter_switchover_date = strtotime("2010-07-01");
	$post_date= get_the_time('U');
	if ($post_date > $twitter_switchover_date) {
		return true;
	} else {
		return false;
	}
}

If they ever remove the TweetMeme button completely it will be very easy with this code to change all the Twitter buttons to be the official Twitter ones.

Including hashtags with the TweetMeme button

The old TweetMeme button had the option of specifying hashtags for the Tweet. You can add this in as well if you want. You’ll need to write a function to get the hastags (e.g. called something like get_hashtags()), and include it in the TweetMeme URL.

You can find code for constructing the TweetMeme hashtags in the TweetMeme plugin. Look in tweetmeme.php for the ‘// append the hashtags’ section.

If you manage to create your get_hashtags() function you can replace the TweetMeme line in the JavaScript with.

socialhtml += '<iframe src="http://api.tweetmeme.com/button.js?url=' + permalink + '&style=compact&source=reviewmylifeuk<?php echo get_hashtags() ?>&b=2" height="20" width="90" frameborder="0" scrolling="no" style="border:none; overflow:hidden; display:inline;"></iframe>';

(again don’t forget to replace my Twitter account name with yours!)

Does it make a difference?

From my experience of using this code it definitely makes a difference. The annoying delays (caused mainly by the Facebook Like button) have gone. The button still sometime takes several seconds to load, but at least it isn’t blocking the rest of the page.

More info on how to customise the buttons

If you want to customise the buttons have a look at the developer documentation for each one.


Proof that Alexa rankings can be very inaccurate for small websites

Thursday, July 29th, 2010

Here is a comparison of the actual viewing figures for this site (as recorded in Google Analytics), against the values that Alexa reports.

Alexa vs Google Analytics page views

This is a fairly small blog, getting 600-800 page views per day. If you too have a website which is of a similar size you might be interested in just how wrong Alexa’s statistics can be. Here is Alexa’s estimate as to how the number of page views I’m getting has changed in the last three months (snapshots all taken on the 15th July).

alexa page views

Looks pretty amazing right? A 2420% increase in page views in three months. But all is not as it seems. Here are my actual page views from Google Analytics (same three month period). You can see the actual figures show a very gentle increase in page views.

google page views

Alexa operates by sampling data from the people who have installed its toolbar, or who have installed (or had installed for them!) some other piece of software which sends data back to Alexa.

The percentage of internet users who have Alexa software on their computers is small so the data is subject to anomalies, especially as the website gets smaller. A large website such as Facebook or MySpace probably gets ok results from Alexa as there will be thousands of people browsing these sitse who have the toolbar installed. But the smaller the site, the bigger the potential for the results reported by Alexa to be out of sync with the actual results.

Alexa vs Google Analytics page views per person

So why the huge reality vs Alexa distortion for my site? I’ll come to that later. Next let’s looks at another graph. This is how Alexa thinks my page views per person is doing.

alexa page views per user

Pretty impressive! The page views per person has gone from 1-2 all the way up to 30 pages viewed per user. If that were accurate it would mean that people really love reading what I write! But unfortunately my blog isn’t quite that engaging. Here are the real figures. Each of my visitors looks at about 1.3 pages. That figure has remained fairly flat over the last three months.

google page views per user

Alexa vs Google Analytics visitors per country

Here is my final set of figures. This is where Alexa thinks most of my visitors are coming from.

alexa percent traffic by country

You can see from their figures that they think most (74%) of my visitors are in Japan. It is vaguely plausible as I do have quite a few Japan related postings on this site. However it isn’t accurate. Here are the real figures.

google percent of traffic

You can see that only 1.4% of my visitors are in Japan. This largest percentage of viewers is actually from the UK (44%), but Alexa only believes that 4.5% of my viewers come from the UK.

So why is Alexa so badly wrong?

What is causing Alexa to be so badly out of sync from reality? I am pretty sure I’ve worked out the reason. I believe that the massive inaccuracies are the result of a single person. Me.

Not on purpose, I did it entirely accidentally. But it is interesting that one person could cause the perceived page views of a 600-800 page per day blog to jump 2420% in three months. It is also interesting that one single person could accidentally cause the Alexa traffic rank to jump from about 600,000 to 200,000 in such a short time. And it is impressive that one single person could cause Alexa to think that 74% of visitors are from Japan when in fact only 1.4% of them are. Also that I could cause the average page views per person to go from 1-2, all the way up to 30ish.

How did I (accidentally) cause Alexa’s figures to be so wrong?

There is one main cause of this massive misreporting of figures. I installed the Quirk SearchStatus extension for Firefox. This extension add some small items to your status bar at the bottom of the browser. They can show the Google PageRank for the web page you are currently on, and they can show the Alexa traffic rank for the website you are on.

But the extension doesn’t silently report the statistics. It actually affects the Alexa traffic rank statistics. As you are browsing where you go will now be recorded by Alexa.

In my case I spend a lot of time on my own blog. It is WordPress blog so I need to access it to put up new posts, edit posts, check posts, moderate comments, and install/configure new/updated plugins. In a typical day this could easily generate another 30-50 page views of my blog that are reported to Alexa.

It would seem that although all my page views are coming from the same IP address, they are still able to make Alexa think that my blog is seeing a huge surge in traffic.

The timing is right too. The time I installed the plugin matches the time I started seeing this huge surge in Alexa rankings. And that’s not all. A short while after installing the plugin I headed to Takamatsu in Japan and continued working on my blog from there.

The fact that I had moved from the UK to Japan caused caused Alexa to think that most of my visitors were now coming from Japan.

Almost all of this was caused by me accessing my WordPress blog in a normal way whilst having this Firefox extension installed.

What it shows is how inaccurate the numbers can be for small sites such as mine. The number of people whose browsers report statistics to Alexa is sufficiently small that a single person can seriously skew the data.

So look at Alexa’s statistics if you really want to. But remember that unless you are looking at the stats for a huge site, they may well be way off the mark.

Compressing HTML and PHP files on 1and1

Friday, July 9th, 2010

1and1 doesn’t have mod_deflate or mod_gzip enabled on its home or business shared server packages which means that many of the usual .htaccess tweaks to compress your web pages won’t work. Here’s something very simple tweaks that will work with 1and1, and with other hosts too.

Set up your .htm and .html files so that they are parsed by the PHP interpreter by adding this one line to your .htaccess file.

AddType x-mapp-php5 .html .htm

Then create and upload a php.ini file to your websites root directory. If you are using WordPress then this should be the same directory as the one where wp-config.php is.

The contents of the php.ini should be as follows.

zlib.output_compression = On

This line causes PHP files to be served as compressed if the browser supports it. And as we have registered .html and .htm as being PHP files they will now be compressed.

You can test that the HTTP compression is turned on by using this simple HTTP compression checking tool, or by using the more comprehensive Page Speed add-on for Firefox from Google.

Here are the results from the HTTP compression checking tool showing that compression is now on, and that the home page HTML is being served using 76% less data. Note that this saving refers only to the HTML page, and not to any other images, style sheets, or JavaScript.

rml gzipped on 1and1

Increasing expiry time of images on 1and1

Another quick tweak you can make to your .htaccess is to increase the expiry time of your images, and other data files. This will result in quicker loading times for regular visitors as the files will stay in their browsers cache for longer.

Add this to your .htaccess. You can increase the expiry times if you don’t think those files will change.

#Increase cache time for resources

ExpiresActive On
ExpiresByType image/gif "access plus 2 weeks"
ExpiresByType image/jpeg "access plus 2 weeks"
ExpiresByType image/png "access plus 2 weeks"
ExpiresByType image/ico "access plus 2 weeks"
ExpiresByType text/css "access plus 2 weeks"
ExpiresByType text/javascript "access plus 2 weeks"
ExpiresByType application/x-javascript "access plus 2 weeks"

Use Google’s Page Speed add-on to verify that this has worked. Go to the Resources tab to see the headers for each individual file served from the HTTP server. Below you can see the current date/time, and that the expiry time is set two weeks into the future.

expires date for image

Caching and expiry changes combined

Here are before and after results for Google’s Page Speed tool of applying both the above changes to another of my websites. You can see that these quick changes give the website a small increase in score.

website score before

From 88 to 92.

website score after

This isn’t a big jump, but it may make a difference. I highly recommend you look at the other performance recommendations from the Page Speed tool, as it can give you loads of ideas for how to make your site faster and more responsive.

Redirect all but selected sub-directories using .htaccess rules

Friday, July 2nd, 2010

I have an old website which is almost defunct, and I wanted to redirect all the traffic from it to my new website – APART from a few selected directories. This is how I managed to get the redirects working using a .htaccess file.

For this example the directory containing the material that I don’t want to redirect is called ‘goodstuff’. The RewriteCond conditions are setting up the excluded directories (the exclamation mark means ‘not’).

RewriteEngine on
RewriteCond %{REQUEST_URI} !^/goodstuff/.*
RewriteCond %{REQUEST_URI} !^/goodstuff$
RewriteRule .* http://www.advancedhtml.co.uk/ [R=301,L]

The reason I have two RewriteCond lines is because the web address could either be written with the trailing slash or without. E.g. goodstuff/ and goodstuff are the same, but I use two lines to cope with both cases.

The first RewriteCond matches all files and folders within this directory. The second is only matching the directory name without the trailing slash added.

The RewriteRule is telling the web server where to redirect the traffic to. The traffic is being redirected permanently (301 code), and the L states that this is the final rule for anything that matches our conditions.

Here’s another way of doing it which works, but it isn’t as precise. It redirects all addresses which start with ‘goodstuff’. This means it would match all the files that the first example matched. But it could match others as well.

RewriteEngine on
RewriteCond %{REQUEST_URI} !^/goodstuff.*
RewriteRule .* http://www.advancedhtml.co.uk/ [R=301,L] 

As well as matching a /goodstuff and /goodstuff/ directory, it could also match a /goodstuffhere/ directory, and a /goodstufffile.html.

Joining photos together with ImageMagick

Tuesday, June 29th, 2010

In my posts I often have a need to stitch multiple photos together in a rectangular block. I prefer to have the photos stitched together rather than uploading them as individual images as this removes the need to lay them out (using divs, tables, etc). Plus the stitched together image size is smaller than the size of uploading individual images. This is the kind of image montage I’m talking about.

flowers stitched together with imagemagick

I always like to have them in a single row, sized to the correct width, with a small white space between the images. Previously I was doing this manually with Paint Shop Pro. Doing it manually takes a while (even when you know all the keyboard shortcuts), is error prone, and is boring to do.

And things get even more difficult if you have a mixture of portrait and landscape images as I’d have to resort to a calculator to work out what sizes each sub-image should be.

portrait and landscape joined with imagemagick

I’m no expert with ImageMagick but I managed to put together a script that can do the job automatically. This does it in three steps (three convert commands), but I’ve do doubt that someone who knows ImageMagick well could do it in one much more efficiently – please leave a comment if you know how. This is what it does:

  • Resizes the images to a maximum height of 768 pixels (this does assume that the height of all your images is over 768 pixels. If not you can adjust this value). This step sorts out the problem of images being in portrait or landscape. The images are then appended together with whitespace between them.
  • I chop off the extra bit of whitespace on the very right of the montage.
  • I resize the image to have a width of 450 pixels and save it back out into the same directory as the first image, ready for including on my blog.

I save the intermediate images as PNGs so that the result isn’t being JPEG compressed too many times!

Here’s the DOS batch file code. Some of the code is based on that from a recent post of mine on extracting the directory name from a file path.

goto :skip_functions

:setDir
if not %imgdir% == "" goto :EOF
set imgdir=%1
goto :EOF

:getDirectory
del %TEMP%resize.tmp
dir %1 > %TEMP%resize.tmp
for /f "skip=3 tokens=3" %%i in (%temp%resize.tmp) do call :setDir %%i
goto :EOF

:skip_functions

set imgdir=""
call :getDirectory %1

cd %imgdir%
del prout*.*
convert %9 %8 %7 %6 %5 %4 %3 %2 %1 -resize "x768" -background White -gravity east -splice 20x0 +append prout.png
convert prout.png -gravity east -chop 20x0 prout2.png
convert prout2.png -strip -resize 450 -compress JPEG -quality 85 %RANDOM%.jpg
del prout.png
del prout2.png

I’ve put a shortcut to this script in my Send To menu (type %APPDATA%MicrosoftWindowsSendTo into the Windows Explorer address bar to get to the folder containing the shortcuts).

I can then right click on whatever images I want to stitch together, choose the photoResize.bat option from the SendTo menu, and the stitching is automatically done for me, and the resulting JPEG left in the same directory as the images.

photo stitching context menu

There are some limitations which you could fix if you really needed to.

  • The script assumes that all the images have a height greater than 768.
  • It is always outputting to JPEG. It could be changed so that if all the images are in the same format, it outputs that that same format. E.g. stitching together 3 PNGs would output to a PNG.
  • I’m using three convert commands which I’m sure is very inefficient. I’ve no doubt this operation could be done with one command.
  • The order that the images are stitched together is not defined when using the Send To shortcut.


Visualising the Google PageRank scale

Friday, April 9th, 2010

Google’s PageRank is a scale from 0-10 that shows how well connected web pages are. Web pages with higher PageRank values have more quality links pointing to them. It is not a linear scale, it is a logarithmic scale.

People estimates that the logarithm base is between 5 and 10. Because it is a logarithmic scale it can be quite hard to visualise.

I’m going to try to visualise PageRank with some graphs. In these graphs I’m making the assumption that the log base is 5. The first graph shows the values from 0-10 on a linear scale.

pagerank 1 to 10 on log base 5

You can see that when the logarithmic scale is converted into a linear scale the difference between most of the lower numbers completely disappears. That is why these things are presented on logarithmic scales! I’ve added a few websites onto the scale so you can see where they are.

As most websites aren’t in the 7-10 range I’ve produced another graph showing just the values 2-7. I’ve made the graph very tall so you can see the difference between the values better. Again I’ve added a few websites onto the graph so you can see what kind of websites get the upper PageRank values.

pagerank 2 to 7 on log base 5

The above two graphs are making the assumption that the base of our logarithm is 5. Would it make much of a difference if it was 10? Yes it would make a huge difference.

Here is a graph comparing what the PageRank linear values might be for a log base 10 graph vs a log base 5.

log base 5 vs log base 10

You can see that it is not practical to plot multiple logarithms on the same graph, so it would make a huge difference whether the logarithmic base was 5 or 10.

As for whether PageRank really matters – it probably counts for less than most people think. The toolbar PageRank of one of my sites recently went from 2, to 0, up to 3 and back down to 0 again. During these changes I noticed no change in traffic. The actual page contents and TrustRank probably counts for much more than PageRank on most web sites.

What I’ve learnt after 100 blog posts

Saturday, March 27th, 2010

Today marks a significant milestone for this blog. After two and a half years I have reached my 100th post! I thought this would be a good moment to look back at what I’ve learnt from writing a hobby blog.

mini keyboard and cadbury sweets

Why I created this blog

I’ve been a hobbyist website builder for about 13 years now. I’ve created a mixture of technical and personal topics. These have always been static websites where each page was created individually, either using a HTML editor such as HoTMetaL, or by using hand written HTML templates. Each website tended to stick to a particular topic, and some of them have done moderately well, getting many hundreds of visitors each day.

I had an ideal for another website where I could write about miscellaneous topics that didn’t fit anywhere else. I registered a new domain name with 1and1, created some static HTML templates, and started writing some content. I soon gave up as I found that I was spending too much time on the mechanics of creating each page, rather than on the more creative writing aspect. I abandoned the idea for a year, and didn’t think much more of it.

Starting up

I began reading about blogs, and self hosted blogging platform like WordPress. I thought that my miscellaneous topic website might work if I used something like WordPress as the content management system.

At the time I was on a very basic web hosting package with 1and1 and I had to upgrade to a more expensive package that included MySQL database support before I could install WordPress. Once the web hosting was upgraded I had the basic blog up and running in a couple of hours. I registered the domain name reviewmylife.co.uk to host the blog.

The domain name is fairly self explanatory; I’d be posting articles that in some way related to my life. I thought there would be reviews (of hardware, films, and so on), but the name was generic enough to allow me to put any kind of content on the blog.

My very first post on 5th August 2007 was about setting up the blog on 1and1 (the company I use to host the site). It wasn’t a classic post, but it was a start. That month I posted a few other cheap posts, and also moved some of the content from my failed ‘miscellaneous content website’ over to the new blog.

You should think carefully before deciding to use a self hosted blog like WordPress. Self hosted blogs do require a fair bit of maintenance. At first it was a real pain as all the plugins and the blog itself had to be manually updated on a regular basis. As WordPress evolved it got easier as features such as one-click plugin updates, and then full one-click updates were added.

Over the years I’ve written many posts about the various issues I’ve had to solve with hosting my own WordPress blog on 1and1 such as configuring custom error pages, adding spacing round iframes, and adding a related posts section to each post.

As well as keeping WordPress up to date, you’ll have to dedicate time to customising it (if you want), and backing up your data (very important if you don’t want to risk losing everything). I’d recommend you backup your posts (doing a Tools->Export, and do a MySQL backup) every month. And backup before you upgrade the blog. New minor updates come out every month or two, and major updates seem to come out every three months.

Backing up your blog is very important as not only can you lose data from:

  • Your own mistakes.
  • Mistakes made by your hosting company.
  • Malicious hacking into your site. WordPress has had a steady stream of vulnerabilities being found and patched over the years.

The blog picks up

As time went on I posted more useful information. I got plenty of appreciative comments for my post warning about the Spanish lottery scam, and for a post explaining how to get documents certified cheaply.

The number of comments went crazy when I posted about my experiences of trying to get rid of clothes moths. To date I have 74 comments for this one post, many of them would make worthy posts in themselves. This post is an example of a seasonal post. Clothes moths tend to cause problems in the Spring, Summer and Autumn so these are the times when this post get visitors. The number of people looking for information on moths goes down a lot in the winter.

Getting feedback from other people is one of the most satisfying aspects of writing a blog. I find that when I post about personal experiences I get a lot more comments than if I just provide some information.

As well as the clothes moths post, the posts on my cyst removal surgery, and my problem with knee pain and considering a lateral release got plenty of feedback.

In terms of what posts are popular I find that there are two types of posts that get lots of visitors.

  • Personal experiences – like the posts I mentioned above. People like reading about others who are going through similar things to them.
  • Useful information – posts where I’ve provided free useful information such as my 2011 Excel Calendar, and my guide to upgrading the Samsung N140 memory to 2GB get plenty of readers.

Whatever you are writing about I find that if you add quality original material to the internet you will get more readers then if you just re-hash information that already exists.

I’d predict for example that this blog post won’t get very many visitors. There are so many people blogging about blogging that this post will probably vanish in the noise out there. But I still consider it worthwhile to write it so I can look back once I reach 200 posts.

How I write each post

When I started I used to use the WordPress WYSIWYG editor. I found that it wasn’t a great experience. Typing text into a box on a web page isn’t as good as writing text in a word processor. I like having a proper spell checker, and grammar checker ready to use.

I switched to writing my posts in Microsoft Word and using a set of VBA macros that add the WordPress mark-up to the post.

I don’t have a fixed length for each post, some are very short being just a few hundred words long, and others are many thousands of words long.

The shortest posts have been done in less than half an hour, whereas the longest posts with original research, photos and charts have sometimes taken me four to five hours to complete.

Often I don’t have a plan for each post, I just start writing and finish when I think the post is done. Take this post for example; I have very little idea where I’m going after this sentence! All I have is a few notes about certain topics I want to include.

I didn’t always include photos in my posts, but more recently I’ve tried to have at least one photo or diagram in each post. I think the sight of a large block of text can be off-putting to blog readers. A few relevant (or even not so relevant) photos can help to break the text up. All my photos are taken with a Sony Cybershot W80 camera which I reviewed on this site in 2008.

To upload the photos I use the FileZilla FTP client which has useful functions such as directory bookmarking, synchronised browsing, and filters.

Getting ideas for posts

As my blog is a multi-topic one rather than being a specialised one I can think of ideas for posts all the time. The problem is that I don’t have time to write many of them up.

reviewmylife thumbnails

Often my ideas are topics that I’ve tried to find out about on the internet, had no success, and so have decided to write about them myself.

I find that if I get an idea for a post, I need to write it down right away. If I don’t then I’ll have probably forgotten a few minutes later. If I’m at my computer I record my ideas as a simple list in Word. If I’m away from my computer I put the ideas in a ToDo list on my phone.

If I have specific ideas for what content should be in those posts then I might jot down a few bullet points, but most of the time I just write the idea down in a single line.

Promoting the posts and website

I spend very little time on promoting each post or SEO compared to the amount of time spent writing new content. But I have done some simple things to make sure each post has basic SEO hygiene factors.

  • I’ve installed the All in One SEO Pack plugin, and I make sure I add a title, description, and keywords for each post.
  • I add tags and a category to each post.
  • I submit most of my new posts to Digg, reddit, Delicious, and StumbleUpon.
  • More recently I’ve installed the Tweetly Updater plugin so Twitter is notified when I make a new post.
  • The Google XLM Sitemaps plugin is installed on this blog to make it easier for search engines to index my blog.
  • I have a TweetMeMe Retweet button on my posts to allow other people to Tweet about them.
  • I have an AddThis button on my posts to allow them to be easily submitted to social bookmarking sites.

One area where I haven’t put much/any effort into the blog is with the look. At the time of writing this 100th post I’m still using the default Kubrick theme. I will probably customise it at some point, but may wait until the default theme changes in WordPress 3.0 before I do that.

The Kubrick theme may be basic, but it works well and means I don’t get incompatibility problems each time I need to upgrade the blog. You can get plenty of readers without having to use a fancy theme.

Here is a graph showing the number of visitors I get per week which goes back to when I first installed Google Analytics. The left of the graph is October 2007. The right side is the day I made this post; 27th March 2010. The number of visitors is not huge, but at least it is growing.

visitors per week

Monetising the blog

I decided early on to monetise the blog. Not to make real money, but to at least pay for the costs of the web hosting, and domain names. To do this I use the AdSense Injection plugin with a number of custom tweaks.

It inserts text adverts into the posts automatically, and randomises their position. I find it to be a very easy way of generating a small amount of money for the site. It covers my web hosting costs, but isn’t enough to give up the day job just yet!

If I’m writing a post about something that can be bought from Amazon then I might add an Amazon affiliate link as well. This worked particularly well when I reviewed the Samsung N140 netbook. The review has nearly paid for the netbook already!

Where do my visitors come from?

This site may look like a blog, but in reality I treat it more like a static website that just happens to be using WordPress as the content management system.

Blogs usually have some common theme through their posts, mine are on quite random topics.

Because of my scattered topics almost all my readers come from search engines. I have very few – almost zero – subscribers. People use Google, Yahoo, or Bing to search for something specific, and sometimes they find one of my pages in the results.

82% of my visits come from search engine queries, and 75% of those are from Google.

You might have noticed that quite a few of the list item in the ‘Promoting the posts and website’ section above were relating to social bookmarking websites. However only about 1% of my traffic comes directly from these kinds of sites. It does make me wonder if it is even worth submitting the pages to these sites at all.

Of course these social bookmarking sites may be driving visitors in other ways – by increasing the rank of my pages in the search engines. I don’t think there is any way to find out, but I’ll keep submitting for now.

The top referring social bookmarking website for me is StumbleUpon.

In terms of which country my visitors come from 41% are from the UK, 25% from the US, and India, Canada, Australia, the Netherlands, and Germany are all in the low single figures. In the last month I had visitors from 122 different countries.

Internet Explorer is the most popular browser with 48% of my visitors using it. Firefox gets 34%, Chrome 10%, Safari 5% and Opera 1%.

The future

So what does the future hold for this blog?

Quite simple – more posts! On average I’m posting about one post per week, but sometimes there will be several in a week, and then none for a few more weeks.

I hope to keep to at least this amount of posts for the next year, and work my way towards 200 posts. I have a big backlog of post topics to write about so I won’t run out of ideas anytime soon. And I hope my writing is getting better as I go on.

If you read this I’ll say ‘thanks’. And do pop back sometime soon.