Martin Joiner's Blog

Confessions of a binge thinker
Posted on July 10, 2015

Eco self-build somewhere near Bristol

Eco_House_FrontEco_House_Back

My long-term plan of self-building my very own eco home will take a lot of time and planning. Using Google Sketchup I have made some 3D renders of the kind of structure I want to build based on my personally preferred aesthetic and building methods. These basic renders are in no way finalised plans but more to serve as a jumping off point when holding discussions with the many experts who I will have to consult on my journey.

Filed under: Eco Tagged as: No Comments
Posted on June 14, 2015

Helped paint the Bedminster sign

Bedminster-Full-Sign

Bedmo-D-Face

 

The "Make Sunday Special" treatment came to North Street in Bedminster today.  As their contribution, Upfest quickly built a BEDMINSTER sign in 7ft high letters and gethered a bunch of artists - me included.  I painted the letter D, the general consensus among the local kids was that my piece was "The Kissing Giant".

Filed under: Art Tagged as: No Comments
Posted on March 8, 2015

jQuery UK Oxford 2015

jQuery-Redbull

My colleagues at Carmen Data and I traveled to Oxford for the annual 1-day tech conference which is aimed mainly at front-end developer. Yes there were fridges full of free Redbull scattered around but other than that, here are some of my highlights from the talks.

 

Alice Bartlett

