I use the excellent Pocket (on both my Android device and in Google Chrome) to capture articles that I want to read later. The trouble is then finding a suitable later to actually read them. I made a start this lunchtime, however, and second up was this excellent article by Andy Clarke published on Smashing Magazine last month: A modern designer’s canvas.

It’s a really honest and encouraging read, one of the best blog posts I’ve read in a long while, to be honest. It is quite long, but I encourage you to read it. I’d be interested to hear your thoughts.

This one sentence stuck out for me, however, on yet another day that I’m working in the office on my own:

People can feel isolated, starved of inspiration, even when working alongside others, if the organization’s structure and environment make it hard to keep ideas flowing.

This is definitely something that I know our team struggles with. With such a volume of both support calls and project work we more often work on our own than collaboratively.

And yet, whenever we work together—whether pair programming or designing, or simply in splitting work between us and working on it collegiately—we always say how much we enjoyed it and how much we ought to do it more often.

Last week we got the go-ahead from the University’s ICT strategy group to work on a new web strategy, to review our structures, environment and culture and challenge the ways that we are going about ‘how we do web’.

This thumbs-up has given us a feeling of hope and excitement about the future. Time to be like children again and keep asking ‘why?’ Time to create an environment where people don’t feel isolated, or starved of inspiration, and where the flow of ideas will be encouraged.

I don’t suppose we’ll get it right first time, but the desire is certainly there to make things better for us all: the web team, the wider university, our various audiences and website users.

Now is an exciting time to be in the web team. And remember, we currently have a vacancy for a PHP/JavaScript developer. Come join us.

St Andrews ranked #1 in the world for student satisfaction in IT support

St Andrews is ranked 1/45 internationally, 1/22 in the UK, 1/8 in our rival groups

Support average—IT Services support

i-graduate (often referred to simply as iGrad) is the global benchmark for student experience, implemented by over 1,400 of the world’s best universities, with feedback from over 1.7 million students.

The i-graduate student survey results for the ‘autumn wave 2013′ were released to the University last week.

It was really encouraging to see the University of St Andrews ranked number one in the world for satisfaction regarding IT support.

“Ranked top globally for IT Support (by globally, we mean those institutions that took part in both the international and home versions of the survey).”
—i-graduate representative

Some numbers:

  • 227,519 students were surveyed worldwide.
  • 178 institutions participate across 13 countries.
  • 21% response rate.
  • Our rival group is defined as Bristol, Durham, Edinburgh, Exeter, Nottingham, Warwick and York.
  • 94% was the overall satisfaction (across all categories) with the University of St Andrews.

This is a tremendous achievement and coupled with the unit being accredited with 3-star service desk certification from the Service Desk Institute (SDI) shows that we must be doing something right. Well done everyone.

Right, back to support calls…

Mental health in web development

HTML code with mental health class names

Back in November (21–22) 2013 I travelled to Dublin to TerminalFour‘s annual global user conference t44u at the Aviva Stadium in Dublin, Ireland. TerminalFour develop the web content management system that we use here at St Andrews: Site Manager, often simply referred to as T4.

This was the third or fourth event that I’d attended and was by far the most enjoyable for me, not least because we were located in a rugby stadium rather than a brewery. The last few conferences had been hosted at the Guinness storehouse… and I don’t drink alcohol (largely thanks to an inherited kidney disease). I was, however, brought up in the Scottish Borders where we do play rugby. A lot.

It was also, as promised, the most hands-on conference to date. One of the main focuses of the event was about unleashing Site Manager’s potential. You can view the mind maps I created, on Flickr (Thursday and Friday). There were sessions about content strategy; existing, new and future Site Manager features; platform as a service; mobile web and responsive web design; web search; and more than one presentation about novel ways of using Site Manager to edit and manage content, and quickly create new sites.

Christopher Murphy

The session that touched me the most, however, was the keynote talk by Christopher Murphy (@fehler on Twitter), an academic, writer and designer based in Belfast; he is one half of the Web Standardistas and now a volunteer with Prompt, an organisation with a remit of starting conversations about mental health in the technology industry.

His talk had me in tears, at one point, to be honest.

