3 ways to make your site stand out from the crowd

Too many websites look the same as their competition. If you want users to remember your site it needs to stand out from the crowd.

I recently gave a presentation entitled the “10 Harsh Truths About Institutional Websites“. One of the point I made was that all Higher Education websites look the same. Nobody is innovating when it comes to design.

Screen captures of 9 higher education websites

However, the problem is not just limited to HE. Almost every sector has a design style. Why is that?

I believe there are 3 reasons:

  • Laziness – It is easy to follow the crowd blindly. To stand out you must innovate and challenge established practice. That takes effort and a lot of thought.
  • Fear – A fear of getting it wrong. What if you upset your users? What if you misjudge what they will like? Its safer to do what others have done because that has been proven to work.
  • Shortsightedness – Too many organisations only look at their own sector for inspiration. They look at what the competition is doing and copy it.

The problem is that if you follow the competition, you will always be one step behind. At best you will be invisible, at worse you will be a poor shadow of your competitors. To create a site design that stands out from the crowd and resonates with users you must take some risks.

Unfortunately this can be hard to do. We can become blinkered in our thinking, convinced a site should look a certain way and have a particular kind of layout. However, there are plenty of examples of sites that break this mould successfully.

Screenshot of Biola Undergraduate website

How then do we join the ranks of designers and website owners who think differently? I suggest there are three ways:

Constantly seek inspiration

The first step in thinking differently is to expose yourself to different types of design. It is easy to only look at your own site and that of your competition. Broaden your horizons.

A lot of people start with CSS galleries and they certainly have their place. However, in my experience you have to work through a lot of crap to find the truly stunning sites. Instead I subscribe to sites like Smashing Magazine, Webdesigners Depot, and Sitepoint who tend to do a lot of “Top 10 inspirational sites” posts. In these posts the author has done all the hard work for you by weeding out the dross and leaving only the best examples.

If you are looking for a specific design style I would also highly recommend Design Meltdown that organises inspirational web sites by categories such as colour, structure, elements and style.

But why stop there? Why limit your sources of inspiration to other websites? What about photography, architecture or print design. ffffound.com is an excellent source of inspiration. It is a massive collection of imagery from every source imaginable, bookmarked by members who consider it interesting. Another similar site is Emberapp which contains illustrations, logos, icons, typography and much more.

Finally, I would also encourage you to carry a camera and look for inspiration in the world around you. Once you get into the habit it is amazing how much inspiration can be found in everyday things. Even sitting here at my desk there are the colours of my houseplant’s leaves, the book cover next to me and the typography on my energy drink. Inspiration is everywhere if we get in the habit of looking for it.

A photo of the houseplant on my desk

But the problem is not just inspiration. It is also the fact we self censor.

Stop designing websites

Part of the reason we struggle to create original design is because we self censor. Recently I shared my personal inspiration library with the designers at Headscape. The response I got back from one of our designers was fascinating:

A quite beautiful collection of elements none of our clients will have the courage to ever use!

It is certainly true that Headscape work for some very conservative clients. However, there is a danger we give up without trying. It is easy to slip into the same old routine because we have convinced ourselves that nothing more is possible. We have a navigation bar, header, footer and content area in the same old places because we know that will get approved.

Even if we believe a client might approve something more adventurous, it can be hard to change our mindsets. After all, websites are meant to look a certain way… aren’t they?

When I was recently discussing this problem with Mike Kus from Carsonified he came up with a brilliant suggestion:

Next time you brief your designers tell them they are designing a poster rather than a website.

Although I am not sure my designers would appreciate being lied to (and I don’t think Mike was suggesting it seriously), it is a superb idea.

Too often we are constrained by the web. The need to add the same old elements and be confined by the same screen resolution. Letting go of that and designing for a different medium (such as a poster) is a superb way of encouraging creative thinking.

In Mike’s article “Web Design is a Journey” it surprised me how long it took his designs to look like an actual website. Where most of us start with a grid or wireframe, Mike starts with an image or other graphic element. He then shapes those elements into a website. It is almost as if he squeezes his design down into the constraints of a website. He certainly does not self censor.

The Stackoverflow website designed by Mike Kus

Of course, sometimes you will loose the battle and a client will insist on a super conservative design. What then?

Surprise and delight your users

Sometimes its just not appropriate to deviate too much from the norm. Does that mean your website is doomed to blend into the crowd? Not neccessarily.

Even when working on the most conservative of designs there is an opportunity to surprise and delight users in such a way that your site is memorable.

Paul Annett from Clearleft gave a stunning talk at SXSW 09 entitled “Ooo… that’s clever!”. He describes it as follows:

My talk was about design delighters and Easter eggs, about hiding clever little gems in websites which people will find, enjoy, and share with their friends. The benefit of this is an intangible viral marketing effect which will help engage your audience and build hype around your product or service.

Adding these little touches makes your site memorable and can be applied to almost any site, no matter how conservative th

e design. One example Paul gave was of innocent smoothies. Although the packaging of these drinks is certainly nice, they do not necessarily strike you as extraordinary. However, look at the bottom of a carton and you will be greeted with one of a number of amusing messages.

View of the bottom of innocent smoothy carton where you can read the words 'Stop looking at my bottom'

Image Credit: Duncan

Once you have read one of these little messages you are unlikely to forget innocent smoothies.

Paul’s talk is packed with examples like this and I highly recommend watching it.

Just by adding some of these little extras you separate your site from the competition in the minds of your users. You become memorable.

Conclusions

At the recent FOWD Tour, Elliot Jay Stocks commented on how boring most websites are, and how we need to innovate. I totally agree. We need to start exposing ourselves to more inspirational design, approaching the design of websites from a different angle and adding features that delight our users. We should not simply settle for what we know works.

158. Home

On this week’s show: We share the highlights of SXSW, discuss home working, and interview Rob Borley about project management.

Play

Download this show.

Launch our podcast player

Housekeeping

Headscape still recruiting!

Headscape is still recruiting. We are looking for an enthusiastic, talented developer to join our team, working from of our offices in Hampshire. For more information see the job advertisement on Boagworld.

Back to top

News and events

The best of SXSW

Well, SXSW is over and I am back in the UK. But what happened at the conference? What was the big news this year?

That is actually a hard question to answer. There is so much at SXSW that it is almost impossible to get a sense of everything that is going on. Even if you could attend every panel that isn’t always where the real action takes place.

The real conference often happens at the parties and in the corridors. In fact, more than one spontaneous panel was started via Twitter, thanks to official panels being full.

Panels this year ranged from the downright dull to all out flame wars! One that I unfortunately missed was "Is Spec Work Evil!". However, Marcus attended and tells me it was particularly fiery. Personally, I am very much against speculative work as I have said before. However, not everybody would agree and the panel seemed to reflect this diverse opinion.

One panel I did make was Paul Annett’s amazingly inspirational talk on Easter Eggs and design twists. The talk focused on the little things you can add to your site to make users go ‘oooo that’s clever’.

Too often I neglect such ‘bells and whistles’ in favour of usability and accessibility. Paul demonstrated how these different priorities can sit side by side without compromising each other. He showed some great examples including the hidden arrow in the FedEx logo and the vines on the Silverback website.

fedex logo

The final panel I want to mention is ‘Being a UX Team of One‘ by Leah Burley of Adaptive Path. To be honest the title of this one was a little misleading (at least from my perspective).

What I took away from this session was that design should not be a solitary activity, solely reliant on the creative inspiration of one individual. Leah seemed to be arguing for a more collaborative approach especially at the wireframe stage. She proposed that all of those involved in the project should sit down together and hammer out the wireframe designs.

This addressed two separate problems we have been having at Headscape

  • The developers concerns at not being involved early enough in the process.
  • The question of who should do wireframing – the designer or the IA person.

Best of all Leah’s presentation was very pragmatic. She provided lots of practical approaches that encourage idea generation and collaboration. I highly recommend listening to the podcast of this when it is released.

Browser testing and IE6

In other news, there seems to have been a lot written about browsers this past week. Three stories in particular caught my eye…

  • .net Magazine seems to have hopped on the ‘dump IE6′ bandwagon – My opinion is the same as that of Jeremy Keith as expressed in last weeks show. It is not a matter of dropping IE6. We should instead being deciding whether we wish to offer it the same level of support as modern browsers. I am entirely in favour of providing IE6 with a basic stylesheet that avoids its shortcomings. However, I dislike the idea of dropping it entirely.
  • Microsoft has released SuperPreview this week that allows Windows users to test different versions of IE simultaneously. I have to say this looks like an impressive tool. It allows you to view IE6 and IE7 side by side. It also has many other tools that may also be useful. Support for IE8 and other browsers will follow and although it is currently in beta, I think it will quickly become an indispensable tool for Windows based web designers. Just a shame there is no mac support!
  • Finally, Sitepoint have written a brief outline of how to create the perfect browser testing suite. Ideally for those starting out it lists various online browser simulators, virtual machines and desktop browser emulators.

Browser testing continues to be a pain in the neck and I for one would be willing to pay for a decent way of streamlining this whole process. This is especially true now that IE8 has been officially released and we have another browser to add into the mix.

Screenshot of Superpreview

A simplicity case study

A few weeks ago I wrote about the importance of simplifying your website. Well, this week Gerry McGovern has written the perfect case study to support the argument I was putting forward.

Removing poor quality content increases customer satisfaction‘ talks about how the Microsoft website consists of a staggering 10 millions pages. Of those pages 3 million have never been viewed!

The post goes on to explain how the Microsoft Office team took a different approach with their site by removing irrelevant pages. According to McGovern…

By weeding the garden, the top task pages became easier to find. But just as importantly it became harder to find a minor task page when you were looking for a top task page.

In short, removing pages reduced noise. Disturbing though it sounds, I think we could all learn something from Microsoft’s example.

An introduction to Microformats

My final post today comes from Richard Rutter’s blog. It is basically an introduction to Microformats aimed at the non-geek. He wrote the post because he recently found himself trying to explain microformats to a client and could not think of a good post that covered the subject from their perspective.

Personally, I am not sure it is necessary to tell a client you are implementing Microformats. The cost of adding them is so small and the benefits so hard to explain, that you maybe better off just doing it.

That said, this is an excellent post and if you are struggling to understand the point of Microformats, this is certainly worth reading.

Back to top

Interview: Rob Borley on Project Management

