A Family Business

In January Susan and I decided to leave our current employment and go freelancing as iFamily. At around the same time Andy Clarke and Anna Debenham started a new podcast focusing on the business end of web, design and creative industries; Unfinished Business.

Unfinished Business

Unfinished Business has been invaluable to us. Even though there are two of us running our Ringwood based web design company it can get a little lonely. It is so refreshing to hear two well respected web professionals share their experience of working freelance. There are of course lots of resources and podcasts on the creative side of web design. I particularly enjoy Jeffrey Zeldman’s, The Big Web Show. But aside from Unfinished Business have found very little else about the business side of web design and development. The problem with this industry is that we are all more than happy to share our techniques and tricks but we are often a little bit more secretive about the pounds and pennies. So I thought I would chime in about some of the points and products discussed on their show, from iFamily’s perspective and also mention some of the ones we use.

A message from our sponsors

One of the highlights of their podcast for me, is when they share some of the tools of their trade. They find some really great sponsors. I am quite astonished by how much stuff I have bought as a result of listening to their show! Two have become indispensable to me already; FreeAgent and Perch. I know Hammer for Mac will also be adopted by iFamily soon also.

Perch

Perch was the first sponsor of Unfinished Business. I had heard good things about this CMS system before. But after hearing the praise that Anna and Andy reaped on it, I tried the demo. I have since bought two licences and created two websites with it. In both cases Perch has been a perfect fit. I could have used WordPress but sometimes Perch does just enough and is wonderfully easy to work with. WordPress although very capable is a behemoth. The learning curve on Perch is a lot less steep and even after a relatively small time I was really enjoying working with it.

FreeAgent

We knew we needed to manage our invoicing and finances well. We didn’t want to generate invoices in Pages. Like Perch, I had heard some good things before about FreeAgent, but Anna Debenham was very positive about it in the podcast. I then coincidently picked up a flyer from the Altitude web conference and promptly signed up. It is brilliant. You can hook it up to your bank account and it’ll auto-magically feed into it. Invoices are easy to generate and it also works with timer apps too so you can monitor exactly what you have been doing. Accounting might never be fun, but FreeAgent is invaluably so.

Sign up to FreeAgent and get a 10% discount with referral code: 42v393mf.

Hammer for Mac

Hammer for Mac is another really clever and interesting app that the dynamic duo have introduced to iFamily. To be honest I haven’t bought it yet. (Edit: I have now) I have just been using a demo. But it really is a great new way of working on front end development. So I will probably buy this real soon as it looks like a very useful tool. I have also tried Andy Clarke’s new mobile first boilerplate, which is beautifully executed and is a great template for any new project. As you might have guessed it plays nicely with Hammer for Mac. I predict a SASS, Hammer for Mac and Rock Hammer learning session will be something I will be doing very shortly.

Home Work

We have been working professionally on the web since 2000 but have only been working freelance for a few months. Susan and I incorporated iFamily Web Design Ltd in March 2013. Leaving a regular pay cheque is never easy. We hadn’t even planned going freelance. So we had to hit the ground running, and fast. The following are some of iFamily’s most valuable and useful tools and resources that may or may not have been featured in Unfinished Business.

Time after time

I wanted to track my time. It is very easy for web workers to procrastinate and get distracted. No, I am not talking about porn. Working in this industry means there is always something new to learn. It is like painting the Forth Bridge. On crack. Nowhere near as dangerous or physically challenging but it is a continual process. As soon as you learn something, some other clever Dick has created a new way, and we start again.

Eon

Eon seemed like it might help me keep a close eye on my time. Eon is a simple little desktop app, and you can buy a plugin for it that hooks right into FreeAgent. If you leave your desk on your return it asks if you would like to knock the time back. Which I do religiously. If I start learning something new which will benefit me after the project, then I turn the timer off. If this will only benefit my client’s project I might keep it on.

Doing the time warp

What is totally surprising though is that after you might have been toiling at your desk for 8 or 9 hours a day; I am only totting up 5 or 6 hours of paid work. Maybe the timer is wrong? I don’t think so. I am sure I will find this app more and more useful in future especially when quoting for new projects. I can always look back at how much time I have spent on something and price accordingly.