Christopher shared with us, at times with a lump in his throat and a pause or two to re-gather his composure, that on 21 May 2013—only six months before—he had found himself waking up in hospital. The day before Christopher had attempted to kill himself.

If I remember correctly, his wife had returned home, found him, called an ambulance and here he was now, lying in a hospital bed, ‘feeling exhausted, disorientated and ashamed’.

Over the next half an hour Christopher shared with us something of what had brought him to this the lowest point in his life: an unsustainable schedule of demands and responsibilities of writing and talking, teaching and supervising, designing and creating. He felt like life was out of control, and at his lowest ebb he saw only one way out which very nearly killed him.

Filled with remorse, Christopher resolved to do something about it. He began looking into what had led him to this point, he began to explore and understand the mechanics of the mind. Later he also decided to share some of what he had learned with the tech and web communities he was a part of; which is what brought him to be standing before us, laying himself bare and sharing something immensely personal with us.

(You can read Christopher Murphy’s very moving article on 24 ways: Managing a mind.)

Pace of change

Christopher touched on the “relentless pace of change” that we experience in the web development industry. Not that long ago it was enough to have a firm grasp of HTML and CSS, and a smattering of JavaScript and PHP to get you into the industry. But these days you can’t go two months without a new browser version being released, the specifications for HTML5 and CSS3 seem to be in continuous flux (did anyone else implement the <hgroup> tag only then to discover only months later that it had already been deprecated from HTML5?), then there is now Sass, and Less, and Stylus to help us with CSS production, we have Node and NPM, Grunt and Yeoman. All these things to supposedly make our lives easier, and yet somehow at the same time making things increasingly complex at best and unnecessarily anxious at worst. And what about PHP libraries, JavaScript frameworks, text editors, IDEs, new graphics formats like WebP? Where does it stop?

I have a constant gnawing feeling that I’m always behind with my skills. But where do you start? And as <hgroup> has proved, will what you learn already be out of date within a the year?

Status anxiety and imposter syndrome

Christopher spent much of his talk speaking about two pressures in particular: status anxiety and imposter syndrome.

Status anxiety is “an anxiety about what others think of us; about whether we’re judged a success or a failure, a winner or a loser.” Imposter syndrome, he said, is far more widespread than you’d imagine. It is defined as “a fear that one is not as smart or capable as others think”. It’s a fear that one day you will be ‘found out’ by them, even though you don’t exactly know who ‘they’ are, or what exactly they will find out.

To be honest, I feel a combination of both these fears almost every time I have to visit the systems team. “They must think that I’m an idiot for not knowing this,” I find myself saying inside my head. But why?! Server configuration and administration aren’t my specialities or responsibilities. I’m going to ask for their expertise and advice to help me complete a particular task. But I still beat myself up a bit about it if I’m not careful.

Mental Ill-health

Why does mental ill-health still carry such a stigma? Clearly there is an element of fear involved, and labels such as ‘psycho’, ‘nutter’, and ‘loony’ don’t help, but not every case of mental ill-health is as extreme as psychosis, schizophrenia, or personality disorder. Mental ill-health symptoms can include:

  • Feeling sad or down.
  • Confused thinking or reduced ability to concentrate.
  • Excessive worries.
  • Withdrawal from friends or activities.
  • Inability to cope with daily problems or stresses.
  • Significant tiredness.
  • Sleeping problems.

I don’t know anyone who hasn’t experienced some of these symptoms at least once in their life. We don’t give people grief for catching a cold or a tummy bug, or if they break their leg. We don’t blame them in the same way that I’ve heard people with mental ill-health blamed: “Well, it must be his own fault for catching that common cold! He should have prevented it!”

What nonsense! That doesn’t help anyone.


After my dad died in 1998 I got really depressed. Everyone could see it, apart from me. My GP wanted to put me on anti-depressants; I couldn’t see why, so I refused. But my days were bleak. I couldn’t see a point in anything.

“Why should I do this or that… I’m going to die in the end, so what’s the point?” That was the conversation in my head most of the time.

