This is how I’m backing up my important personal data these days. It’s not perfect but I think it’s better than nothing.

Level one - Apple Time Machine (daily)

Pros

• Hourly backup when iMac turned on.
• On-site, attached to iMac.
• Backs up everything
• Effortless
• Relatively cheap

Cons

• On-site - will be destroyed in fire
• Could be stolen along with iMac
• Disc will fail at some point

Level two - DVD backup (weekly)

Pros

• Archive quality disc
• Less likely to fail than hard drive
• Stored off site with friends and family
  
• Relatively cheap

Cons

• Harder to manage
• Labour intensive

Level three - online backup (monthly)

Pros

• Backed up to scalable server
• Taggable

Cons

• Expensive
• Prohibitively expensive to backup music and video
  

What I’m backing up

1. Priority one
   1. Photos (iphoto)
      
   2. Music (itunes)
      
   3. Video (my flip video)
      
   4. Documents
   5. Websites / portfolio work (mamp / htdocs)
      
   6. Application serial numbers
      
2. Priority two
   1. Applications
   2. Settings

• Joomla!
  Yet another open-source CMS. Used by the MTV network apparently. Seems to have the market share over Drupal and Wordpress at the mo too (according to Google insights).
  (tags: webdesign cms joomla)
• Your Drupal Experts in San Francisco | Chapter Three
  Chapter Three was founded in San Francisco in 2006 by Zack Rosen, Josh Koenig, and Matt Cheney, three friends with a shared interest in social change, mutual expertise in open-source technology and grassroots organizing, and a strong belief in the wealth of networks.
  (tags: webdesign drupal)
• Drupal Association
  The Drupal Association is an organisation dedicated to helping the open-source Drupal CMS project flourish.
  (tags: webdesign drupal)

• WP Super Cache
  Serve static files, reduce the load on PHP scripts, ensure you site is viewed even under heavy load.
  (tags: webdesign wordpress plugins)
• Wordpress as a CMS - Content Management System
  How to use Wordpress as a Content Management System. The author identifies a number of sites that use Wordpress for non-blog sites and also explains his own project.
  (tags: webdesign wordpress cms)
• Roblog » Batch Categories
  This WordPress plugin lets you batch edit your posts: assign multiple posts to a category or delete multiple posts from a category in one fell swoop.
  (tags: wordpress plugins web design)
• Search and Replace « WordPress Plugins
  Useful for when you change domain names or move from one blog to another.
  (tags: wordpress plugins webdesign)
• Wordpress Automatic upgrade
  Somewhat useful if it works. I'm going to give it a try as I avoided upgrading Wordpress for over two years because I'm so lazy and forgetful.
  (tags: wordpress plugins webdesign)
• Mozilla Labs » Blog Archive » Introducing Ubiquity
  Quicksilver for Firefox. Bonza.
  (tags: utilities firefox browser productivity)
• WordPress › pageMash > pageManagement « WordPress Plugins
  Drag and drop page management plugin for Wordpress admin. I've been looking for this for so long. Wonder how well it words with hundreds of pages?
  (tags: webdesign wordpress plugins)
• wordpress-plugins - Microformats
  A selection of plugins to add functionality to Wordpress in order to create semantically useful content. hAtom, XOXO, hCard, hAvatar and hCalendar are covered. Nice.
  (tags: webdesign microformats wordpress plugins)

I return to work today from a marathon four weeks off. Two of those weeks were official paternity leave and the final two were holiday bolted onto the end. Four weeks was just right for me. Helen and I have settled down into this parenthood lark and I’m comfortable leaving to get on with their day whilst I get back to work.

I wonder why were only get two weeks paternity leave in the UK? I’d certainly not be ready to go back to work after two weeks. Things were still scary and new at that point so I definitely made the right decision when I took the whole of August off. Time just flies though. I only feel like I’ve been off for a week!