One of the highlights and certainly most profound - because of it's emotional impact - was Alice Bartlett's (@alicebarlett) talk during which she showed a video from a user testing session with an elderly chap who was struggling to use a select box during account registration. The video highlighted how foreign some of the behaviour of this classic element is to a non-web-native. Alice introduced the video by explaining that the people who really need (she emphasised that it is genuine need) Government Digital Services are the elderly people living on their own or care-workers whose only free time may be a bleary-eyed 2am session after a 14 hour shift. The heart-wrenching guilt that everyone in the audience must have shared when witnessing how shafted some users are by our use of a select elements was contrasted against the piece of video that immediately followed, whereby the same man had absolutely no trouble using a text input (because of it's familiarity to real-world paper forms). The conclusion was to embrace the combo box which gives the drop-down functionality that some people enjoy, but also the free-text input that others need. Of course this required more code and possible back-end validation but this is OK because we, as web developers, should do the hard work so the user doesn't have to.

 

Addy Osmani

Addy Osmani's presentation was a key-note speech covering the latest features added to Chrome Dev tools. I say new features but about half of them would be more accurately described as 'ported' features because they have already existed in previously available plugins or inside the dev tools of Chrome's competitor browsers. I personally was getting fired up by tiny little features like the "Preserve Log" checkbox that will be incredibly useful for measuring performance over a full user session, even though the crowd reacted with silence to this feature. A bizarre experience on the other hand, was hearing the crowd around me go wild when he demo'd the new interactive 3D DOM viewer, which is an exact copy of the one that has been built into FireFox since 2012. Hearing the audience react with awe to something that they could have discovered 36 months ago with just a little exploring gave me the same shudder that I get watching a blinkered fanboy, desperately trying to gain the approval of a stranger by showing off their shiny new Apple product, yet when questioned, failing to provide examples of how they may actually apply the new features in their everyday lives. But that was just one small moment that stuck with me, on the whole it was a slick professional talk full of useful tips that shows Google Chrome Dev tools continue to blaze the trail for the industry, even if they do (and they clearly do) use the "Most Downloaded Extensions" statistics as inspiration when cooking up features :-)

 

Andy Hume

Andy made me understand something which I am angry at myself to have not worked out on my own. We don't provide non-Javascript fallbacks (graceful degradation) for users who might have a browser that doesn't support Javascript. Of course we don't, when was the last time you came across a browser that didn't?! We provide them because .js script files are downloaded as a separate asset and if your train goes under a tunnel at the wrong moment then you, with your box-fresh iPhone 6, are now using a non-Javascript browser. *slaps head* this makes so much sense, think about progressive enhancement at waterfall level, not just browser evolution level.  I feel inspired an angry at the same time, is there an emotion for that? There should be!

 

Mark Otto @mdo

Mark Otto is the bloke who wrote a lot of Bootstrap and hearing him speak about CSS was refreshing because he justified, in few words, things that I have felt at an instinctual level for a while but have struggled to explain why. For example, why I didn't share my colleagues enthusiasm for the use of pre-processors, despite all the tech-bullies at the hack nights menacingly waving their clenched fists at me when they discover I'm not using one. Why I like to put things in a certain order and how Mark has formalised the same preference to become a team standard. Why I make class names a little longer, despite the optimisation nazis forcing propaganda posters in my face with a sad illustration of a poor user, waiting for their dialup connection to fetch those extra 4 characters that make the difference between my colleagues immediately understanding my code, or having no frickin' clue what "bhvdi" might stand for!

 

All in all, my experience of jQuery UK can be summarised as making me feel senior.  I understood the vast majority of what was said, and I disagreed with a healthy number of points based on my experience. Hearing very important people in the tech industry speak to an audience of 800 and introduce concepts which I have conceived independently, through my own practice, was validating to say the least.

Filed under: The Web Tagged as: No Comments
Posted on February 28, 2015

FITC Amsterdam 2015

Topping the list when sorted by coolness, FITC in Amsterdam had a slick and calm feel with a high calibre of speakers from a huge variation of backgrounds.

The general mood was a welcome shift from the types of conferences I normally attend which tend to focus on the web and the tech that delivers it. FITC stands for Future, Innovation, Technology and Cool shit and as such I found myself talking less about Javascript and more of the philosophy and psychology surrounding what we do. Discussing areas like the product delivery process in a creative industry and the client-designer relationship. How our modern education system conditions some strange quirks in the human mind. How art can drive development and development can be art.

FITC-Dev-as-Artist

I returned from Amsterdam feeling inspired to dig out and dust off some of the little art projects that I had begun building on various late-night Saturday coding sessions, but had let slip into non use by a sense of priority for the client work. Seeing the fantastic reactions that digital projects which were done not to deliver a monetised product to users, but just because the idea behind them can only be done with that tech, is wonderful.

Standing with one foot in the hardcore tech camp, and the other firmly rooted in the art world, I can sometimes feel an outsider to both, but at FITC I felt among friends.

Filed under: The Web Tagged as: No Comments
Posted on January 31, 2015

Sketch: A fight at a funeral

Fight-at-a-Funeral-800x600

In my happy place, with a pint and sketch book. Spent the afternoon in The Cornubia with Ashley. A bloke at the bar challenged us to draw a fight at a funeral and we happily obliged. We concluded the most likely justification for such a ruckus would be that a member of the procession has given the deceased a "flock of seagulls" hair style and that the most likely suspect would be the master of ceremonies himself.

Filed under: Art Tagged as: No Comments
Posted on October 27, 2014

Responsive re-design damages ad revenue

openmicfinder.co.uk started as a desktop-only site, then it gained a mobile version hosted on the "m." subdomain, recently I replaced both with 1 responsive version. Most interesting is the unexpected negative affect this has had on advertising revenue compared to the positive affect it has had on the Google ranking. Obviously the new responsive site scores massively higher when run through Google's PageSpeed Insight tool. I've minified all the right bits, leveraged browser caching and of course it is legible and delivers a great user experience across all screen sizes, including the tabletty ones in the middle which traditionally got left out by the mobile/desktop version split. As Google are clamping down on desktop-only sites by adding mobile-friendliness to the pagerank algorithm I had no choice but to move to a responsive redesign which, I am sad to announce, has cut my earnings by a very painful 50%!

So to summarise the key differences before and after the change:

  • Before: Most users saw a site with 3 MPU adverts. Apart from those on really small screens who got a pop-up suggestion to view the mobile site on the m. subdomain which had 1 mobile banner.
  • After the redesign: Only the biggest screens get the 3 MPUs, notebooks get a leaderboard and a banner, tablets get 2 banners, mobiles get 2 banners. On all screen sizes the ad units are now beautifully in-lined with the content and proportionately sized for the user's screen.

In essence I have followed all Google's "advice" (read pressure) and coincidentally happened to slightly increase the number of adverts that each user will see. Naturally I expected revenue to increase with usability but in fact it is much worse.

I have not discovered a definite reason why, so all my current thinking is theoretical, but it basically looks like MPUs are measured as performing better, even if the user's screen is too small to display the site and pinch-zooming is required to navigate (as would have been the case for about 50% of users before the redesign). This could be because Google Adsense charge more for showing an MPU (I have no way of looking up their prices), it could be because media agencies for some reason focus on producing the best performing artwork only for  MPUs and leaderboards and neglect the new sizes which I have introduced such as banners and mobile banners. It cannot be coincidence, the graph shows a distinct and sustaining drop immediately after the launch.

There is one other potential cause that is harder to measure. The redesign also involved me applying the latest standard of moving the Javascript to the bottom of the document, a method not supported in the Google Adsense integration documentation.  I felt this was appropriate because it enabled me to query the user's screen width to calculate which ad-units are being shown by the CSS media queries and do the responsible thing of only loading the ad units which will actually be seen by a human. A lazy developer would have stuck with Adsense's recommended method, which would have resulted in ad server requests hits for all ad units, regardless of visibility, a behavior which directly contravenes Google Adsense's terms of service.

It is sad to think that the only way I will be able to test this theory is to build a branch in my code repo that temporarily - but deliberately - breaks Adsense's rules and it's even more sad to think that the outcome might incentivise me to keep it that way permanently. Adding to my woe is the thought that an alternative outcome might be that I have to move the Adsense chunk of JS back up to the document head and block rendering until the ad server responds, a process which would feel very much like moving backwards, especially with the great adsense blackout of 2014 that brought down millions of websites.

The necessary evil of adverts just got uglier.

Posted on August 12, 2013

Coldfusions cfDump / writeDump() for PHP

phDump-Twitter-Data

phDump is a PHP-equivalent of Adobe Coldfusion's excellent debugging feature, CFDump.  The screenshot above shows phDump neatly and clearly displaying the complicated nested data structure returned by Twitter's API. A visual tool like this makes it so much easier to understand during development.

I built this to serve the niche group of developers (of which I am one) who have worked seriously with Adobe Coldfusion and grown to love the native CFDump function but who also code in PHP and find themselves wanting the feature available there too!

Download the phDump repo from my GitHub account at github.com/martinjoiner/phDump and enjoy a visually pleasing debugging experience.

 

Filed under: The Web Tagged as: No Comments
Posted on June 21, 2013

Bristol geeks and their remarkable spec keyboards

This Bristol geek has paid over 130 happinesses in order that his fingers experience the satisfying recoil of a Buckling Spring keyboard. Often described as the 'older' style, back in the 90s you could expect one of these as standard with your new IBM PC but these days you actually have to make an effort to own one. For professionals who spend the majority of their day at a computer it's a small investment for a user interface that is both tactile and satisfying on the ear. Additional bonuses include it's ability to register a greater number of keys depressed simultaneously, enabling button combos that are simply not achievable on your common-or-garden device. +4 geek points awarded. +1 bonus point for having a ginger beard.

But woah! Here comes Gavin (photographed at Bristol Web Folk Hack Night), trumping Zac by having the same buckling spring setup but this time with no markings on the keys.  Because...  well isn't it obvious?! Seriously, I have no idea. +8 geek points.

But out-nerding both of them is Brizzle's favourite div lopper, Nic Alpi who uses a keyboard with the buttons in the wrong place. He explains: the backspace and return keys are positioned in the center and the buttons are aligned in vertical columns which is kinder on the wrists and more comfortable to use, leading to greater accuracy. It takes a few hours to get used to.  +10 geek points awarded and a further +2 for wearing a HJKL vim evangelist t-shirt (he didn't even know I was coming to snap his picture, he actually wears that t-shirt normally).