Paul: So, joining me today is Mr. Rob Borley. Hello Rob.

Rob: Hi Paul, how are you doing?

Paul: Very well indeed. Good to have you on the show. It’s been a little while.

Rob: It has, It has. It’s weird hearing the show above you, um rather than being below.

Paul: Oh yes, because you sit upstairs, don’t you?

Rob: Indeed.

Paul: Do you actually hear it?

Rob: I do. It’s like have a little base bin ?

Paul: Awh. So, um, we have kind of been thinking for a little while that we need to get someone on the show to talk about project management. And the idea was we’d get some high profile web design project manager to come in and talk about web design project management. Then I realised, um, that I can’t actually think of any. You know, I really don’t know of any kind of web design project managers out there, other than obviously the people that work at Headscape.

Rob: Well, maybe there’s a gap in the market.

Paul: I think there is a gap in the market.

Rob: (unintelligible) celebrity project manager.

Paul: Well I think that’s somewhat of an oxymoron, but setting that aside, lets shift around a bit, yeah, so, um, so we thought, lets get you on the show. Um, now, you’re quite and interesting case because you started of as a techie.

Rob: Yes.

Paul: And you became a project manager.

Rob: Yes.

Paul: And, so, um, let’s start by talking about the role of project manager. How would you describe your core role? What is it that you do? I should know this I guess.

Rob: Well, you mean other than manage projects.

Paul: Ok, you just have to make a joke out of it. But you know what I’m getting at.

Rob: Yeah yeah. I mean, I guess, um, the main thing that we do is shovel shit, really. We deal with crap. You know, the main thing project manager would do is a filter between clients and the production team for the project. I mean, there are a couple of stages I guess. So you’ve got the planning part of the job, which is essentially working out what it is you need to do, um, making sure you got the results to do it, plotting a nice time line so they can all fit as far as having deadline. And then you’ve got the people said, because really project management is a people job. You need to know how to get the most out of all the people that are in your project team, um including the client. You need to include the client in your thinking, always. Yah, that’s essentially what we do.

Paul: Yah. It’s a people person thing. I always thought you were so charasmatic. Ok, so, I mean, I guess the question is, if you look at the kind of, if you look at Headscape, and the way that we’re organised, we’ve got four developers, four designers, and three project managers. I mean, that’s a lot of project managers. And, you know the question is, why, why have project mangers at all? Why couldn’t the designers and the developers do the job? Why couldn’t it be spread across multiple people? Justify you exsistance, Rob.

Rob: Yeah, this question kind of makes me nervous here. I feel like I’m re-interviewing for my own job. Not that I interviewed in the first place, but, I guess in one sense, if you were in a small project environment, you could almost get away with one person. If, you know, its a one person job, you could get away with them managing themselves for a limited amount of time. Um, but, as soon as you get beyond jobs which are more than one person, um, and go on for an extended period of time, you start needing to provide some glue to stick things together. You need someone whose got an overview of everything that’s going on. You know, the developers have got a very developer mindset about the way things happen. Designers are the same way, they know about the design stuff. Um, but actually translating what the client wants and feeding that into both areas and bring them together is what’s missing, if you don’t have a project manager.

Paul: So, to some degree, project management becomes necessary with scale. The bigger the projects, and the more complex the projects, then the more a need for a dedicated project manager.

Rob: Yeah, definitely. I mean, I guess the real role of a project manager in these situations is the facilitator. You’ve got all of these tools which are basically your resources, your developers, your designers, um, and you need to be able to enable them to work effectively together to produce what the end product is going to be.

Paul: So here’s a question that I didn’t pre-give you, in advance, which is always the best type. Why, why, why become a project manager? What made you – because you were heading up our technical development team, you were, you know, you were doing very well. Why did you feel the need to get involved in what you call shit shoveling?

Rob: Well, I think my main motivation was, Headscape was growing, and we started employing all of these younger, more dynamic, much more talented, better looking developers, that were basically going to show me up. So I figured that before I got shown in true light that I was going to need to move somewhere else. Um, no, well that’s partly true. Really, I think, its the people’s aspect that I’m really interested in. A good project manager is someone who is able to understand how his resources or how her resources work and how your clients work, and joining the two together. Um, while I quite like writing code really, I’m not passionate about it. So that side of it, you know, I reached as far as I wanted to go, and I really enjoy the people thing.

Paul: Ok. So what other, I mean, what other kind of characteristics do you think make a good project manager, obviously the people skills you talked about, what other, I mean if there are other people out there going well actually I’m not that passionate about coding, or I’m not that passionate about design, but I am passionate about the web, I do like the web design process, perhaps project management is the way I ought to be going. You know, what skills, what characteristics do they need, what personality traits do they need?

Rob: I think well, you need to be able to plan. Um, you know, planning is very very important. If you plan well, then your project will usually go well.

Paul: I like the cornification in that.

Rob: You have to be able to predict the future is helpful.

Paul: Yes.

Rob: A major part of what we de in the planning stages is assessing risk. You know, so, we’ve got what we’re starting with, we’ve got what we want to achieve, and we’ve got a time scale, now we need to work out what things might appear that are unforeseen, which are going to affect us reaching the time scale. So being able to foresee the future is helpful. Um, and so planning, being quite analytical and thorough. The logical background I have from being a programmer, a developer, is really helpful because you have to approach project management in a very analytical way, to make sure you don’t miss things. So there’s that side of it. And then there’s communication skills. You not only need to be able to communicate with a client affectively so they show that you understand what they want, um, and they understand where you are with the project, and they’re happy because a happy client makes everyone happy. But you also then need to communicate that with the various personalities in your team. You know, whether thats the developers locked up in a dark room with no social skills, or the crazy charismatic designers who…

Paul: You’ve just gone with stereotypes that so don’t apply. If I look at our team, no offense to our designers, they’re the ones that sit in the darkened room with their nose right pressed against the screen. And the developers are the ones that are crazy and never do any work.

Rob: (unintelligible) something about reading personalities. No, but you see my point. You’ve got these almost extremes, especially in the web, I guess, in the web world, you’ve got these extremes of personailities which somehow you need to be able to communicate with and put it all together and so, yeah, that’s an important skill. I think the third area, is to be quite relaxed about life. Because things will go wrong and do go wrong, it doesn’t matter how well you plan and how good you are at predicting the future. Stuff will appear that is completely unforeseen and will completely throw (unintelligible). And everyone gets really upset and people will shout at you and it goes a bit nuts. Um, and if you go nuts as well, you project team falls apart, because they look at you as the calm rudder in the storms of life. I can feel my other project manager buddies laughing at me, um, but if you’re calm and you can not get stressed at that but actually see, try and find a clear path through a very stressful situation, then really helps.

Paul: I would so be the worst project manager in the world. I’ve got the attention span of a newt, I’ve got no organisational abilities and I get stressed at everything. So overall, I think I’d fail.

Rob: Yeah, stick to web celeb.

Paul: Yes, I’ll come up with some other title that sounds good. Um, ok, so you talked about this really is, I can honestly say, a foreign area to me. Right? You talk about planning a project upfront. I’m not a planning person. Right? And there seems to be so many variables involved in a project and so much as you say, that can potentially go wrong. How do you plan it? I mean, you know, the kind of thing that you always talk about, when you talk about project management is endless gantt charts that seem to be outdated in about 5 minutes, sort of kicking a project off. How to you effectively plan a project?

Rob: Um, well, we do use a gantt. We always start a project with a gantt. And, um because it seems like thats what project managers are supposed to do, so we justify the time with a gantt. Um, but you do need, um, I think assessing risk is something that is vital in successful project management. Its something that we’ve been doing at Headscape, um, increasingly more over the last year or so otherwise this need to actually spend time highlighting what could actually go wrong here. So, you look at, I’m not going to be able to think of any examples now, but a particular, let’s say you building a shop or something. So potential things which could delay that project would be: the client not getting around to telling you what the products are on the shelf and content population is a big risk on meeting a project deadline, because it is out of your control. So, its like, I need the content by this date, and he needs to put the content in by X date. If the client doesn’t do it, there’s nothing you can do about it.

Paul: I’m guessing integration must always be a big risk. Integrating with third party applications.

Rob: Exactly, so if you’ve got some sort of third party database or a web service you’ve got to pull in, something that you’ve done a bit before, but you don’t know anything about, that’s a risk. Because you can guesstimate what’s going to happen, but its unforeseen. And so, the trick is basically, to find all the tasks that have these risks and then multiply (unintelligible) an hour by some random number. And then make the rest up as you go along.

Paul: So what about once the project gets going, how, what techniques and tools maybe do you use for monitoring and controlling the process and trying to keep on top of everything.

Rob: Yeah, I mean, there are lots of tools out there, obviously, lots of funky web-based ones, um, there is no substitute for talking to you team. Um, trying to (unintelligible) email or basecamp or something is impossibly without talking to you team. So, communicate. It’s a big part of what we do. You have to talk to the people doing the work, you have to talk to the clients, um you have to keep the lines of communication open. Um, but as far as actually keeping track of what’s going on, we do use basecamp, um which is great for managing lists, basically, you manage lists. So from our gantt shell, we’ll break it up into a series of tasks if you like, wide areas, um, and then, (unintelligible) ask people to add comments to them and take them off and then we’ve got kind of an overview of where our project is. Um, and hopefully from there, and when we’ve got the gant shell, we’ve got some dates, some milestones and reminders like you should have done this by then, um and so, you use that to kind of keep track of where you are.

Paul: Cool. What about, so that’s kind of dealing with the internal side of things. What about when it comes to the client, I mean, you talked about, you said earlier, a happy client makes everybody happy kind of thing. So what makes a client happy? What are the things that really, or perhaps turn it around the other way, what are the things that really piss of a client and where can it really go wrong?

Rob: This is really where the people side of it really comes in because every client is different. Some clients want you to talk to them for five hours a day, hold their hand, you know, spoon feed them, and some clients just want to know when it’s finished. So initially, when you’re kind of trying to assess your project team, if you like, your resources and what you’ve got, assessing the personality of your client early on, will really put you in a good place. Um, but, I guess, general principles, if you’re honest, it helps. Um, so, be realistic about what you’re telling your client is going to happen. Don’t promise the Earth by yesterday. Because then you won’t deliver and then they’ll get upset. If there’s going to be a problem, if things have slipped for some unknown reason, then tell them as soon as you know. Tell them as quickly as you possibly can. Um, manage their expectations is kind of the phrase that we use a lot. You gotta manage you clients expectations so that they’re not expecting something that you can’t deliver. And um, and then that limits the amount of upsetness that they get.