Show me the money

I was introduced to Cole Henley whilst attending Andy Clarke’s Hardboiled Web Design workshop a couple of years ago. Andy suggested to us that we all follow Cole on Twitter as he is hilarious. Which is an understatement. But Dr Cole has a serious side too and he produces and curates the most excellent Freelance Rates Survey and the great Freelance Rates Calculator. I now use these as yard stick in order to calculate a day rate for our work.

Good company

We decided to register as a limited company and at the same time bought a mailing address from Registered Address. So now our official address is in London. We also use this address to hide any domain name registration addresses from the world. We are only an hour and a half from London so could easily do client work there. But for the most part we are going to try and work a little bit more local than that. We want our local economy to benefit from our expertise too. However it seems getting a registered London address is cheaper than getting one in Ringwood.

Design is a job

If you are not easily offended, and are not particularly religious you have to follow Mike Monteiro on Twitter. He doesn’t pull any punches. Neither does his book, Design is a Job. This is really great. I particularly like the chapter on “Choosing the right clients”. This suits are philosophy here at iFamily. We don’t want to battle with our clients. So, from the outset we find only the best people or businesses to work for.

Stop! Thief!

In Unfinished Business, Andy Clarke revealed how someone has used his artwork on their website. He has explained how he has tried to politely ask for the content to be removed, but it seems that this is falling on deaf ears. My old employer, iChauffeur used to suffer from this all the time. Pictures of our cars, text copy and more were often pinched. I have even seen people advertising for developers who can clone the entire iChauffeur site! I used to spend a lot of time asking people to take down this content. I used to actually enjoy calling them, asking if I could hire the actual Rolls-Royce shown on their website. Could I have that actual car? They would soon fall to pieces into a stuttering mess when I told them that it was actually my vehicle. One resource I started using, and which gets immediate results is the Removing content from Google tool. You have to be sure you own the copyright, and you have to report each url individually. I often would use the WayBack Machine in conjunction with this to prove that we had published something first. But boy does it get results. I know Google are not the only search engine. But their dominance means you can effectively stop the thief in their tracks. Sure, they can keep publishing your stuff but their pages will be hidden from the Google index.

I had one large competitor call me complaining about what we had done when we reported several of his websites. He even suggested that I call him first before we reported any more sites, just to make sure it wasn’t one of his first! Some of this plagiarism actually worked well for us. They would often link back to us inadvertently, and sometimes we would not take any action against them because of this. But most of the time it is just one more thing to eat into your day.

Useful resources

[unordered_list style=”star”]

  • Growing your design business
  • Getting Clients

[/unordered_list]

A Responsive Day Out

Uncomfortably Numb

I was slightly uncomfortable before heading off to Jeremy Keith’s Responsive Day Out. Maybe even a little bit more anxious than that. The last time I visited Brighton I got a bottle smashed over my head. The subject of Responsive Web Design thankfully doesn’t make me too uncomfortable now; especially after listening to Jeremy talk at Altitude two days previously.

My Generation

In some ways I suspect the older generation of web guys and gals may have an easier time digesting what is happening with this new fangled responsive renaissance. I am now slowly coming to terms with the fact that along with my greying hair, I am now from the old school of web design. My meme does not groove to the Harlem Shake it is more of a Shuffle. I am that grouchy, semi-retired, old plough horse, chewing crud, while watching the young stallions jump and play.

Hotel Broadband

I was born before the world wide web and even before Google if you can believe that. I remember why it was once called the world wide wait. My teacher Miss Dial-Up made me scrape “I will compress my images” twenty eight point eight thousand times onto her dusty blackboard. I used to hate her strict, spinster ways and iron like grip. But somewhere along the way I got fat. Too much easy living in Hotel Broadband meant I could no longer touch my toes. Nights spent cruising down ethernet highway, drooling at the big glossy billboards has been the ruin of many a poor boy. I didn’t study hard enough in Miss Dial-Up’s class. I didn’t quite get what she tried so hard to teach me.