And so we gear up for my least favourite part of the year. As the nights draw in, dark, cold SAD inducing winter will be upon us soon.  Maybe this year I’ll be too busy to notice.

My workload at the Open University (OU) stepped up a gear in 2006 and I was granted extra responsibility and increasing autonomy. I was enlisted to work on the graphical user interface for the OU ePortfolio, MyStuff. This was initially a very exciting task as I was brand new to the concept which seemed like a mix of web2.0 and social web apps I had been heavily using (Flickr, Delicious, Facebook, LinkedIn, Google Docs etc) plus some learning stuff that I didn’t really understand properly.

I had recently attended the first Future of Web Apps conference in London and had been fired up by Tom Coates‘ talk about the future of data mashups (owning ones own data and reusing it in various contexts) and was looking forward to building on this philosophy. Of course my main problem was that a massive institution such as the Open University is was very wary about sharing data and integrating with third-party applications and the project seemed to want to recreate apps like Flickr and Delicious rather than use their API. Hitting this brick wall was a bit of a setback but I soldiered on regardless with the design, hoping that the aesthetic approach might rub off on the development side and push the boundaries of what was possible with an ePortfolio.

Rather than document my progress here, I started posting to my OU blog instead. We went through various iterations of the design, building on user feedback and testing. The biggest problem was that ‘user’ was defined as the course teams who would prescribe the software in their courses rather than the students who would use it. So the whole thing was designed and built by committee and I ended up a little dispirited by it all. I still have some conceptual design work that I hope might be used if the project is ever revisited in the future. For now, MyStuff is available to OU students and it will be interesting to see how they cope with it.

I was also involved with many other interesting projects at the Open University. I was asked to find out how the OU could support students using mobile phone channels such as SMS and the mobile web. I undertook some research and carried out a pilot SMS alert service with a small group of 450 students. The reaction was very positive and I’m now looking into the ways in which the OU can adapt to provide a similar service to all students given its rather complex business model.

I worked on the redeveloped OU online prospectus, Study at the OU, with my ex-colleague Stephen Turvey. We were asked by the Head of Online Services, Ian Roddis, to create a fresh, usable and accessible design that could be user tested to death in order to create an experience that would help recruit and retain students in a era where government funding for students doing a second or equivalent degree was being withdrawn. We came up with something minimal and easy to apply to the complex existing systems. The project is ongoing and we’ve yet to move into the second phase where rich media and interaction is applied to the course descriptions but we’re certainly moving in the right direction with this very rewarding project.

Stephen and I also worked on the OU Careers Advisory Service website redesign which earned the award for AGCAS HE website of the year. We put a lot of hard work into developing a subtle yet appealing design with intuitive information architecture.

My ongoing work at the OU is now to create a community of practice for online web standards. The OU is a huge community and there are many web designers and developers. Until early this year we were a rather fragmented bunch but Twitter has brought us together. Not only web designers and developers but librarians, academics and support staff across the main campus and the regional and national centres. I’m talking to people in departments I didn’t even know existed and hearing about many interesting and exciting projects. I honestly think that we now have a critical mass to do some truly innovative projects. Take SocialLearn and OU View on YouTube as two examples of where the OU has now finally moved away from wanting to control all aspects of data, design and production. Even the non-official OU Facebook apps are gathering steady momentum and are seen as being useful student support channels. It looks as though 2009 might even see the OU drop the in-house bespoke web Content Management System for the open source goodness of Drupal. There’s an interesting time ahead at the OU that I’m really looking forward to getting stuck into on my return from paternity leave next week.

I’m a PHP thickie to be honest. I blunder around attempting to understand what I’m doing with programming but rarely have a clue. It’s all just magic fairy dust to me. When I get something working, frankly I’m amazed. Today I conquered Wordpress conditionals. I thought I’d log down what I did because I’m likely to need this knowledge again in the future. If it helps out others along the way, great.

The challenge