Paul: Slippage is a big one, isn’t it? This kinda whole area of things like, you know problems you kinda face, things, like slippage, scope creep, non-delivery, I mean, how do you have any kind of broad techniques for dealing with these kinds of things, or is it just kinda communications thing again.

Rob: It’s mainly I think a communication thing again. Um, part of the planning stage is trying to asses these risks and so you try and build in contingency to cope with those, and if you’re building enough contingency, you deliver the project early and that makes everyone really happy, even if its a long project, you deliver it early, you’ve exceeded their expectation also. Um, so I think, if somethings going to slip, I think you should say you’ve got to be honest. Sometimes things are just out of your control, so you’re two weeks before the end of a project, you in the middle of snagging, your lead developer goes down with appendicitis. There’s nothing you can do about that, and so you just need to communicate with the client and hope they take it well.

Paul: So wishing everything works out, I’m loving that approach. Ok, so, um, let’s finish of with a piece of generic advice. Either people starting out in project management or those that have had project management foisted upon them. You know, whats the kind of one piece of advice that you would leave for people?

Rob: Get to know your team. I think that’s the main thing I would say. Um, its kind of like, when you drive you car, you’re environment is a very organic, dynamic thing, you know what it really what’s going to happen and the only thing you’ve got to get you through it is that you understand you car. You know almost instinctively how it works, how to drive it it, if you get to that situation with your team, then whatever the project throws at you, you kind of, you can deal with it. If you understand how you client is going to react to a certain situtation, you can intincfully deal with it. And it keeps the stress levels low. You need to find ways of managing your stress levels.

Paul: There you go, that’s great advice. Thank you vert much for that, it was wonderful. I really appreciate you coming on the show.

Rob: My pleasure.

Thanks goes to Meredith Marsh for transcibing this interview.

Back to top

Feature: Home Working

I was recently contacted by a friend of mine Marieke Guy about writing a guest post for her blog on remote working.

I have been working at home for over 7 years now and am a great believer in the benefits. However when I actually sat down to write the post, I realised just how long it has taken me to find the right way of working.

As a large number of people who listen to this podcast work from home, I thought I would share my experiences to date and my hopes of where remote working will take me in the future.

The reality of home working

Back to top

141. Feedback

In this week’s show, Paul Annett joins us to discuss how he pushes the boundaries of CSS and we look at how to improve your website through user feedback.

Download this show.

Launch our podcast player

News and events

Working from home

I suspect the vast majority of people listening to this podcast spend at least some of their time working from home. In today’s world, doing the type of work we do, there is no reason not to.

However, home working is not the utopia some believe. It has its own challenges and problems. For me it is a constant sense of guilt that I am not pulling my weight in the business. For others it is a lack of motivation or fighting the distraction of housework and family.

With some many of us struggling with the relatively new environment of home working it is great to see people sharing their experiences in a new A List Apart article (Working from home: Readers respond).

This article has some great advice and although it contradicts itself in parts (different people deal with home working in different ways) it is full of ideas that I either already implement or will be soon.

While I am talking about A List Apart I want to quickly mention "Progressive Enhancement with CSS". This is a follow up article to "Understanding Progressive Enhancement" an article we mentioned in an earlier show. It is a great article that explains one possible technique for ensuring your CSS squeezes the best out of as many browsers as possible. If you have a chance, give it a read.

Everything you know about CSS is wrong

Talking about CSS, yet another book on the subject has been released this week. However, this one is different. Written by Rachel Andrews and Kevin Yank, "Everything You Know About CSS Is Wrong" is aimed at web designers who already know CSS well. The emphasis is on emerging techniques and future CSS support.

I haven’t read this book yet (although I do have it on order), but it looks very exciting. It has been a while since I have got to experiment with CSS and so this will hopefully point me in the right direction.

It tackles subjects like Internet Explorer 8, CSS tables and CSS3. These are all topical subjects and so the book appears to have a lot of potential.

I will review the book once I have read it and we intend to get Kevin on the show to talk about some of the techniques.

Reduce your business costs with free stuff

With the economy in tatters and a general sense of impending doom, we are beginning to see posts on how to cut cost and tighten belts. One such article is "Reduce Your Business Costs With Free Stuff" on the Think Vitamin website.

The article is a mixture of ideas on how to save money in your business. Some will save you thousands and apply only to larger companies, while others save only a few pounds a month. However whatever type of business you run, from a humble part time freelancer to a multi-national design agency, there is something in here for you.

Ideas include:

  • Cutting costs on your phone system without reverting to VoIP
  • Subletting office space
  • Open source versions of basecamp, Microsoft office, campfire and much more
  • Moving email and hosting in house

Although I think some of the suggestions are somewhat short term (Managing email internally would quickly become an expensive headache) I generally agree with most of what is suggested.

If you are beginning to feel the squeeze then this one is worth the read.

HTML Email: What mail clients are people using?

Finally this week there has been an interesting evolution in our understanding of HTML email clients. This has been nicely summarised by Alex Walker on the Sitepoint blog. He writes:

There are lots of reasons for hating HTML Email, but perhaps no#1 on most people’s hit list is having to produce HTML Email to deliver to potentially hundreds of different mail clients and configurations.

Now, clearly it’s completely impractical to test your work on hundreds of mail rigs, but the question is, where do you draw the line? Generic browser usage statistics are reasonably common, but mail clients stats?

In the past you could confidently make up whatever numbers you liked on those question without fear of being caught out. But that may be changing.

Litmus, who produce an excellent web-based browser and email testing suite are now publishing email client usage statistics from their new Fingerprint email analysis system. It makes very interesting reading.

Alex goes on to summarise the key findings which include:

  • 60% of people use web based clients
  • Just over 80% of the HTML email market is dominated by Outlook, Hotmail and Yahoo!
  • Business still generally stick with Outlook although they seem reluctant to upgrade to 2007

Interesting stuff.

Back to top

Interview: Paul Annett on Pushing the Boundaries of CSS

Paul Boag: Joining me today is Paul Annett from clear:left, good to have you on the show Paul.

Paul Annett: Thank you very much. Nice of you to have me here.

Paul Boag: So Paul is, with a few others from his company, the people who really make clear:left happen, rather than Andy and Jeremy and Rich, which we know, well Richard does work, but Andy and Jeremy certainly don’t do anything do they?

Paul Annett: Well, you know, they fly around the world a bit you know?

Paul Boag: Yeah that counts. I guess..

Paul Annett: No, we all chip in, obviously. Everyone does their fair share, so we say.

Paul Boag: Very diplomatic of you. I feel like I can insult them over this as I do the equivalent of no work in my role as well.

Paul Annett: I was going to say… Well there’s eight of us at clear:left, yeah we all just chip in. We’re all caught making the tea, that sort of stuff.

Paul Boag: Cool. Well tell us about your role. What is it you do at clear:left?

Paul Annett: Well, I’m a user experience designer. So that means, well it’s more than just making a web site look pretty, which were are accused of sometimes in the trade; to make sure that the sites are easy to use, as well as a pleasure to use really. That’s something that’s often overlooked with some web site design companies, obviously none of your audience.

Paul Boag: Obviously not.

Paul Annett: It’s a vital ingredient in the mix really. My job does overlap with some of the other guys in the office. Basically, we all know each other’s jobs fairly well so we chip in and share some responsibilities. My main focus is UX design. We’ve also got the others guys doing information architecture, they tend to start the project off with handing over wire frames or prototypes to me. Then once I’ve finished my bit I then hand over the designs to our front end developers who then code up the HTML and CSS. As I say we do overlap a bit more than that but that’s basically how it works.

Paul Boag: I’m quite interested in how that works. You are saying you don’t do too much HTML and CSS, or how does it work.

Paul Annett: I don’t do a lot right now, I used to when I was freelance before joining clear:left. I used to do pretty much everything on a project. I don’t do a lot now; I don’t really have time to. The occasions when I do get time to are when we are working on our own projects. I especially seem to have had a bunch of project holding pages or client holding pages in the past where Natalie and Jeremy who do the front end are busy doing other projects and we need to just get something up there while the design is being made. So I will code up that kind of thing. I don’t really get to work on a lot of the big life projects, but then I’m no where near as proficient as Natalie and Jeremy are at those kind of things. I think they would have a fit if they considered my code going live.

Paul Boag: See that’s quite interesting, isn’t it? You’ve begun to build a bit of a reputation as somebody that does-I don’t know-CSS embellishments for want of a better word on some of your designs. You know the kind of thing that other web designers go oh. The most kind of well known example would be the Silverback holding page where you have the clever resizing background How did that come about? Where did that idea come from?

Paul Annett: It comes from… it’s fortune, really, that I happened to be building that page because it was one of the holding pages. I always look for something unusual to do, or something that’s going to catch someone’s eye, that kind of thing. That particular technique was quite appropriate because the site has quite a niche audience, in terms of web designers. People who wouldn’t necessarily pick up on the subtleties and things that I like that are in there, they’re like hidden gems, wouldn’t care. Web designers seem to catch on to that, it’s something they haven’t seen before. The particular technique itself was just a happy accident, really, because I virtually designed the site, it’s a very simple little holding page with the gorilla icon, designed by Arch Nemesis podcaster, John Hicks.

Paul Boag: Well he designed our logo as well so he can’t be that arch nemesis

Paul Annett: That was fantastic drawing on it’s own. But then when I put the vines there, I was just thinking finally give it some kind of depth. I was fiddling around with some of the CSS, and because I don’t know, this is a benefit, because I don’t know CSS like the back of my hand. I do sort of dip in and out. I might make mistakes. Those mistakes might accidentally do something that makes me go oh hang on maybe I can actually use that for something, which is what happened in this case. I happened to position the only layer of vines that I had a percentage off the screen. It moved in relation to the grid. That got me thinking, well maybe I can do this with multiple layers of vines. I didn’t think much of it at the time, but I happened to mention that I had launched the holding page on twitter and a few people.

Paul Boag: All hell broke loose.