Little Boxes

Some of the first generation have never stopped designing fluid websites. Mr Keith is one such person. He has always done it this way. The web was never meant to be fixed it was always fluid in nature. Perhaps this fluidity made it uncomfortable for us? Maybe it is in our human nature to want to frame stuff, measure it and put it in nice and tidy little boxes? Maybe this was why we had such a hard time saying goodbye to our much beloved table tag as a layout tool? The very reason why web standards had to fight the good fight for so long? We resisted but finally we could not grasp on to our precious cells any longer and we all eventually had to let go sinking into one glorious flow.

We Were Experts

The separation of content from style was complete. It was done. Or was it? Had we not just found more techniques to box up our websites? Everything was sweet, the sun shone, we honed our workflows and refined our methods of making stuff. We were experts again. That is until Mr Jobs shook our world up like one insanely great snow globe.

All Aboard

We had all sneered at the early mobile web experience with her braces and awkward manners. We jumped eagerly off the WAP train and went running to the arms of this sexy new model from Cupertino. We groped and fondled like teenagers with big wide grins and sweaty palms as we steamed towards the tunnel of love with our hearts beating wildly. But then somewhere along the way we discovered her sexy curves were a smoke screen. It took us a while to discover that all that we thought we knew was wrong. Except maybe it wasn’t. No she wasn’t doing our best mate; she was doing the whole planet.

How The Web Was Won

At some point the web had become something anyone could do and they could do it anywhere. It was now not something that nerds did behind closed bedroom doors. Our parents and kids were now doing it too. The whole world was now caught up in this web. Tim Berners-Lee’s masterpiece was complete.

Enlightenment

Some of the lessons we thought we had learned whilst exploring the CSS Zen Garden were the wrong ones. Sure, some people, Jesus, Buddha and Jeremy Keith have been enlightened all along. The rest of us had read the same bible. But maybe we all looked for the easy answers. The answers we wanted to hear. The easy way out. We thought we got it, and we largely did, but with one caveat; the web is not fixed. Maybe our heads were not ready to accept this until we took Ethan Marcotte’s RWD laced trip. We have all been super-freaking-out-man ever since, well all except Mr J. Keith and Mr J Zeldman.

Love Thy Neighbour

Mobile friendly, Future friendly, Fluid Friendly. We now knew we had to embrace everyone, yes even fridges, sat navs, game consoles and even those BlackBerry bastards. Love thy neighbour is the only way. The future is fluid baby. It is wet and wonderful, but you just have to take that leap of faith and fall backwards into the flow. You will be supported by the billions of devices of all race, colour, dpi and size. We can all get along swimmingly. We can now look back laughing and joking about how we used to hate I.E.

Brighton Rocks

I got a bottle over my head in Brighton because I was in the right place at the wrong time. I didn’t go to Brighton to beat up mods or pick a fight with a rocker. I somehow got tangled up in a boozy stag night fight on the sea front. The experience has not tainted my love of Brighton. Walking around her lanes yesterday, I really enjoyed her energy and style. I can see why so much of my industry live and work there. I love the bicycle, guitar and vintage comic book shops and the delicious Iydea veggie cafe in particular. #RhubarbGuitar

The Young Ones

I even can accept the concept that even the younger generation of web developers can have something meaningful to say. Especially the young whipper-snapper Mr Josh Emerson and his asset fonts plus his work with SVGs.

I really enjoyed Mark Boulton’s talk, yes it is good to feel a little uncomfortable. Owen Gregory’s musical and screen size theories struck a Townsend like power chord to my ears. David Bushell’s hamburger menus, Richard Rutter’s font loading strategies, Anna Debenham’s console expertise, Tom Maslen’s html4 within html5 markup for the Beeb plus Elliot Jay Stocks and all the other wonderful speakers made the Responsive Day Out, a day I would like to repeat.

The Master Blaster

All were great, but could anyone really top Bruce Lawson? His energy, hairstyle and beautiful icons were top notch. Plus he is an old geezer too. Where can I get some pink hair dye?