When creating a Wordpress theme you can use a number of individual template files to control different types of content. However, very little often changes from page to page. You end up retyping the same code into each template. When you want to make a change to your theme you have to go and edit the code numerous times across different templates. A better solution would be to have a few template files as possible and apply a different output based on certain conditions. Wordpress offers us conditional tags to do this very thing.

Imagine my scenario. I have blog posts published in full on the front-page of my site. Each of these posts contains a link in the title which takes us to the full, permalinked article plus comments. I can use the same Wordpress loop for the homepage as for the single articles save for a two things: 1. The link in the title isn’t needed on the single post as it would self-link. 2. The link to the comments isn’t needed for the same reason.

The solution

<?php if (is_single()) { ?>
<?php the_title(); ?>
<?php } else { ?>
<a class=”bookmark” href=”<?php the_permalink() ?>”
rel=”bookmark” title=”Permanent Link to <?php the_title(); ?> “>
<?php the_title(); ?> </a>
<?php } ?>

The code above illustrates the syntax to use. The emboldened bits provide the conditional logic and the bits between are the code I want to output. And there you have it. Simple really.

I’ve been threatening to redesign my site for about three years now. Owing to being so busy at work and with all the things I get up to in my social life it just hasn’t been a priority for me. However, ones personal site should reflect ones web design ability so I’ve decided to just crack on and do a bit here and there in the spare time if find and just let it evolve. I’m off on leave with a new born baby so will be able to snatch fragments of time to work on the site. Fragments development time usually lead to a fragmented whole so it’s likely that once I get to a certain eureka point I’ll have to consolidate everything. So be it.

What you see here is a skeleton of a site with basic functionality and a so-so basic design. I’ve upgraded Wordpress to the most recent version. I was on 2.02 or something like that. Now I’m on 2.6.1 and managed to lose my categories along the way. I think I’ve managed to recover them thanks to some useful advice.

I’m now thinking about how to make use of the Wordpress (WP) tags. I always used WP categories before but now I’ve got a bit of a conflict with my taxonomy. Hmm. I’ll see how things go as I write new posts.

Design-wise I’d like to do something different. I want to avoid gradients, drop-shadows and other web2.0 cliches as much as possible (they’ve never featured in a GuyWeb design yet though). I do have something of a penchant for large text though so that particular feature is likely to stay. I always find designing my personal site to be the hardest design to do. Perhaps because it’s such a personal artifact, something that represents me and my work. It’s the essence of the man.

In the past I’ve toyed with hand-drawn illustration, type-writer text and as much organic, grubby real world enhancements as I could cope with to try and make the site feel less computery. But the web is digital however we try to conceal the fact. So for the time being my header contains a throwaway block with a bunch of random blocky fills. I’m going to replace this with something more meaningful later.

The two-column layout is ideally suited to weblogs and I don’t see myself messing with that particular convention. in the past I’ve created homepages that use a different layout from the rest of the site, giving a window onto the delights inside (blog, photos, portfolio, about, cv) but having visited other people’s personal sites I discover that I much prefer to get straight to the content and mosy on from there. So it’s likely that although I’ll be trying to do something a little different, I’ll follow the basic layout of a typical blog. Whatever I do, it will continue to be a flexible, elastic percentage / ems layout.

I’ve decided to use the Blueprint CSS framework to underpin the typography and, more importantly, to reset the browser defaults. I see Blueprint as a rather useful tool and starting point to build upon and that’s what I’m doing.

I’ll also be using the jQuery Javascript library for any behavioral embellishments. I’ve grown to love Javascript through my experiments with jQuery and have used it in a number of professional projects over the last few months. It’ll be nice to use some subtle user-experience enhancing techniques here.

I also intend to use microformats where appropriate. At the moment I’m using the Atom microformat for the posts and POSH markup. I will be adding hcard, hreview and various other useful bits and bobs as I go.

Most importantly in this redesign is to publish some new content! I’ve got a massive list of topics to discuss that I’ve just not gotten round to. I never felt compelled to write whilst my site was so undesigned but once it gets a fresh lick of paint I’ll want to fill it with suitably rich content.