Paul Annett: Yeah the few people that follow me thought oh that’s nice and they twittered it, and other people twittered it. Before we knew it, a day later, we had 25,000 views on the web site and we were thinking wow we’ve hit something here. 50% of those people signed up for more information about our product, which it didn’t even exist yet, and the web site didn’t even say what it’s about. So they were just intrigued to find out more based on the what they had seen.

Paul Boag: So that caught you very much by surprise then?

Paul Annett: Oh yeah We were kind of overwhelmed. If it had been, in an anyway, some kind of planned INAUDIBLE machine, then we would have waited until we had actually started building the app probably. We had over 10,000 people signed up for something we were thinking we’ve really got to pull something out of the bag here. Hopefully we did.

Paul Boag: Well you do have very good feedback on it. That really demonstrates well the power of design, that even something that, let’s be honest, is maybe, gimmicky is not the right word but you know, isn’t fundamental to the functionality of the site, yet had a huge marketing impact. So it was very worthwhile.

Paul Annett: Exactly. These things, they are gimmicky. They’re things that people come back to and play with and just want to fiddle around and look at it again. They don’t mean anything. The idea is that they entertain me and maybe some other web designers. It just happened that it entertained 25,000 web designers.

Paul Boag: Is this something that you do regularly? Do you sneak things like this in a lot?

Paul Annett: It is something that I like to do, as I said, to entertainment myself. But I do now look for places where I can sneak these things in. I think I’ve always done it really. I always strive to do something unusual. Back in the days of my freelance site, which is nice-design.co.uk, which is still there but not updated since IE8 so if you are using IE8 it will break. Even then, that was one of the first sites where the header and the sidebar were fixed and it was only the content that scrolled. It’s an unusual thing to see, other than the framesets, obviously, back in the day. I always try to sneak these things in. And when I’ve been working here at clear:left, last year’s de-construct site where we snuck in an Easter egg. There’s a style switch on it, I don’t know if you saw it, but when the site launched it was like a wire frame and along the top there a time line which said the progress of the site as it was being built. It was played as if it was being built live as the event got nearer. The time line at the top was actually a style sheet switcher and we deliberately hid the mouse cursor and made it not look like a bunch of links so that if people found it by chance then they would be pleasantly delighted at the surprise of these extra designs on the site that they’d found. Actually we had a few people email us and say terrible usability, they don’t look like links and the mouse cursor doesn’t look like a hand when you move over them. They kind of missed the point, it wasn’t supposed to look like a link, it was supposed to be a hidden little gem for people to find. That got good feedback as well.

Paul Boag: It’s that creating a sense of satisfaction from a user that they found something special or you know, it’s that little bit of wow factor.

Paul Annett: Yeah. When people are then able to say their friends oh go on look at this, then they feel like part of an exclusive little club of people that are in the know. Definitely.

Paul Boag: You talked a lot of the Silverback example of how basically that came about because you were fiddling with CSS and then something didn’t behave as you expected it to and you saw some potential in there. So that was very much a technology driven way of coming to it. Is it always like that or are sometimes these things planned in from the start. I guess in others words, do you have the ideas and implement them or how does it happen?

Paul Annett: It really varies. Sometimes it’s design driven, like with the de-construct site last year, that was design driven and we wanted to have something which resembled the process that building a web site out there. The silverback one was kind of technology driven but also slightly design driven because I wanted to give it that depth. To take that one step further, I’ve used the same technique on the UX London site. UX London is another conference were running next year in June, uxlondon.com. The technique that I used on silverback is reimplemented there. There’s no three dimensional movement or anything like that, but as you resize the window, the logo changes color. That’s just done by having a transparent window through the logo in the shape of the U and the X, so as you resize the window, the background color behind the whole page slides sideways and changes the color of the logo. This kind of this could be done with Flash, it could be done with Java Script, but I don’t know Flash, and I don’t know Java Script, so it is me trying to find my own little work around and quirky way of doing things really.

Paul Boag: I guess the thing that you know when you start thinking about these things is browser support. Some of these things you are doing are kind of either very advanced CSS or very hackerish CSS so either way you come up with browser support issues. Do you worry about that or is it just that they’re extras and it doesn’t really matter.

Paul Annett: Well fortunately because the audience for the sites that we’ve done in this sort of extreme way are web designers so you know they are going to be using the latest browsers. They’re going to be using firefox and they’re not going to be using IE6. We wouldn’t go to that sort of an extreme on a client web site and everything that we do, everything that leaves our doors is valid CSS, valid HTML. It wouldn’t be allowed not to be if you know what I mean. We’re very standards aware as a company, but I do like to kind of push the boundaries on things a little bit and see what I can get away with. Not in anyway inaccessible, but just not very conventional and if it doesn’t work in IE6 and doesn’t work in other browsers then as long as we implement something that looks the same but without the effects then that’s fine. The silverback site, if you look at it in IE6 is just a gorilla in front of some vines, no movement, nothing lost. Nobody coming to that site will be like there’s something missing here, but they just won’t get that extra little embellishment.

Paul Boag: It’s that graceful degradation.

Paul Annett: Progressive enhancement really. Most people that do have the technology get the extra stuff. This isn’t a company policy, but personally I’m usually in the favor of, I’ve seen quite a couple of sites recently that had a browser upgrade nag bar where if you’ve got IE6 then it says hey just upgrade your damn browser, you’re missing out on stuff. We’d never do that, we wouldn’t put that on a client site here, but I might put that on my own site. I haven’t, but I might.

Paul Boag: Sounds like a good idea to me. What’s the kind of process you go through in getting these extras added in? Are they kind of planned in from day one. When you, say for example, did the UX London web site, did you have it in your head right from the beginning that you wanted to do this with the logo, or something occurred to you further down the design process? When did it happen, is it in the design stage, the build stage?

Paul Annett: With that particular one, that was something that I tried out on a previous site. It didn’t really work 100% and we thought we’ll do something else with the site. But I had it in the back of my mind that I wanted to do it from the start on that project. But in general, again it varies really. If, sorry to be so vague and unspecific.

Paul Boag: No no, that’s the nature of design isn’t it?

Paul Annett: One thing I do advocate is that with all our client’s stuff, as well as our own stuff, I always present mock ups in a browser. I never send out a JPEG of mock ups to clients because for start, they are going to view it at the wrong size, they are going to look at it in preview or some kind of windows equivalent, image viewer, and it’s going to be resized to fit their screen, so they’re not going to see it in the context of the web site anyway. Not only that, but it also gives you the opportunity to actually build part of the site so you might have the header as a flat JPEG and the footer as a flat JPEG and the left hand side as a flat JPEG but the right hand side, where you want some kind of interactivity, you could spend a little bit of time building that so that it kind of explains to the client that this is what I want to happen here, roughly. Obviously it wouldn’t be the final thing because you don’t want to invest that much time up front, to give them that little bit of insight. That’s what I do when I am building holding pages or whenever I do get the opportunity to do something like that in house here is that I’ll code up some bits I think is the unique, gimmicky bit of it, and all the rest will just be a flat JPEG. It’s just to sell the idea internally, if you like, and to have everyone gather around my Mac here and ridicule me and laugh at you.

Paul Boag: It makes sense that more and more web design that we are doing these days has got so many interactive elements with use of Java Script and various other things, that a static JPEG doesn’t always cut it anymore does it?

Paul Annett: No, exactly. Another thing we do to combat that here at clear:left is that we often build prototypes of a site, instead of having like a paper wire frame which we often do as well but if there are interactions that need to be explained to the client we’ll build a flat wire frame of it in HTML just using framework and Java Script libraries and simulate the AJAX side of things just with hard coded Java Scripts. It’s also not production quality code, but the prototype wire frame and the flat JPEG combined will give the client a better idea of exactly how the finished site will be.

Paul Boag: Sounds good. We’ve talked a couple of time about is this gimmicky, is this not you know… I’m quite interested as where you feel the line is drawn between good design here and tipping into that naff gimmick area. Do you know what I mean?

Paul Annett: Yeah. There are a couple of things that haven’t seen the lights of day yet, which maybe they will one day. I guess it depends on how much time it’s going to take and how much value it gives us at the end of the day. Using a similar kind of thing with positioning elements we’ve got these great big letters in the clear:left office and we regularly rearrange the letters that spell clear:left to spell different words on the shelf at the office. To simulate this online I’ve built a little page which has got the word clear:left across the page when it’s at full screen at 1024 pixels wide and as you resize the window all the letters swap places because they’re all positioned at different places at different percentages off the screen, blank bits of image and all this complicated CSS positioning going on. When you reach 800 pixels wide it says elf:cartel. So it doesn’t have any fundamental reason or… it doesn’t do anything, it’s pointless, so it’s not going to be anywhere probably. But that is too, possibly gimmicky. There are some ideas which are not necessarily web based which are gimmicky but do work like when we were planning this year’s de-construct and INAUDIBLE wants to get some silverback promotion in there. I talked to him why don’t we just have a gorilla one day running around dishing out silverback branded bananas. Everyone laughed and thought it would be stupid, and then we did it. And then it was really successful and everyone loved it. Yeah, it was a bit of a gimmick but again it kind of fitted with the brand so it worked.

Paul Boag: It’s a fine line isn’t it, you walk in things like that? Because you know you could have been absolutely ridiculed for something like that. How do you know what is going to go down well and what’s not? I guess you don’t.

Paul Annett: Yeah, luck. I was ridiculed for that here in the office but we went with it and it seemed to work. It was great fun.

Paul Boag: I’ve seen pictures. It looked entertaining if nothing else. Going back to the online stuff, even if you develop something like that, it never sees the light of day, you never know that technique may come in use in a future web site that you develop and it might be appropriate.

Paul Annett: Yeah there’s always like a library of that stuff that we’ve kind of half developed and ideas that we’ve got, notes, that kind of thing. It might well see the light of day in the future

Paul Boag: Let finish off with just a kind of general advice that you like to give designers out there that they look at some of the cool little things that you do and they think I’d really like to do that but I don’t want to just go out and copy him because there’s nothing imaginative in that. I want to kind of get into that mentality of looking for opportunities to do this kind of thing. What advice can you give them? How can you start them off?

