Category Archives:The Blog

Wrestling with share buttons

By

New blog design means new sharing. New sharing means fiddling around with code provided by the platform providers – some of which is (vastly) better than others.

Due to constraints in the design, buttons may need to be reloaded on the page. For a “single” page with one post, this doesn’t matter. However, I wanted share to work on pages with multiple posts, such as the homepage. Due to the design (in the modal popup) the buttons would have to be regenerated depending on which share button was clicked. Easy enough to do with the data, but what about the buttons themselves?

This may seem overly complex but it has a number of advantages. The platform providers get less data about users by the buttons being rendered on-demand. It also means the page loads quicker, and we can load up the buttons while the fancy modal animation is happening, resulting in a much better experience for users.

LinkedIn’s is the worst button in this regard. You have to load the same two scripts to get it to render a button each time. One of these scripts binds itself to window.IN, and won’t let you load it twice unless you unset this in between. Bit impractical. There is also no Iframe implementation which could work around this problem.

Facebook and Twitter both have JavaScript implementations, but these don’t work when you try and re-render them. Therefore I used the Iframe implementations. Unfortunately the Twitter button seems to ignore some of its parameters in the Iframe mode (such as the large button size, despite their docs saying otherwise). Both of these result in an experience that is less than perfect – the JS implementations give you nice modal popups, whereas the Iframes generate popup windows. Fairly easy to re-render though.

The Google +1 button is by far the best code. You only need load one script on page load, then you can call a global function to re-render buttons at any time. So you simply need to drop a new element and then call the function to get it rendered (very quickly, as a matter of fact) and you’re done.

+1, Facebook and LinkedIn all support extra information from pages for their posting. Facebook and LinkedIn both use OpenGraph, which is reasonable as it only uses meta tags. LinkedIn is a bit picky about thumbnail size but not too bad. +1 uses Schema.org, which requires a bit more effort and some more elements (you also have to modify the HTML opening tag) but it’s also fairly easy to implement. Twitter’s share button doesn’t do any of this and accepts parameters into the Iframe, which seems ok but it doesn’t automatically shorten the text to the right length of the tweet for you which is a bit annoying. LinkedIn seems to have some problems picking up OpenGraph data from the share button too, if it hasn’t been crawled before – it just doesn’t populate any data in the popup.

All in all, a relatively painful experience for what should have been as simple as what you have to do for the +1 button four times over.

New site design

By

I’ve had a crazy couple of days and decided the old site design had had its day and it was time for a refresh.

Here’s a few posts that I think look really good with the new design:

Having played around with Twitter’s Bootstrap for a bit, I thought I’d give it a go as the main framework. I got on with it well and had to fiddle with only a couple of bits and pieces to get it to play ball. Their new responsive stuff is good and if you check out the site on your phone or tablet you should get an equally nice experience now. The site is also a lot simpler so it is quicker to load, and it hurts the eyes less.

Thanks to Android from where I borrowed the font for the header (Roboto from Android 4 – font nerds hate it but I quite like it) as well as the colours – thanks to the Android Design people for putting all the swatch and font files on their website.

If you spot any issues, you can reach me with the links under the “Connect” tab up there in the top right corner (if it’s a UI think I’d really appreciate a screenshot). Currently comments are disabled because I haven’t quite got round to rendering them yet (oopsey) but you could theoretically use them later if I ever got round to it.

Online overhaul

By

I’ve had a bit of a renovation.

I thought it was high time I changed my profile picture, as it was nearly two years old (it was taken on Christmas Day 2009). You can see it on Google+, LinkedIn, Twitter, or hitting the “Profile” link above.

I also intended to have a bit of an overhaul of my CV. In the end, I decided to move all the important information over to LinkedIn, and then delete it. My old CV website (http://cv.chris-alexander.co.uk) now just redirects to LinkedIn, as the “Online CV” stuff does too.

If someone wants to hire me and complains that I don’t have a traditional CV then I think I probably wouldn’t want to be hired by them anyway; think of it as a pre-filter.

Flipboard: it is time to answer for your crimes

By

That’s it, I’m fed up – I’m calling out Flipboard for blatantly disregarding ownership of content, costing me money without providing a return, and reducing my advertising revenues.

Now don’t get me wrong, I only make a few quid out of my website, so this is not a massive problem to me (let’s face it, I have a job); but scale this up and it basically turns into robbery. It’s what got Google in a big stack of lawsuits over Google News, and just because you’ve got some “cool app” for the iPad doesn’t mean you can just go treading on people’s rights and doing what you please.

Skimkit: Find Monetisable Products

By

Over the past few months I’ve been playing on and off with Skimlinks, a UK-based service providing easy monetisation of outbound links for websites. You may have also seen my post about how excellent their customer service is.

My desktop Huddle client, Clustr, wasn’t the only Adobe AIR application to launch last week. Skimlinks also announced the release of Skimkit, their tool for publishers to find relevant products for their website.

From the Skimkit website:

Filled with a live database of millions of products from Skimlinks merchants, SkimKit changes the way you research content; saving you time, and providing you with more targeted and relevant results, right to your desktop.