It was actually getting involved in web development that helped pull me slowly out of that quagmire. It offered me a way to express myself and to be creative. It was something that didn’t require me to work with other people if I didn’t want to, and to collaborate with others when I did. For me it worked. It was a lifeline, and after seven years I moved into web development full-time.


My most recent and sustained experience of what must surely fall under the umbrella of mental ill-health has been parenthood. I have twin boys (5) and a singleton (3). It is getting easier now; and if not easier then it is definitely getting different.

I’ve spent much of the last 4–5 years in a state of constant exhaustion and sleep deprivation. At times I’ve found it difficult to concentrate. There have been days when it has felt as though my thoughts were literally falling out of my head. I had to write everything down and schedule every piece of work in my Outlook calendar so that I could remember—even mid-task—what I was supposed to be working on.

I had a constant headache for four months a few years ago. I thought there was something wrong with me! Well, there was: I wasn’t getting enough sleep. Some nights my boys were awake every 15 minutes. And I only know that because we kept notebooks to record everything that happened, who had been fed/changed/medicated and by whom, otherwise we couldn’t remember from hour to hour.

I’ve not heard many people referring to those first few years of parenthood as a period of mental ill-health, but it definitely is. I experienced every one of those symptoms in the list above. I do feel like a stronger person for having gotten through it, but damn! that was hard, really hard.

And now…?

I was really pleased that Christopher Murphy talked about this whole topic at T44U. I’m glad there are organisations like Prompt and discussion boards like Devpressed that raise these issues within the industry and offer support.

I don’t have an answer, but I do know that stigma and blame don’t help. As a web industry we need to keep talking about this more openly. We need to let people know that it’s okay to talk about it.

People, it’s okay to talk about it!

Just like that.

Moving the University website to HTML9 Responsive Boilerstrap JS

H9RBS.js (v0.0001) is a flexible, dependency-free, lightweight, device-agnostic, modular, baked-in, component framework MVC library shoelacestrap to help you kickstart your responsive CSS-based app architecture backbone kitchensink tweetybirds.

H9RBS.js (v0.0001) is a flexible, dependency-free, lightweight, device-agnostic, modular, baked-in, component framework MVC library shoelacestrap to help you kickstart your responsive CSS-based app architecture backbone kitchensink tweetybirds.

When we redesigned the University website in 2008 we adopted the Blueprint CSS framework which greatly cut down our CSS development time. It offered us a solid, cross-browser compatible foundation on which to build our site.

With the advent of HTML5 and responsive web design we started using the Bootstrap framework which offered not only a mobile-friendly grid but also at least 12 JavaScript plugins to provide design patterns such as modal windows, carousels, tabs and accordions.

As you are probably aware the web is now developing at an astonishing rate. Browsers are updated now on a six-weekly basis, HTML5 is nearing completion, and CSS4 is already being discussed. So we are looking to the future for a new framework that will support our needs and the requirements of our ever more mobile-friendly users for the next few years to come.

In consultation with Prof. Ailol from the University’s School of Computer Science we will be planning a migration to the HTML9 Responsive Boilerstrap JS starting today.

The framework describes itself as

a flexible, dependency-free, lightweight, device-agnostic, modular, baked-in, component framework MVC library shoelacestrap to help you kickstart your responsive CSS-based app architecture backbone [...]

In other words: it meets our needs perfectly. Or as the developer of the infamous “All your base are belong to us” might say: All proof I.

A few of the many reasons we’ve selected this framework:

  1. It is entirely suited to today’s web.
  2. Unlike many other frameworks this uses a poor fill rather than a polyfil.
  3. It supports the new JavaScript flair loop.
  4. It is compatible with the forthcoming Commodore 64, Spectrum 48 and BBC B platforms, as well as popular browsers such as IE 6, Netscape Navigator 4 and Mosaic.
  5. No polar bears were harmed in its creation; in other words it is in keeping with our IT strategy for green computing.
  6. It is 100% compatible with JaxelScrobd 8.1.π.

From a usability point of view the only difference you may experience is a mild sense of foolishness.

Job vacancy: web developer

Spanner lying on a laptop keyboard