Paul Annett: There’s loads of stuff that’s come out as a result of the silverback hype, if you like. There was an article that I did on ThinkVitamincom which kind of explains how to achieve that technique. People have taken that and done all sorts of other things with it. I’ve seen someone creating moving 3d images and that style of a zoetrope(?) toy thing, which uses the same kind of principles but applied in a different way. So by all means, the best advice in all cases of web design is to look at the code, see how someone else has done something and see how you can adapt that to your own stuff. One thing that I really rely a lot on is, especially in these hidden Easter eggie things, is alpha transparency and thinking of how you can create a window through the front layer of a web site so you could have, instead of having a white background on the web site, put a white foreground layer with a window through it, shaped in the shape of whatever, and see how you can make that interact with the background layer so as you perhaps scroll down the page something becomes visible through this previously invisible transparent window. There’s a site called webleeddesign which does this brilliantly. That’s my ultimate, I would have loved to have made something like that, it’s really good. Only that one page, but it’s really nice with that alpha transparency in the front there. Think about what you can do with resizing the text on a browser so-we redesigning the clear:left site at the moment, hopefully it will be online soon-now I’m giving up an Easter egg that’s coming up on it.

Paul Boag: No one listens to this podcast so it’s fine.

Paul Annett: There are certain things hidden on certain pages and if you bump the text size up a couple of points then those things would become visible because of course you can control the position of things based on ems. As you resize things, your font size gets bigger, it perhaps moves in relation to the other things and things begin to peak out from behind something that was previously in front of it. I play around with that kind of thing a lot. That’s the advice I’d give you in terms of this particular way of doing things.

Paul Boag: That’s some great advice there, there’s lots of possibility. I like what your saying that it only takes a small number of techniques, you talked about transparency there, you talked about the background stuff, and you talked about the font resizing, but the possibilities of just those three things are endless really. You could do all kinds of things with them.

Paul Annett: Exactly, combine them in different ways. Again someone take this and do something with it, but imagine a line going diagonally across the screen but in font of that you’ve got a completely white page and across that white page is a very narrow slot of transparency, so if your line starts at the top right hand corner all you see is a dot in the top right hand corner but as soon as you start scrolling down the screen, that dot moves to the left because it’s visible through that hole. That’s a very basic example of how you could use windows of alpha transparency interacting with the background to do something which moves horizontally as you scroll vertically. I haven’t done anything with that yet as I haven’t thought of anything good to do with it but maybe someone can.

Paul Boag: That’s absolutely brilliant Paul, there’s some really good advice in there and thank you for taking the time to come on the show. I hope we can get you back on before too long.

Paul Annett: Thanks. Thanks very much for having me.

Thanks goes to Troy Oltmanns for transcribing this interview.

Back to top

Feature: Improving your site with user feedback

Users can be invaluable when deciding how to move a website forward. We should always listen to what they say. However, sometimes that is easier said than done. Read more here.

Back to top

139. Brand

On this week’s show we’re joined by Ryan Carson to discuss building an online brand. We look at promoting your site with minimal budget and Marcus shares his views on working in an office.

Play

Download this show.

Launch our podcast player

News and events

Understanding progressive enhancement

Its funny how we spend our whole lives telling clients to avoid jargon and yet web design has more jargon than most. Every few months we seem to make up some new term that is thrown around like everybody knows it.

In reality some we have never heard certain terms, while others seems so similar to one another that the difference escapes us. Take for example ‘graceful degradation’ and ‘progressive enhancement’. Have you heard of them? Could you tell me the difference?

I have to be honest, I couldn’t. In fact in a few weeks you will hear an interview I recorded with Paul Annett from clear:left where I make a comment about graceful degradation and he said ‘no its more like progressive enhancement’. I had no clue why one was right and the other was wrong and I am supposedly a web design expert. Does that make me thick? Possibly. However, more likely I just missed the memo on that one.

The trouble is we are all too busy looking intelligent to clearly communicate with one another.

I have to some extent criticised A List Apart (among others) in the past for perpetuating this kind of ‘in the know mentality’. However, I am now being forced to eat my words (gratefully so) as they published an excellent article on Progressive Enhancement and why you should care about it.

Now if only somebody could explain what Web 2.0. really is.

A free conference (kind of)

I realise that some of the advice I give on this show is unrealistic for some. For example, I talk about the importance of attending conferences. However, when a conference can cost hundreds of pounds it is not always possible.

One alternative is to listen to the podcasts that most conferences published. Unfortunately, they are slow to appear and are hard to follow without being able to see the slides.

Fortunately, the FOWA in London has significantly raised the bar and other conferences will be forced to follow suit.

FOWA has released video of most talks. These appeared within hours of the speaker taking the stage, and are beautifully done including both speaker and screen.

There are also ‘highlights reels’ for most talks. These are a cut down version of the presentation, ideal if you are too busy to watch the whole thing.

With some of the most influential people in web design taking the stage, this is an invaluable resource and Carsonified should be congratulated for making it freely available.

Design Float

Talking of useful resources check out Design Float. Design Float is basically a Digg clone. However it is a clone aimed at designers.

I have to say I don’t like sites that rip off Digg. I have huge respect for what people like Daniel Burka and Joe Stump are doing at Digg. I hate to see people directly ripping off their work (normally badly).

However, Digg does have one flaw. It doesn’t serve the niche very well. Even Kevin Rose recently said: "We don’t really do a good job of servicing the long tail of content." And he is right.

As a web designer, categories such as technology or design are just too broad for me to bother following Digg regularly. Until this problem is resolved, Design Float is an alternative.

Design Float allows me to only see stories relating to web design and although the smaller community means that stories are posted less regularly, what is posted is pretty good.

I recommend checking it out. However, if you are a designer don’t just limit yourself to web design posts. Also look at the other design posts. There is some pretty inspiring stuff there.

Can we stop supporting text scaling?

Finally today, a post by Dave Shea in which he discusses page zooming.

Most modern browsers now support page zooming. The only exception is Safari and that will soon change. This allows users to zoom an entire page, not just the text. Obviously this is beneficial to those with visual impairments. However, is also exciting for web site owners and designers.

Traditionally websites have been forced to support text resizing. This significantly increased development time as well as making design integrity challenging. As text scales, designs often breakdown especially when fixed sized images are involved.

With page zooming these problems go away. It provides the designer with more control and reduces the costs of development. A cost normally passed on to the website owner.

Dave asks whether it is time to support page zoom rather than text resizing. As can be seem from the comments, there is no wrong or right answer. Nevertheless it is an interesting question and one you might want to start considering for your own site.

Back to top

Interview: Ryan Carson on Building an Online Brand

Paul: So I’m really excited to have joining me today Ryan Carson from Carsonified. Good to speak to you Ryan.

Ryan: Thanks for having me Paul. Good to be here.

Paul: It seems that we are crossing paths more and more often with me doing various things with Future Of conferences and you guys kindly giving discounts to my listeners, so it’s good to finally actually have you on the show.

Ryan: Thanks. It’s great to be here.

Paul: So the reason I have asked Ryan on to the show today is to talk a little bit about building an online brand. Carsonified have got lots of different brand identities going on with obviously Carsonified itself and then Future Of and ThinkVitamin and various other things. Ryan’s a bit of an expert really, or he comes across like that anyway, at building an online brand and I wanted to talk to him about how he’s gone about doing that. But before we get into that, Ryan, tell us a little bit about the background of Carsonified. How did it come into being, so to speak? How did it end up being what it is today?

Ryan: Well, it was kind of born four years ago. It started off basically as just me in our top bedroom. I used to be a developer in a web design studio and when Jill and I, my wife and I, got married four years ago we just decided to start our own company. At that point it was just me and I was trying to build web apps and attempting to make money and didn’t really do a great job of it. Then I kind of slowly moved into doing sort of more workshops and things and then we built our first proper web app, which was DropSend, and then we just kept growing and growing and doing more web apps and more websites, for ourself not for clients, and then we launched a couple big conferences, Future Of Web Apps and Future Of Web Design, and all of a sudden now we’re about eleven people. Located in Bath and just love what we do and are really excited to be part of the web industry. So that’s us kind of in a nutshell.

Paul: It’s quite interesting, the approach that you’ve taken. You’ve come from the same background as the vast majority of us yet your business has gone in a completely different direction. You haven’t gone down the road of delivering solutions to clients but you’ve done this quite eclectic thing of a bit of web apps here, conferences here. Was that an intentional thing or has it just kind of naturally evolved that way?

Ryan: It kind of naturally evolved but my mother, and your mom always knows you best, she always said there’s a vein that’s been running through my life for a long time, which is just connecting people. I don’t know, for whatever reason I just get a lot of joy out of connecting people and physical events are just a great way to do that. I’m passionate about the web and therefore it’s kind of like, well, connecting people in the web industry, in the technology sector is just kind of made sense. It did start off with this thing called BD4D which you probably don’t remember, By Designers For Designers. A friend and I did that and it was bd4d.com which is now gone but the idea was we got together designers for free just at a bar and people showed their work. It was in London originally and it kind of took off and I think then it was always just a for fun thing. We called it the Creative Fight Club. I think that was kind of the genesis of our events career. We don’t really see ourself as an events company we see ourselves very much as lovers of the web and technology and we just kind of happen to connect people at events so, it just kind of worked that way. I’m also not a big fan of working for clients because it’s just so hard. I really respect what you guys at Headscape and any web designer web developer because constantly doing work for clients is really hard work and it’s fun but it’s hard and because we run our own conferences and build our own web apps thankfully we’re our own client which gives us a bit more freedom. So that’s kind of how we ended up there.

Paul: It depends on how you look at it Ryan because from my point of view you’ve got thousands of clients while I only have one at a time because you have all those users of your apps and the people who come to your conferences. You’ve got far more trouble in my opinion.

Ryan: I guess you could look at it like that but they tend to be less demanding. They’re not paying us thousands of pounds each so it kind of. But you could look at it like that. We try to treat all of you who come to our show with the same respect as clients, it’s just a shorter term, lower economic value relationship.

Paul: OK, so let’s talk about brand a little bit and profile and stuff like that. Carsonified has kind of built quite a significant online profile and I’m just quite interested in some of the techniques that you’ve used to achieve that. You know, how have you made that happen?

Ryan: OK, well I think underlying everything we do is genuineness. I think that we care very much about honesty and being genuine and being kind and friendly and that sounds a bit fuzzy and happy but that’s just kind of, I don’t know, the way we are. And I think that’s been the key to our success, that when we do things people know that we’re not trying to pull the wool over their eyes or secretly sell them something. We have a genuine interest in the web and the tech industry and so when we do things people kind of know there’s real people that are behind this, we’re not some company. And I think we’ve always been very personal and very human and very transparent and I think that at least set the stage for being successful, but obviously we just follow through with pumping out tons of hopefully valuable content. We see building a brand as basically building friends and I think that on our blogs and through our tweets and at our events and through our communications we try to treat everybody as friends and that’s kind of, I think, a little bit of the key to our success.