Who didn't make this list? Not included here is the über hipster who actually uses a typewriter (yes the ones that hammer an ink-infused ribbon against the surface of the paper) to compose letters and the guy I met at Bristol Hackspace who has hacked a BBC Micro to a Raspberry Pi enabling him to send Tweets on a device built in 1981. Why not included? Because no matter how fun and quirky these exercises are, they just ain't practical for getting things done. And if there's one trait that can help explain the recent rise to power and great sexual magnetism that geeks are currently enjoying, it's their practical abilities to succeed.

Filed under: The Web Tagged as: 1 Comment
Posted on June 17, 2013

Bristols Biggest Bike Ride 2013

"This is what motorways will look like when we run out of oil" I joked. But seriously, the pleasure of cruising along a wide stretch of road, surrounded only by other peddle powered vehicles is bliss. Bristol's Biggest Bike Ride took place yesterday (Sunday 16th June) and it's the most peaceful gathering of 5000 people you will ever see. If you'd like to see Bristol council equip the city's roads with proper cycling facilities sign the petition at http://bristolcyclingmanifesto.org.uk/

Filed under: Life Tagged as: No Comments
Posted on June 8, 2013

Scotch On The Rocks 2013 in Edinburgh

My employer sent the dev team up to SOTR13, a 2 day web conference in Edinburgh. Talks ranged from the technical to the philosophical and comical with titles like "HTML5 Mobile App with Phone Gap", "Quit your boring 9-5er" and "Zombie Code: How to suvive an apocalypse". I learned a serious amount of very useful knowledge and met some great contacts.

Photographed above is us, the development team. And yes contrary to prior stereotyping Scotland does have sunshine. However in balance I must mention that due to my massive dirty ginger beard I blended in with the native to such an extent that two teenage girls actually stopped me in the street and asked me for directions to the sexual health clinic. I am actually not kidding. I like Edinburgh, I will visit again.

Filed under: The Web Tagged as: No Comments