The University is looking for a web developer to join the web team.

  • Job reference: Web Developer SB1005R1
  • Salary £25,013 – £29,837 per annum (grade 5)
  • Required skills: PHP, JavaScript/jQuery, HTML, CSS, SQL, Ajax
  • Fixed term: 3 years
  • Start: as soon as possible
  • Closing date for applications: Friday 25 April 2014

The main purpose of the role will be in helping maintain and support web services, notably where changes need to be made to coding and other infrastructure elements, so a solid and demonstrable knowledge of PHP, MySQL, JavaScript, HTML and CSS is required. Experience of WordPress (including WordPress Multi Site) will also be of an advantage.

Our enterprise web content management system is the commercial, Java-based TerminalFour Site Manager (although we’ve never had to dabble with any Java) running on an Oracle database; and we’re working a lot with WordPress (and MySQL) too these days (both stand-alone installations and WordPress Multi Site). Pre-knowledge of either is not required as training will be offered.

Regarding existing technologies, we’re currently using an adapted version of the Blueprint CSS framework and a patchwork of jQuery plugins, but we have plans to move to the Bootstrap framework, the Sass CSS pre-processor and a host of other time-saving goodies. We currently don’t use any particular PHP framework, although PHPMaker has been used to help generate a few applications; that’s not to say that we’re not option to the adoption of a PHP framework. We often use Agile methodologies in our project work and use Trello to keep ourselves organised.

It’s not all about hardcore coding, however. An important element of the job will be to deal with website users and content creators in a support and perhaps even training role. The web team offers first, second and third line support, and you will be expected to get involved there too.

The web team is currently made up of four members (web manager, web architect, web editor and web apprentice) with a fifth member on secondment to Corporate Communications. Speaking as someone who is obviously somewhat biased, the web team is a good, fun and supportive place to work. Do you fancy joining us?

More details can be found on the University’s job vacancy website — the job reference code is SB1005R1.

Survey of university websites

Bar chart showing Scotland vs UK vs world university websites As part of our work around developing a solid strategy for the University website for next few years, over the last couple of days we’ve been doing a little ‘competitor analysis’ and have visited over 200 university websites; in all it took us around eight hours. We asked three questions of each site we visited:

  1. Responsive
    Is the homepage responsive? (In other words, does the site adapt depending on the size, orientation of the screen used to view the pages?)
  2. Log in
    Do you need to log in to view information for internal audiences (which we broadly defined as an intranet)?
  3. Standard design
    Do the academic schools’ websites have a standard design?

Similarly, we looked at three areas:

  1. Scottish universities.
  2. Top 100 UK universities (from the Guardian university guide 2014).
  3. Top 100 world universities (from Times Higher Education world University rankings 2014).


The results were both fascinating and encouraging:

Scotland UK World
Responsive 21% 43% 36%
Log in 50% 59% 53%
Standard school sites 86% 91% 39%

Not as far behind as we feared

Working largely in isolation from other university web teams—apart from those few moments each year we gather at Scottish Web Folk, IWMW or T44U conferences—it is easy to convince yourself that you are lagging far behind our fellow universities in terms of adoption of the latest web browser features and standards. A recent meeting of web team members from Abertay, Dundee and St Andrews, however, showed us that we are facing largely the same issues in each institution. And these results show us, certainly in terms of adoption of a mobile-friendlier, responsive website design, we are still a part of the majority. I wish we’d carried out this exercise, say, a year ago so that we could see how quickly this is moving. Time to respond, though.

In or out?

There has been a question posed here about whether our ‘intranet’, our pages for internal audiences, should be available to the general public or whether they aught to be secured behind a login. From this limited sample of approximately 200 institutions, around half restrict access. I’m still trying to figure out what is the exact question that we’re asking here. Is it simply about making some information unfindable by the public, or is it more about providing a more focused experience for external audiences, particularly in the area of search. Currently when someone enters a search term into the search box on the homepage it returns results from the entire University website: over 250,000 pages. Should we be displaying results only from sites that are relevant to external audiences (e.g. information for prospective students, administration A-Z, about the University, school websites, etc.)?

Standard school sites

Finally, we were surprised—but encouraged—by the high percentage of sites that offered a standard look-and-feel for school websites. We would never have guessed, for example, that 9/10 of UK websites would offer this.