Paul: I like that idea of talking about treating people as friends. I think that’s a good way. Too many people treat people as potential customers in preference to actually having any real interest in them as human beings I guess. So it’s good.

Ryan: Well yeah. I just kind of think about who do you like being around? I mean, It’s your friends and there’s a reason for that. I think why does business have to be different? Of course there’s an element of professionality but when you go to the pub and you relax it’s because you feel comfortable with people and I think that whole idea should permeate business. You know with your friends you just buy them a beer, but with your customers there’s significant money being exchanged I think that should involve even more trust than friendship. Hopefully our customers, our attendees and our sponsors really believe that we’re doing the right thing for them. You guys probably do something very similar when you work with your clients. You want them to know that you care about them. That this isn’t just about money that you actually are trying to build something beautiful and worthwhile for them.

Paul: Yeah. I mean it’s interesting. You talking about friends reminds me a little bit of the Innocent smoothie guys that I heard talking at Fuel, which is obviously one of your conferences, where they were talking about how they refer to their customers as family, don’t they? And I always thought was quite a. It sounds naff when you say out loud, referring to your customers as family but if you kind of treat them with that kind of respect, I don’t know, it’s good but it depends on how you get on with your family I guess.

Ryan: Yeah. It could be good or bad but the problem is that would never work if you didn’t actually think Innocent cared about you. If you looked on their bottle and there was E numbers and preservatives and stuff you’d think, “Well, they talk this stuff, but they don’t really seem that committed to doing this.” So I think it really needs to be backed up with a sincere and real effort to support. I mean, we’ve been talking about accessibility, this is a good example, at Carsonified for years. You know, “Yeah we care about accessibility and it’s a great thing,” but we don’t actually know what we’re doing and so we just met with AbilityNet yesterday with Robin and we said we want to get serious about this. I know that you guys are really good at accessibility and sort of putting our money where our mouth is. We want people with disabilities to be able to attend our shows and to use our websites. Let’s actually spend some money on that and get serious about it so at the bottom of each page we’re going to put a little thumbs up symbol that will go to a site that explains why accessibility is important to us and what we’ve done to move towards that with also sort of some tips and hints for people who are disabled like how can you use this site better and get more out of it so trying to put our money where our mouth is really.

Paul: Yeah. I tell you one of my favorite moments I ever had at one of your conferences was, I can’t even remember who the speaker was but the question that came out for the panel was about promoting your business and can you do that outside of San Francisco and California and this guy said you had to be in California you had to be at San Francisco if you wanted to launch a web app and you stood up afterwards and you completely laid into this guy and you said, “No no no, that’s not the case, blah blah blah.” But it does strike me, you know, you’re a Bath-based company and Bath isn’t exactly the beating heart of the web design world and I’m quite interested as to whether you feel that that’s been a barrier to you in any way, being based where you are.

Ryan: That’s a great question. It makes it harder, for sure. You know, we have to go to London to have meetings to go to drink, parties, to network, blah blah blah, but the way we make up for that, and I think a lot of your listeners won’t be in London necessarily or New York or Silicon Valley so this is applicable to all of you out there. It’s all about being visible on the web. And you guys do a good job of this as well. You just have to get yourself out there. So we blog as much as we can, we tweet as much as we can. We try to gather a community around us and that’s the way we make up for the fact that we’re not in London or Silicon Valley. I was going to say another important thing about building a brand, and this fits into that, you need to have an opinion in order to be heard, and that means that you have to be comfortable with the fact that people will completely disagree with you sometimes. You know I think in a way I’ve been successful at building a brand because I’m willing to say something that pisses people off really. You know and I think it’s only interesting to hear from someone who has an opinion. When Paul Graham said that “You know you need to be in the startup hub,” it just really made me angry, because he was basically saying to every one of us, well, you know you’re just kind of screwed, and I just thought, “You know what? That’s just not true, and it makes mad and I’m gonna sort of put my reputation on the line by going on stage and disagreeing with you, a well known entrepreneur.” And if I kind of was afraid to do that you know, not so many people know about et cetera. So yeah, get out there, blog, be as controversial as you can, you know as long as you’re being genuine and be ready for people to say mean things about you really.

Paul: Talking about mean things and people say mean things about you. You’ve come under some criticism for being somewhat pushy in your self-promotion. Do you think that’s kind of justified in any way? Do you think maybe there’s a cultural difference there, the fact that you’re American and are us English more uncomfortable with marketing and promoting ourselves?

Ryan: Yes, I think there is a cultural difference. But I’m also kind of, I like to think I’m friendly but I am sort of a brash person. I’m not afraid to tell you my opinion and do what I think I need to do. While being kind, I don’t want to sort of hurt anybody, but I think there is a cultural difference and I do think that, I mean my wife is English so I’m obviously very familiar with English culture now and British culture and I think there is kind of a slight uncomfortableness with getting on stage and blowing your own horn. I think that in the UK we need to get over that. Not change our culture here but be willing to admit that in the UK if we don’t start to step up to the plate and start talking about ourselves, the rest of the world’s just gonna carry on in the tech space. Mike Harrington, he’s not going to shut up. You know and unless we really start to kind of compete with that and start talk about all of the great things that are going on in the UK and really kind of get out there I think unfortunately it means that the startups and the web designers and web developers that are British are going to start to fall behind in the world stage. For instance, I was trying to think, who are the rock star developers in the UK? Who can you name? I mean I can name a couple but who do you think?

Paul: It’s hard. It’s hard to say. I think there are more rock star designers than there are developers. You know you can think of people like Rachel Andrew, and Drew. Two that spring to mind. Jeremy Keith is kind of a developer but maybe not really.

Ryan: Matt Biddle. You know, there’s a few but it’s just. It’s not the plethora that are sort of being spoken about, in the US particularly, but I have no doubt there’s just as many talented people here. It’s just that, that hesitancy to say, “I’m going to do my own startup. I’ve got a good idea. I’ve got what it takes. I’m gonna start talking about it.” It’s just less common over here. I’m not saying that’s a bad thing and that everyone here should change but I think if you want to build a brand in the web space you just need to admit that I’ve got to get out there. You know I had an interesting conversation with Alex Hunter who is sort of really big in Virgin, The Virgin Group, he’s high up and he’s met Richard Branson a bunch of times. And you know what was crazy? He said that Richard was really shy. And I was like, “Really?” That’s a great example I think of a guy, he’s obviously driven and I don’t think everyone should be like Richard Branson but he’s obviously driven and he understands that in order to get Virgin talked about, to build a brand he’s got to be kind of crazy and get out there. He’s always hanging from helicopters or you know flying spaceships and you know, that’s why people talk about him.

Paul: I think there’s also a little bit within the web design community here in the UK of kind of almost false modesty and a little bit of trying to persuade the world that we’re being very altruistic in what we’re doing and not being up front. I receive criticism for the fact that I’m very open about the fact that Boagworld is a marketing tool and that we make money out of it.

Ryan: But it’s the truth.

Paul: Yeah, exactly. So I think I prefer to be up front about those things, than kind of hide them behind a façade of false modesty to be honest.

Ryan: Well yeah and that kind of goes back to my thing I said earlier about being genuine. I think you’ll always be better off if you’re genuine. And of course we’re sort of painting with broad brushstrokes here, but there’s some very talented people here and I just think, let’s get on our soap boxes and sort of shouting back at the Americans really. And people are doing it, I just think there should be more of it.

Paul: Talking about effective marketing tools, ThinkVitamin, let’s talk about that for a little bit. ThinkVitamin is a website that you run which is basically web design related and web app related kind of articles and stuff like that. I’m guessing that was set up as a marketing tool. Tell me a little bit about why it exists and how you came about setting it up and what its aim is for you.

Ryan: Yes. So thinkvitamin.com has two purposes. It’s to build good will and to give back to the community but it’s also a marketing tool and those things are actually very related. If we pump out great content we give away for free it will be valuable, but those of you who read thinkvitamin.com will also probably come to our shows. It’s a symbiotic relationship. We’re very happy to do that. There is a little bit of altruism there, we do actually want to provide good content and give it away for free but we also realize we needed a platform to talk about our shows. We kind of kept calling in favors like, “Do you mind blogging about Future Of Web Apps?” and “Can you mention it?” We just thought we need to build a big site that people go to so we can tell them about that and we’re fortunate to have great connections. We know people like you and Molly Holzschlag and Kevin Rose and just big Internet people and they all agreed to be on the advisory board and really that’s just a group of people that we trust that occasionally write for us but we’re actually taking ThinkVitamin in a new direction where we want it to pretty much become it’s own little business. So we’ve hired a full time Editor named Simon Mackie and he was really high up at SitePoint actually. And he’s come over and he’s taken the reigns and we’re gonna, yeah we’re gonna basically grow that team and expand that out into its own little business.

Paul: That’s interesting.

Ryan: It’ll be better for the readers. It kind of was dying. The publishing schedule was going down and I think we realized, “Man this is so valuable we have over 50,000 RSS subscribers, closer to 70 if you count the news feed,” and we thought, “This is great, we should grow it.”

Paul: Yeah. I mean it’s interesting in some ways you’ve kind of taken the same approach that we have at Headscape using ThinkVitamin that you could have created a blog on the Futures Of website and you could have put this content there. There’s actually a value in separating it out and making it a standalone thing. It feels less salesy I guess. The same way as I could have posted my Boagworld stuff on the Headscape site. You know it could be the Headscape podcast instead of the Boagworld one. All the rest of it. It just comes on a bit too strong if you do that I guess.

Ryan: I totally agree. And it’s interesting because I had a good conversation with Mike at FreshBooks, and freshbooks.com for those of you who don’t know is an app that helps you send out invoices. He had this blog and he was really slogging his guts out on it and at freshbooks.com/blog or something and he said, “I don’t get it. No one’s really reading it,” and to me it was obvious for that reason you just said. Well it’s clear that this is just a marketing tool. Why would you put a blog on your company’s site, on your product’s site? It’s just kind of obvious and that’s exactly why we haven’t done it for our events, you know we put occasional updates there but it’s hard. As much as I like Web 2.0 Expo or something I would never read a blog from Web 2.0 Expo. It’s just too blech, you know what I mean?