Speaker Presentation Slides

Altitude 2013

#AltTag

I had always admired the Spinnaker Tower design in Portsmouth. But I have an almost Hitchcock-like fear of being high up. I went up Tower 42 once in Canary Wharf, and I could barely stand. I had to fight my natural inclination to drop to my knees. It was only shortly after I had signed up did I realise why Dan Edwards (@de) and Tom Kentell (@Lletnek) had christened it Altitude.

I had another Duh! moment too. After collecting my beautiful lanyard from reception we were ushered through the lift into a glass walled room like as shown on the Altitude site. I enjoyed the complimentary Pimms. I eagerly gulped the mixture to try and steady my nerves for the ascent. See, I was under the impression that the whole room was going to lift off, like some kind of twisted Charlie and the Great Glass Elevator nightmare. After my second glass my nerves were a lot better, and I joined the others in the lift. Maybe a couple of drinks is all I need to pursue my dream of being a pilot?

My courage paid off. Not only were we given even more free drinks and some tasty morsels. We were entertained and inspired from our lofty view over Portsmouth harbour by the legend that is Paul Boag who interviewed four very different, and interesting web people. Namely: Robin Christopherson, Mike Kus, Sarah Parmenter and Jeremy Keith. Here are my notes. They might not make much sense to anyone who wasn’t brave enough to make it to the top of the Spinnaker though…

Robin Christopherson

@USA2DAY
Robin was first up under the spotlight. He is Head of Digital Inclusion at AbilityNet.I have been aware of accessibility for over 10 years as a web designer. I have seen many people talk about what we should or shouldn’t do. But Mr Christopherson really showed me how empowering technology can be; when beautifully designed and built to be inclusive from the ground up. Take a bow Apple! It was truly amazing to see what well designed products, and in particular iOS including VoiceOver could do for blind people. He was also waxing lyrical about the potential of Google Glass, and even autonomous cars.

RNIB then Ability Net
We shouldn’t build for disabled people.
Main site should be inclusive
Use personas
TABS temporally able bodied
Apple fan boy – love from disabled people is tangible
Doubled battery life
He can take pictures using the camera.
Apple maps app inclusion is hard baked in
The sdk is inclusive not just iOS
Flash is evil!
Mobile sites are great. Stripped down is great.
RWD
Teenagers want a cut down experience
2.5 minutes for Verge website to load
Readability helps
20 lines of sharing twitter etc
Google Glass
g.co/glass
Intelligent camera – Object recognition
Emotion recognition – better than humans – autism
Autonomous cars are licensed in Nevada
Berlin have driverless taxi
No accessibility in windows 8 phone

Mike Kus

@mikekus
Web designer
Freelancer
Striking colours and shapes
Large canvas then reduce
The copy is the one thing
Tell me everything

Sarah Parmenter

@sassy
Native is expensive
Hamburger menu
44 is the magic number
Gradients more subtle than on web
Navigate from bottom using thumb
One buffer week per month
3 weeks per month work then one week off
Start with smaller screen
Charges on a hourly
15 hours before end of time email client
Every day she emails client every day, did this today and will do this tomorrow
Go squared analytics

Jeremy Keith

@adactio
This man is an absolute fecking genius. It’s funny, I really enjoy, and make good use of his HTML5 For Web Designers book for A Book Apart. But I forgot that he is Irish! I will re-read the book in a nice gentle Irish brogue.

Starting with the url design and using this as an api is something that I have been gravitating to myself for awhile. But Jeremy nails the method so firmly, eloquently and succinctly. His design approach is one that I will ape from hence forward. Can’t wait to see what he has cooked up for us in the Responsive Day Out tomorrow!

Has always built liquid sites
Content first start with articles or the task.
Start with url (api design)
Start with content hierarchy
What does the user want first?
Start with colour and individual elements
Then do layout
Content does not mean copy it can mean the task
HTML5
Responsive images
Justify images, there is a price to pay
2 proposals a new element
Svg and icon fonts
If you have to have in page images: optimise the hell out of images
WebKit mono culture?
URL design human readable portable hackable dry