So there you go, a pledge. Subscribe to the RSS feed to find out more.

A full and expanding todo list is available, should you be interested.

Helen and I welcomed our son Oliver into the world last Saturday. At 10:10am on the 2nd August 2008 Oliver made his way into the world in an unexpected breached delivery.

Our first child, we’re learning a lot about parenthood fast. To say we’re delighted is an understatement! Many thanks go out to all our friends and family who can see photos and videos on Flickr and Facebook.

I’m breaking my radio silence to talk about something that has been bothering me about web design lately: Mobile / small screen web design layout.

I’ve been using my Nokia e51 to browse the web on a daily basis for the last six months or so. A lot of the sites I visit have mobile versions of their content: Twitter, Facebook, Flickr, BBC, Amazon. These mobile versions are not just about mobile stylesheets but entirely different templates with different navigation systems which often put a wall around the core features of the site so you can’t stray into areas that haven’t been optimised for mobile or simply aren’t suitable. The majority of websites don’t have mobile versions of their sites but are still viewable in most modern mobile phones and small screen devices that support HTML and CSS.

There’s an oft-debated argument about fixed-width -vs- fluid layout. It usually revolves around the need of the designer to have control of the canvas, to be able to absolutely position elements on a page so that the design comes together as a cohesive piece. Whilst this approach might look rather nice if the user has the same display / browser setup as the designer this is rarely the case. A lot of web design is about just letting go. Maybe accepting the loss of control is the mark of a good web designer? So we should all be using fluid layout designs, where possible, in our website design. But what about mobile or small-screened devices?

Viewing a liquid layout website on my Webkit-powered Nokia browser is not a pleasant experience. Imagine a simple layout with the main content occupying 60% of the viewport with the remaining 40% given over to peripheral sidebar style navigation elements. 60% of an 800 pixel viewport is 480px, leaving 320px for the sidebar. This seems reasonable enough. Large screens, with max-width techniques for line-length legibility employed can look good too using this ratio.

Switch to a small screen of 240px and the story is rather different. 60% = 144px / 40% = 96px. Whilst we have no horizontal scrollbars in this instance, the columns are extremely narrow are difficult to read. This is a simple two column layout. Imagine what happens when we throw three or four liquid columns into the mix (4 x 25% = 4 x 60px)! I’ve actually found that fixed-width layouts optimised for 1024px widths render much better on my mobile phone. Granted I get a horizontal scrollbar but Nokia’s browser is intelligent enough to recognise blocks of content and to wrap them within the viewport for me. To get to the sidebar I need to scroll right but, once there, the content wraps nicely. The same is true for liquid designs where a min-width is defined.

So for me, on my Nokia e51, fixed width websites work better than percentage-based liquid designs that don’t have a min-width defined. I don’t have an iphone so can’t comment about that but would be interested to know of your experiences on a range of different small-screened devices that attempt to render HTML and CSS.

So, in addition to the excellent advice from Roger Johansson on setting a max-width, I’d like to suggest that all liquid layouts need a defined min-width for viewing on small screens.

To understand what I’m talking about, make your browser really small for the following liquid-width websites:

• Meyerweb.com
• Adactio using the hirnlego theme
• Vivabit

GuyWeb.co.uk is the personal website of Guy Carberry. It’s been here since 1999 but this is the most minimal it’s ever been. You wouldn’t believe I’m a web designer for the Open University would you? Alas, I’ve been so overloaded with work lately, including a few freelance gigs that my own website has had to take a bit of a backseat. It’s been on the backburner for about two years now. I’ve made plenty of promises that a new design will pop along soon and maybe something interesting to read but I’m done promising now. At somepoint there may be something here.

for the time being..

• Photos on Flickr
• Friends on Facebook
• Bookmarks on Del.ici.ous
• Music on Last.fm