Paul: Yeah totally. It’s interesting that the other thing that you’ve done, which again is something that I do, which is that you haven’t just relied on people coming into your sites, whether it be ThinkVitamin or the Futures Of sites or even the Carsonified site. You’ve made a big deal of kind of going out there and using tools like Twitter and Qik and YouTube. I’m just interested as how effective you’ve found those things.

Ryan: I find Qik to be really effective, or Qik, however the heck you say it qik.com and I was really shocked as soon as I started broadcasting was that just tons of people were interacting and I almost couldn’t wait to do the next one. Annoyingly 3G is kind of spotty in Bath so it makes the quality a little bit bad but I’d highly recommend Qik or any other comparable service. It’s so fun you just take your phone with you, I had to get a kind of crappy Nokia phone or something, because I use my iPhone for normal business but just grabbed it from the 3 store, got a plan I think it’s 20 pounds a month that gives you unlimited data which you’ll need if you’re streaming live video from a phone, and whenever I’d walk to Starbucks or something I’d just turn it on and start talking and people would show up because the way Qik works for people who don’t know is you actually see comments live on the phone screen.

Paul: That’s very cool.

Ryan: Yeah, it’s great for interaction and any tool you can use to interact with your fans will increase your connection and that friendship. It will show you want to be real and you want to connect with people and I think hopefully we’ve achieved that where people think, “Gosh you know Carsonified we know who’s there we know it’s not a company it’s really these people that are there and they’re interested in hearing from me and talking to me,” so that’s been good. YouTube has been amazing, I mean I hate YouTube, it’s ugly, it’s a bit crude you know but man there’s just a lot of people on it. I used this cruddy little video camera, filmed myself giving some tips about business, threw it in iMovie, put some music to it and popped it on YouTube and I think I can’t remember the figures it’s up to, it’s up to like 10 or 15,000 views in literally like two hours work.

Paul: Yeah, I keep meaning to get around to that myself and I’ve never quite managed it.

Ryan: Now you can use a Flip camera. Flip is just a type of camera, you just record and then it’s got a USB dongle built right into it. You pop it in and it actually automatically uploads it to YouTube.

Paul: That’s nice.

Ryan: There’s a couple tools you can use to make it easier. And then Facebook, I’ve been using Facebook a lot just to connect with people and remember people’s birthdays and say hello and just be a friend to them. The more connections you can have to people the better, which builds your brand and I feel that, like a mercenary when I say that, and I don’t like it, like I do believe it’s just a better way to live to connect with people and it happens to build your brand which is great and I like that as well, but I think it’s important that you need to be genuine and actually care about people for this to connect.

Paul: What about Twitter? How have you got on with that? Have you found that a useful tool?

Ryan: I love Twitter. And it’s been probably the best way I think for me to communicate I’ve got I think around 4,200 followers now and I don’t know why people follow me. I don’t think I’m particularly interesting but I do whenever I tweet I try to imagine if I was somebody else and I was reading it if I would find it interesting. I think with Twitter don’t tweet too much, maybe a couple times a day max. If you tweet too much people unsubscribe.

Paul: That will explain my problem then, I tweet too much.

Ryan: I still follow you so it’s not too bad. But you know Evan Williams had a good tip he said you should tweet things every so often that you’re not quite sure if you should tweet because they’re a bit too personal or a bit too blech, because that’s the type of stuff that’s actually fun and interesting to read. Initially we had a twitter account for Carsonified and we deleted it. I think we decided that that was kind of exactly what not to do. People don’t really want to hear from a company, they want to hear from you.

Paul: That’s almost the same as having a blog on your own corporate website isn’t it? Having a kind of corporate Twitter account. After saying that we have set one up for GetSignoff but more as a for announcements. If something goes down with the service or if we’ve done some bug fixes or stuff like that. By far the majority I do via the Boagworld Twitter account which is just me talking about my life. I agree with what you’re saying about putting personal stuff there as well that people seem to like to know what’s going on with each other’s lives. I like to know how Jackson’s doing. People like to know, I don’t know. Making it personal, it’s about that personal connection again isn’t it really?

Ryan: Definitely. And I think that that’s the future, you know just in general. Humankind you know it’s just kind of being personal and not hiding anymore behind companies or brands or policies or terms and conditions. It’s about, “Hey, how can I help you and how can I take care of you?” and that’s just a better way to live and it will massively benefit your company which is great. What’s interesting though is that everybody, including us, continues to look at the Signal vs. Noise blog from 37signals and kind of scratch our heads it’s like, it’s the one blog where it is a company blog, I mean yes it’s called Signal vs. Noise, but it’s on their domain, and yet they have over 90,000 subscribers. It’s funny because I think everyone is kind of, “How do you do that? I want to replicate that.” In the end I think you know, they were kind of first. You can’t have that many of those type of blogs and I think most of us are gonna have to be happy with just doing a good blog that is real and personal whether, and I mean ours is carsonified.com and it seems to work and we have about 4,000 subscribers and for us that’s a pretty good number. We should post more but that’s something I haven’t quite figured out yet and I’d be interested to hear from your listeners what they think about that. Is it possible to have a company blog that people care about or is it just not possible? I don’t know.

Paul: I think what you said there about being first is quite significant. I think originality goes a long way. I mean even with the Boagworld podcast. Simply the fact that I was the first web design podcast it seems to give it a momentum that keeps things going, you know because you keep delivering the goods so to speak which obviously the guys at 37signals really have done. I think there is a momentum in being first in something.

Ryan: Yes and that’s probably the secret sauce.

Paul: OK, So let’s wrap this up with kind of a last question which is: What advice would you give to budding entrepreneurs seeking to increase their profile? Let’s have some kind of top tips if you’ve got some.

Ryan: OK. The first tip I give is to start connecting with people that you feel are influential. You know, spend some time and try to get out and physically meet these people, get to know them and to not be creepy about it, but to get out there, to get in front of them and to get to know them. See if you can do something to help them out, to get on their radar, and I think building sort of a group of friends that trusts you but is also influential is just instantly valuable. So I’d do that and you can use all the tools we talked about for that: Facebook, Twitter, etc. etc. but physical meeting is always the best. I mean you want to have a beer with people.

Paul: And you say you do that by trying to help them out in some way? Because that’s always the difficult thing. It’s all well and good to say, “Get to know influential people,” but how you do that’s the tricky part isn’t it?

Ryan: Well my dad always did something that worked. If it was someone he really respected or cared about and wanted to get on their radar he would find an article about them in a magazine and he’d actually go to a framer and have it framed and then write them a personal note and just kind of say and send it to them and say, “You know, I bet you haven’t had time to actually frame a picture of your article so I thought you might want this for your wall.”

Paul: What a genius idea. I love it.

Ryan: And it’s genuine. I’m not trying to get anything out of you but I respect you and here you go. It’s very subtle. You have to be very careful to not try to sort of bribe people. If you come across that way it’s exactly what you don’t want to do. If you feel, and kind of think deep down, “Do I actually want to be friends with this person or am I trying to use them?” I think you should steer very clear of a person if you just think actually I don’t really like this person I’m just trying to get something out of them. But if you think there’s some synergy there, that’s a great way to do it. Remember people’s birthdays, it’s just a nice thing to do. Stuff like that is a great way. Most people’s friends don’t even do that for them. I’ve had people send me stuff and you know it just makes me smile and I’ll always take their call or answer their email now. So I think that’s a good idea.

Paul: Any others?

Ryan: Um, other tips. Um, probably put a real emphasis on customer service and build a real base of caring in your company. Not just for your customers but for your own team. I think that your team will never be able to treat your customers well if they don’t think that they’re treated well. So I think as entrepreneurs grow and they start to hire people I think it’s important to remember to take care of your staff first and then your customers second. And a really great resource for that is what zappos.com does. Zappos.com has an amazing company culture. They have this book called the Culture Book and every year it comes out and you can buy it and it’s basically a bunch of testimonials, thousands of them from the Zappos employees about why they love their job. And it’s just packed full of ideas of how to take care of your team and it’s a great inspirational resource. I think you can either get it on eBay or Amazon or you can buy it straight from Zappos. A couple hopefully useful tips?

Paul: Yeah that’s excellent. Ryan thank you so much for coming on the show, it’s been really good to get you on and I think there’s some really good useful advice there for anybody looking to kind of build an online brand so thank you very much and no doubt we will have you back again soon.

Ryan: Thank you, it’s an honor.

Thanks goes to Todd Dietrich for transcribing this interview.

Back to top

Listeners feedback:

Site promotion with minimal budget

Our first question is from Adam in the boagworld forum:

I have got a site that needs an awful lot of promotion to work, and have got very little budget to do it with. I could probably spend a little bit on Google AdWords but on nothing else. So, how can I promote my site for little money?

Adam went on to tell me it was a charity website. This makes it challenging. As Adam said…

There are thousands of Charity sites, and many better funded, and just altogether bigger.

In this situation search engine optimisation or Adwords is going to be tough. The competition is fierce and so it will be expensive to be highly ranked.

The other problem with a charity site is that unless it is niche (e.g. bird protection) the potential audience is open ended. However, with limited resources there is little point in targeting ‘the general public’. You will have no impact on such a broad audience.

Target a specific group as it will be easier to gain momentum within a smaller audience. For example, there are Christian charities who do general humanitarian aid. Even though anybody could be a potential supporter, they instead target other christians. Therefore they are well known in that circle. Better to have a lot of support from a niche audience than a small amount of support across the general populous.

Once you have picked the audience use three techniques to reach them:

  • Offline promotion – Engage with your audience offline as well as on. Attend conferences, produce offline promotional material and target magazines your audience reads. As web designers we often forget to power of offline marketing.
  • Social marketing – Identify the social sites your audience You should be wherever your audience is interacting. Finally, seek out key figures who your audience admire and respect. See if you can get them on board and encourage them to promote your site.
  • Editorial promotion - Find out if your audience reads online blogs or magazines. Offer to write articles for these sites. Do not overtly promote your charity but instead write content which will be of interest to the audience. Failing that make use of comments to join in the discussions and increase your sites profile among that audience.

However, be careful. In your haste to promote your site do not spam. The key is to offer something of value. You must earn the right to promote your site.