This has been a valuable exercise. It would be interesting to repeat this exercise in 12 months’ time to see how the landscape has changed, particularly in the area of responsive design.

On your own in the office over the spring break?

Coding FM, the sound of coding

Missing your colleagues, stick this on in the background and pretend they are still there.

The students have now gone on their spring vacation. Soon colleagues too will be slipping away for a break, leaving you alone in the office.

If—like me—that’s going to leave you on your own at your web team HQ to look after the whole of the internet singlehandedly, then why not load up CODING.FM in your browser, pin the tab and pretend that your colleagues are still in the room by listening to the gentle sound of other people coding.

It is actually surprisingly soothing.

Coloured lists in Trello

Background colours on selected lists in Trello

Background colours on selected lists in Trello

As you probably know, we’re big fans of Trello here in the web team.

We have a number of project boards, overseen by one master, everything-we’re-doing™ board called @Web team. It currently has 24 columns (or lists) which makes quickly navigating to the right list a little tricky at times.

So today I quickly wrote a hacky little Tamperscript (Chrome) / Greasemonkey (Firefox) script to add background colours to certain lists.

For colours, I simply selected an at-random theme from Adobe Kuler.

It could be optimised but it does what I need to without too much of a performance hit, and already I’ve found it really helpful to immediately identify the “in progress”, “this week” and “done” columns, as well as marking our project backlog columns.

// ==UserScript==
// @name Web team – Trello highlight lists
// @description Highlight certain columns in Trello.
// @include
// @require
// @version 2.1
// @copyright 2014, Gareth J M Saunders
// ==/UserScript==

$(document).ready(function() {

var black = ‘#393939′,
brown = ‘#a39386′,
green = ‘#a8C0aa’,
red = ‘#a7585b’,
white = ‘#fff’;

$(‘body’).hover(function() {
$(“h2:contains(‘PROJECTS’), h2:contains(‘TEAM ADMIN’)”).css(‘color’, black).parents(‘.list’).css(‘background’, brown);
$(“h2:contains(‘IN PROGRESS’)”).css(‘color’, black).parents(‘.list’).css(‘background’, green);
$(“h2:contains(‘THIS’)”).css(‘color’, white).parents(‘.list’).css(‘background’, red);
$(“h2:contains(‘DONE’)”).css(‘color’, white).parents(‘.list’).css(‘background’, black);

Please feel free to use it, adapt it, improve it, comment on this.

Obviously, change the 'contains:' keywords to find your own list headings, and the @include URL to that of your board.


  • I noticed that I was trying to pull in the jQuery file under http rather than https, which was causing problems.
  • It turns out that the DOM loads long before the content, as there is some Ajax jiggery-pokery going on. So I’m using a hover event on the body to force the colours to change, which is a horrible hack but works, and does also pick up new lists created with these keywords.

To do

  1. Improve the event handling to determine the best way to load the script.
  2. Use arrays and or variables to store common colours.

Leet service desk calls

Our support calls list shows 13 calls assigned to me, 37 to the whole team. That's so 1337 or leet!


This morning I logged into UniDesk, our IT Service Desk incident management system, and noticed that the calls assigned to me next to the calls assigned to the whole web team read: 1337.

That’s so 1337! (Using leetspeak, an alternative alphabet for the English language, it reads: elite.)

We’ve been making a particular effort to drive down our support calls this week. Here’s how many calls we had at 09:00 each morning this week.

  • Monday: 67
  • Tuesday: 58
  • Wednesday: 55
  • Thursday: 37

We’re doing well. In fact, you could say we’re 1337!

Zeal and Dash—Offline documentation browsers

Zeal for Linux and Windows

Zeal for Linux and Windows

Yesterday I came across a really useful application for web development which has already sped up my workflow when needing to look for documentation: Zeal.

Zeal is available for Linux and Windows only, because it’s based on a similar application for Mac OS X only called Dash.

On my personal blog, I’ve written about how I’m using Zeal, and how I’ve configured it to be integrated into Sublime Text 3. It has been a real time-saver already: thoroughly recommended.