Sitepoint has an excellent article entitled ‘10 rules for driving traffic using forums‘. Although it is focused on forums, its advice is applicable to most forms of online promotion.

Office Or Not

This from Brad:

A question from Canada! I’m a long-time listener of the show, and I thank you both for your entertainment and inspiration.

A little bit of background first… Two years ago I co-founded a small web development company, and to date we have not yet invested in office space. As we slowly move on to ‘higher profile’ clients, we find it increasingly important to have someone in-house, to answered the phones, do the books, etc, etc, so we can focus on growing the business.

That said, I’m obviously touching on a huge spectrum of possible questions, so I’ll try to narrow it down. I don’t think this is something you have covered specifically on the show before…

Is office space really important for a creative business? If so, what steps would you recommend. And if not, are there better areas to spend $2000 / month?

If I had been asked this question only two years or so ago I would have said that office working for a web team is not important at all. If anything, I would have said that home working was better. The following extract from Paul’s blog, written in 2005, underlines this:

The benefits of a virtual company

By virtual company, I mean we do not have a central office. Each member of staff works from home and we communicate and file share with tools such as Skype, CVS and Groove.

People are often curious about an entire company home working and ask how well it works in reality. My answer is usually that it is brilliant. From the employee perspective, you do not have to commute and you can see a lot more of your family. For example, if I were still working for IBM when I used to commute an hour and a half everyday, I would only see my 2-year-old son at weekends. As an employer, I love it because my staff tend to work the hours they would commute and generally home working is seen as a big bonus that keeps people at the company longer. Not to mention the savings made on premises.

Communication really is not a big problem. There are so many tools out there these days that help, and broadband means that even telephone conversations are now free.

Paul goes on to say that the only drawback of home working is that it lacks the social aspects of working in an office.

Not true I’m afraid. Though of course home working does give you an environment to ‘get your head down’ without interruption, what it really lacks, that phone/email/IM cannot replace, is creative collaboration. People simply do not bounce ideas around like they do if they work together.

Our current office is open plan and there’s nowhere to hide yourself away. This has meant that I haven’t really frequented it that often – I need ‘calm’ to write. However, watching particularly our development team grow and work really effectively together underlined to all of us the value of working together.

So much so that we are about to move into our ‘dream’ offices where there will be a mixture of open plan spaces and areas where we can work quietly.

So (finally!), in answer to Brad’s question, I think that office working is better for the business in the long run and I would say warrants the additional associated cost (though beware the costs, they can mount up – another podcast topic I think). That said, we have managed for nearly seven years before doing it properly (i.e. pretty much all of us will be in together most of the time) so it won’t necessarily damage you if you leave it awhile.

Back to top

131. Version Control

In this weeks show Ryan and Stanton return to talk about the importance of version control and answer your questions on project  management and invoicing applications, download sizes and page weight.

Play

Download this show.

Launch our podcast player

News and events

Twitter Cuts UK SMS

This week the team over at Twitter announced that they would no longer be delivering outbound SMS over there UK number. They go on to explain that the bill which up until now they’ve been footing is simply too great and that even with a limit of 250 messages per week they estimate a yearly cost of $1000 per user.

Thanks to established relationships with SMS services in Canada, India and the United States the outbound SMS service will be continuing uninterrupted in those countries.

Twitter has suggested a number of alternatives to the service, links to which can be found on their blog. It would also appear that a number of start-ups are rushing to fill the void as TechCrunch have also reported.

A large portion of Twitters popularity is due to their SMS facilities and it is feared that “freezing” out the UK and other countries from this service will be detrimental to their future.

It reminds me of when Pandora, the online radio station, closed its doors entirely to its UK audience due to licensing constraints and it begs to question do we poor souls in the UK miss out on all the good toys?

facelift (FLIR) Image Replacement for Fonts

Facelift Image Replacement (or FLIR, pronounced fleer) is an image replacement script that dynamically generates image representations of text on your web page in fonts that aren’t otherwise supported in web browsers. The generated image is automatically placed on your site and works in a similar way to sIFR, the big difference being the lack of Flash.

This script uses PHP and javaScript and utilises actual .ttf font files to generate its replacement images, so you can simply specify which elements you want to replace, h1, h2 tags etc, download a font you want to use, point the script to it and your done.

I’m looking forward to having a play with this script as it seems to be simple to use and the fact that you don’t have to mess around with Flash like you do with sIFR is a big bonus in my book.

Take a look at the number of examples they have on their website and see for yourself.

Gmail went down!

So Gmail went down for a few hours this week and as Josh Catone said in his sitepoint article article:

Judging by the reactions on Twitter and in the blogosphere, you’d have thought that the world ended.

There’s nothing really more we can say about this that Josh hasn’t already mentioned, but suffice it to say, no web sites/app is going to have 100% up time and this echoes what Stanton and I were talking about the other week in regards to S3 going down. It’s important to always have a backup and not to put all your eggs in one basket because when the service you’re using goes down, and invariably it will, you need a plan B.

Back to top

And Now For Something Completely Random

During the recording of this weeks podcast we were thrown completely when we spotted Paul Annett from Clear:Left dressed up as a Gorilla on Yahoo Live! and then proceeded to start dancing… always aiming to share the hysterics here’s proof. Random indeed.

Paul Annett Dresses as a Gorilla

Feature: To Version Control or Not?

Version control can seem like a very daunting thing to incorporate into your work flow, but once it’s there you can be left wondering how you ever lived without it. In this week’s feature Stanton shares his experiences with you in a bid to convince you why you need it.

Back to top

Listeners feedback:

Project Management and Invoicing Applications

James writes: I would like some boagworld advice. I’m a web designer and SharePoint specialist at a large company in Cambridge, UK. Over the last 3 to 4 years i have been messing around with web design etc. I now am very busy outside of work and it is getting busier every month.

I started of with a server under the bed at home with UPS hosting these sites. They ranged from personal sites, to company profile pages to shops. This server has now been replaced with a VPS hosted externally.

My plan is to keep working full time and manage my time very carefully outside of work and keep these sites coming in and out etc and then one day take the big leap into the self-employed world.

What could you recommend for me to manage my tasks, projects, time-management and invoicing etc?

I love the podcast and would be quite happy to chat further with you. Look forward to hearing your experience comments.

Well there is a multitude of online and desktop applications designed specifically for managing your business.

Probably the most popular project management app I know of is 37 Signals’ BaseCamp and that’s certainly the first one that springs to mind when I’m asked this question. Depending on what package you have, BaseCamp allows you to create projects, set milestones, to-do lists, manage time spent on tasks among other things, however BaseCamp is tailored more towards collaborative projects for when you’re working with a team of people. It doesn’t provide facilities for invoicing clients and managing your accounts and so it might not be the perfect choice if you working alone.

Another app I know of and which comes highly recommended is FreeAgent. FreeAgent like BaseCamp allows you to create and manage projects, clients and timescales, however in addition it provides you with the facility to generate invoices, manage your bank accounts as well as your expenses and incomes. It’s designed for sole traders, partnerships and limited companies and is wrapped up in a nice, user friendly interface.

A final mention goes to a Microsoft app that I came across a couple of years ago now, and has only this year been release in the UK. It’s called Office Accouting Express 2008 and it’s actually free to download and use. As you would expect it integrates with other Office applications and provides you with all the facilities you would expect from an accounting package, invoicing, client management etc. So if you’re working on a PC it’s worth having a look.

Luckily you can have a play with all these apps before you buy. BaseCamp has a free account which allows you to create 1 project so you can get in and see how it all works, FreeAgent has a series of demos you can use to see if the interface and facilities are to your liking and as I’ve said Office Accounting Express is free. So my advice would be check out them al
l and see what works for you and no doubt there will be several suggestions in the show comments on other apps that I haven’t mentioned here.

Download Sizes

Bob writes: After reading a recent post from Smashing Magazine on textures I started to wonder… what is a good rule of thumb regarding document size per page on the web? Most of the example pages in the article ranked in at close to 900kb per page… am I behind the times?

Very good question, and one I think we all worry about at points. There’s more than just the filesize to really worry about, there’s the general ‘page weight’ which is affected by many factors, such as:

  • The number of HTTP requests made – if you’re pulling in a lot of external javaScript or CSS files, each one has to be requested seperately. You can combine these into single files to reduce load times, but at the expense of readability, maintainability and organisation
  • The size of any javaScript files you’re pulling in – you can get minified versions of most libraries, for example, which strip out all the extra spaces and line breaks in the code, which aren’t needed in order for the code to execute
  • CSS expressions can be a useful tool, but are bloody slow, especially when used a lot
  • Image filesize can have a massive effect on load times, which is one of your main concerns as you mentioned textures. I’m assuming you’re already familiar with image optimisation, but also test to see if you can squeeze images into a GIF, or a PNG8 if possible, these formats will give you a nice small filesize if you only need a limited colour pallete.

In this day and age it’s nice to think that we’re all cruising on nice fast broadband connections, but in reality we know that’s not the case and you really have to consider your audience, and the context in which they may visit your site (Paul’s talked about this quite recently). If you expect an older demographic to your site, or people in remote areas, then they might still be hitting you on a dial up connection. Some visitors may be using poor public wifi (I get suicidal on the train to and from London as the wifi is usually worse than dial-up), or mobile devices where the data charges can be ridiculously high.

There are a couple of tools I use to get an idea of how my pages weigh in:

There is a Firebug addon called YSlow which provides some nifty statistics on what’s happening under the hood of the pages you visit, and also grades the page performance and suggests methods to improve the loading time of your page.

I tested 2 sites quickly with this extension to give an idea of what you can expect to see, Amazon and Boagworld.

  • Amazon.com weighs in at 501k with 85 HTTP requests and a performance rating of D
  • Boagworld.com is a bit lighter on it’s feet at 57.6k and 79 HTTP requests, but has a performance rating of F, due to (among other things) including 37 external javascript files compared to Amazon’s 8, and 33 CSS background images compared to 9 with Amazon.

I also use a Firefox plugin called Firefox Throttle which lets you simulate a specific network speed (such as 56k) and get an idea of how long your site will take on certain connections.

Unfortunately I don’t think there’s a good rule of thumb here. Personally, I don’t let the page weight issue affect or limit my design, but try and make savings where I can nearer the end of the project, by optimising images, switching to minified JS libraries and reducing the amount of HTTP requests where possible.

Back to top