Tag Archives: inspiration

Revolution or evolution?

Posted in Web strategy on by Paul Boag

In my last podcast, I spoke about choosing the right design for your site. In the past, I have also written about the need for sites to evolve rather than redesign. Therefore, I thought I would put some of my theories to the test, with the redesign of boagworld.

Ever since my podcast co-host (Marcus) joked that it was about time boagworld got a face lift, I have been mulling over what to do with the site. Obviously, I am not going to change the site just because Marcus said so but equally there are a number of reasons why the site needs some attention:

  • We had a new logo for the boagworld podcast waiting to be launched
  • The sites code is looking a little dated and doesn’t really reflect the latest techniques I have been using elsewhere
  • The sites layout is very much like a personal blog and not very reflective of the community aspects of boagworld.
  • I want to move away from a fixed width site, which is no longer reflective of the approach I take on commercial projects.

A revolution

With all of that in mind, I started the process of redesigning. As it was my site I simply let rip and just had fun rather than worrying too much about things like brand identity. The new design was a radical departure from the current site, with no real continuity. Despite this, I really liked the design. Sometimes it is fun to shake things up and shatters preconceptions, especially when it is your site and you don’t have to worry about "business realities". Without a doubt, this approach was very much a revolution rather than an evolution of the boagworld site.

View the more radical design approach

An evolution

However, the more I looked at it and the more I thought about it, the more I began to worry. This radical departure flew in the face of the advice I gave in my "site evolution" post. In this post, I suggested that a site should gradually evolve over time rather than go through periodic redesigns. One of my reasons for this approach is that it keeps continuity in brand identity and doesn’t leave users feeling overwhelmed when they see the new site. I therefore went back to the drawing board and produced a more conservative design, which was more in line with the existing site.

View the more evolutionary design approach

What do you think?

So how do I decide which approach to adopt? In the end, I have decided to take some of my own advice from my last podcast: "Ask your audience".

If you are reading this post then you are very definitely my audience. So what do you think? Which approach is better and why?

 

@media is almost upon us

Posted in News on by Paul Boag

Well I have just received my email from Vivabit giving me all the details about next week’s @media conference and it has finally made me look through the list of sessions. I have to say I feel like a kid in a candy store.

I have been intending to write a post on my hopes and expectations for this years @media conference for the last few weeks. However, it wasn’t until today that I have had a chance to look through the list of speakers and the subjects they will be tackling. And what a list it is!

Last year’s conference was a real turning point for me. I had become weary of web design and lacked inspiration and motivation. Listening to others enthuse really set me on fire again and led to this blog and subsequent podcast. So as you can imagine my expectations for this years conference are unrealistically high. However, the list of sessions did nothing to tame my out of control enthusiasm. It is as if somebody has asked me to list all of the areas I am passionate or concerned about and then made it into a 2 day conference.

Here is the list of sessions that have fuelled the fire of expectation:

Bulletproof Web Design

As somebody that has only recently embraced fluid design (as you can tell from this legacy site) I can’t wait to hear what Dan Cederholm is going to say to help people &#”;let go of pixel precision&#”;. My hope is that Dan can help me deal with some of the frustrating issues that arise from designing with ems and percentages.

The fine art of web design

I have been going through a bit of a stale patch with design for a while now. I feel like I am always having to fight clients to get anything other than the most mundane designs past them. Sometimes it is easier just to churn out the same old mediocre crap when you are faced with a difficult client. However, I am hoping that this session will put some fire back in my belly and make me fight my corner a bit more.

Fine Typography On the Web

Dave Shea’s presentation on typography looks intriguing if nothing else and I cannot wait to hear what he has to say about the state of online typography. Can we really be moving away from Verdana and Arial? Is there really a magic solution I am unaware of?

Mobile Web Design

I am interested to hear what Cameron Moll has to say on the subject of designing for mobile devices, as I have heard so many conflicting messages from &#”;just remove the stylesheet&#”; to &#”;mobile design is to web design what web design is to print&#”;.  It’s an area that I keep meaning to investigate in more depth because I believe clients will soon by requesting this from us as a matter of course.

The New Accessibility Guidelines: WCAG 2.0

Now this is a panel with a lot of potential!  Following Joe Clarks article on the subject I am hoping for a hugely constructive debate… that or a good old moan. I am open to either!

Don’t forget to say hello

To be honest I could have listed pretty much every sessions . How all of this is going to be crammed into two days is beyond me.

Anyway if you are going make sure you come up and introduce yourself. I will also be at the pre-event bash on Wednesday night so it would be great to see you.

Podcast 32: In-house vs. outsourcing

Posted in Classic shows on by Paul Boag

Decisions, decisions… develop in house or use a third party web design company? This is discussed in this weeks podcast along with other bits and pieces.

Play

Podcast: Download (23.9MB)

The decision of whether to develop your website in house (by taking on additional staff) or outsource it to the third party web design company can be a tricky. This week Paul and Marcus look at the pros and cons of both approaches as well as throwing in some additional options for good measure.

Download this show.

Also in this weeks show:

In-house vs. outsourcing

The decision of how you are going to resource your web project will radically affect not only the price of the project but also how that website develops in the future. It is therefore important to understand the options available to you and to know the pros and cons of each.

Although there are some alternative approaches that I will discuss later, you basically have two options available:

  • You can use internal resources within your organisation to develop your new web project. This can either be existing staff or new employees that have been recruited specifically to work on the website.
  • You can outsource the project to a specialist web design agency who can work either on a fixed price or time and material basis.

Either option has both its advantages and disadvantages:

In-house development

In short, an internal development team demonstrates a greater commitment to placing the web at the heart of your business

If you envisage that your site is going to need ongoing support and development (beyond basic text amendments that could be completed via a CMS) then hiring in-house staff may well be the best way to proceed. Although this does produce an ongoing financial commitment in the form of salary, equipment and training, it will ultimately be cheaper than the higher rates you will be forced to pay an external agency. An in-house development team will not only understand your business better than an external agency but will also be in a position to push the virtues of the web internally on an ongoing basis.

In short, an internal development team demonstrates a greater commitment to placing the web at the heart of your business and a vision to ensure your site evolves overtime instead of going through sporadic redesigns.

Outsourcing your web project

External agencies are often better placed for dealing with more challenging sites.

Of course having an in-house team isn’t always appropriate. For a start the ongoing financial commitment may simply not be an option even where site evolution is the preferred approach. Secondly, external agencies can sometimes have the advantage when it comes to complex and cutting edge sites. External agencies are normally larger than in-house teams including more specialists in specific fields (e.g. accessibility, usability etc). In addition because of the competitive nature of external agencies there is more pressure on them to keep up-to-date with the latest innovations and developments. As a result they are often better placed for dealing with more challenging sites.

Finally there is a danger in some organisations that the in-house web team can become “institutionalised” whereas an external agency will bring a fresh perspective that can challenge internal preconceptions.

Management mistakes

Of course the biggest factor in undermining in-house teams can often be mistakes made by management and not anything to do with the team itself. One such problem is recruiting the wrong person for the job. Often smaller organisations will recruit a web developer when what they really need is a web strategist and evangelist. Although coding and design are important skills, a smaller organisation needs to have somebody with business acumen that can help the organisation identify opportunities to utilise the web and to promote its use internally.

However, probably the biggest mistake made my management is ignoring the internal team they have. As a member of an external agency who works with in-house teams on a regular basis, I am constantly amazed how often we are brought in only to validate what the in-house team has already been saying. It is as if our presence is required simply to mediate in the internal politics that can often be found in larger organisations.

Other approaches

Of course choosing how to develop your website doesn’t need to be a black and white choice between in-house or outsource. There are in fact a number of other options to suit different organisations:

Ad-hoc specialists

For larger organisations it may sometimes be appropriate to bring in specialists to compliment an existing in-house team. For example specialists in accessibility, usability or design can often work well alongside an in-house team primarily made up of coders.

Part time contractors

For smaller organisations that cannot afford fulltime in-house staff but who wish to enjoy the benefits that come with that approach, there is the option to take on a part-time contractor. These individuals will probably have 2 or 3 websites they manage on a regular basis but still will be able to work more closely with you than an external agency.

Maintenance contract with an external agency

Although probably the most expensive approach, maintenance contract with an external agency does provide the best level of service. If the agency provide the right kind of service this can be very much like working with an in-house team. The agency will really get to understand the business, evolve your website on a regular basis and still provide all of the benefits of an external agency.

Conclusion

In many ways the title of this entry is somewhat misleading. The decision between development in-house or outsourcing is not a black and white one. Different solutions are right for different organisations. However I believe one thing is universally true, whether you use an external agency or in-house staff, you need a “website owner” within your organisation who is the project manager for any work done and the evangelist for the site within your company.

No more speculative designs

Posted in Design on by Paul Boag

Arriving at a design for a website is a process rather than a flash of creative inspiration. A whole range of factors influence how a design develops and none of these steps are present in speculative work.

One of the worst parts of my job is doing design work for pitches. You simply don’t have enough information to produce a quality design. Recently I discovered I was not the only one to feel like this and that in fact there was a growing movement campaigning for an end to speculative work.
 

 

It’s not that I have a particular problem with doing speculative unpaid work in order to win a new client. I have no problem, for example, in the hours spent producing a proposal or going to presentations. My problem is that speculative designs provide no real value to the client in making their choice of a web design agency. They might perceive them as useful but in reality they are less than worthless.

Design is a process

Arriving at a design for a website is a process rather than a flash of creative inspiration. A whole range of factors influence how a design develops and none of these steps are present in speculative work.

Producing a truly good design involves:

  • A collaborative process with the client in which you understand their organisation and vision for the site.
  • Usability testing with end users to see how they respond to different design approaches.
  • An understanding of the competition and how they present themselves online.
  • Detailed analysis of brand guidelines and other marketing collateral.
  • An iterative process where a design is refined and evolved through a number of stages.
  • A solid grasp of other external factors which may impact the look and feel, including accessibility, technology constraints and internal business factors.

At the proposal stage of a project you have little or no communication with the client, have undertaken no usability testing and have little in the way of background information on the company and their objectives.

Everybody loses

Of course many clients see things differently. They want to see what the design agency is capable of “creatively”. Of course the web design agencies are all too aware of this and so the designs produced are often not realistic. Instead the designs become part of the sales process and are more about selling than providing a viable solution. The emphasis is on “looking cool” and “creating impact” rather than tackling the harder to understand issues of accessibility, usability and business objectives. Showmanship replaces substance and everybody loses.

The client loses because they are being shown the superficial rather than a real world solution.

The design agency loses because even if they win the project they will almost certainly have to throw out the initial design work done as being unfeasible.

If you are in the process of issuing an invitation to tender, seriously consider whether you need to ask for speculative designs. Instead, take the time to review the web design agencies portfolio and speak to their clients. Far more can be learnt from accessing their “final designs” on actual sites than can ever be gleaned from a design produced with the single objective of selling you their services!

Check out the NO!SPEC campaign

Podcast 23: Defining your project

Posted in Classic shows on by Paul Boag

This week on boagworld.com Paul and Marcus discuss the need to define clearly the scope of your web project before rushing into the build.

Play

Podcast: Download (18.8MB)

Download this show.

TechnoBuster: Semantic code

Semantic code is a term that is thrown around a lot at the moment, but what is it and why should you care? I try to explain to Marcus in very small words what it’s all about!

Check out our article on this subject

Main feature: Scoping your web project

Carefully planning your website before you start to build might not sound like the most exciting theme for a podcast but it is fundamental to a successful website project. I know from bitter experience that not doing so can lead to a world of pain for both the developer and the client. In this weeks show we share loads of tips that we have learnt over the years. Here are just a few of them:

Take the long view

Many clients force agencies to start projects before they are fully prepared, either because they are unwilling to pay for a scoping phase or because they have a tight deadline to meet. This kind of short-term view does nobody any favours. If a project is not properly defined at the outset, it will inevitably lead to slippages and additional expense. A developer needs time to understand the requirements before they begin to build. If they don’t, they will be unprepared when they encounter unforeseen technical issues.

Everybody has to sign off

Having a statement of work that everybody has signed off on is a great way to ensure client, developer and designer are all singing off of the same hymn sheet. It avoids miscommunication and misunderstanding by clearly defining what is going to be delivered.

Do you really need that?

The scoping phase should not only identify what tasks need to be done, it should also take a long hard look at what functionality is being considered. If you are not careful, your statement of work can turn into a wish list of functionality rather than a considered document which factors in return on investment. Ask yourself, if I spend all of this time building a certain piece of functionality, will it pay dividends for my organisation.

Be specific

It is easy to be vague about your scope, but if you do, there is room for confusion. The statement of work should cover everything from how many design iterations there should be, to what browsers the site is going to be tested on. Make sure your list of tasks is as detailed as possible, that way you will avoid any nasty surprises half way through the project.

Phased development

Don’t be afraid to phase a project especially when faced with a tight deadline. If your website has to be live by a certain date, it might be wise to leave out some of the "bells and whistles" until post launch. It is easy to forget that your website should be an evolving animal that can grow over time. After all, saving some of the functionality and rolling it out later gives you a good PR opportunity.

The hidden technology killers

Beware of those little technology issues that are so easy to overlook. For example, pay particular attention to which browsers you are going to support and what accessibility level you will be conforming to. Finally don’t forget to factor in time to deal with those extra style sheets for print, mobile or low vision users.

Web resources: Getting your layout right

This week I picked two sites that help designers develop the perfect layout.

Web Design Practices
A great site that shows you the trends in layout based on an analysis of several hundred websites. This site answers invaluable questions such as; "where does the search box normally appear" and "do most sites use side or top navigation?"

Although slightly out of date and centred largely on ecommerce sites, this is still an excellent resource. However, remember, just because a lot of sites do something a certain way doesn’t make it good practice!

Layout cookbooks
Have you ever had a client who knows what they like when they see it? If so, send them over to the layout cookbook and get them to look through the hundreds of different screen layouts available there. It’s also a great place to get some inspiration when you feel like all your designs are using the same basic layout!

Boagworld Discussion Forum

Posted in News on by Paul Boag

Thanks to everybody who took the time to complete our survey. We had some great feedback and some cool new ideas. As a result, I am pleased to announce the launch of a new boagworld flickr group.

We now have a fully fledge forum for you to check out.

This new group has two purposes:

Grab, upload and comment

Firstly, as you would expect from Flickr, it is intended as a place we can upload screenshots of web sites and comment on them. If you see a site you love, upload it to the group and then share why you think it works. Conversely, if you find a site that sucks, upload that and say why you think it fails. This will be a great way for us to learn together what makes good design. Hell, if you want some feedback on a site you have done, upload that too and let people comment on it.

The lazy man’s forum

Secondly, there was a lot of interest in having a forum where people could discuss the issues raised on boagworld.com. Instead of doing any actual real web design work, I have decided to opt for the very basic discussion board provided with a flickr group. If the board proves popular I will upgrade it to something with more options, but I reckon this will work well to start with.

Check out the new boagworld flickr group now

If you have other ideas about how boagworld.com could be improved or how we could utilise this new flickr group then post your comments.

What makes good web design?

Posted in Design on by Paul Boag

I am in crisis today. Some days I am just not sure what constitutes good web design anymore. Help me see the light.

The never-ending process of redesigning the HTML soup that is headscape.co.uk continues. While seeking inspiration for my copy I came across this site:

Burza

What surprised me was my confused reaction to the site.

Its cool… oh yes it is

To start with I thought, wow this is cool. It looks great, it is built in web standards and it even caters for users who do not have the flash plug-in installed. A great example on modern web design, using semantic code and degrading nicely.

Oh no it isn’t

However, when I got past the technical and design excellence I started to find some confusing features. For a start, it took me a moment to work out what they did. Despite, the big banner saying, "We do web stuff" I had trouble grasping what the site was about. Was it a games site, a site for kids, what?

I loved the little cool figures and even grasped relatively quickly that they were the main navigation. However, I was then left wondering what each section contained. The white arrows everywhere and the spidery yellow text made it hard to interpret what was going on.

In two minds

I am not writing all of this to slag off the site. Quite the contrary, in many respects I am very jealous of the talent behind it. The reason I am writing is that I really do not know if it is a good piece of web design or not. Obviously, in many respects, it is, but from a usability standpoint, I am not so sure. Is it form over function or am I just turning into a grumpy old man? What do you think? How would you rate this site?

Stuck for inspiration

Posted in Design on by Paul Boag

I received a brief today that required some mock-up designs to be produced, however the brief made no mention whatsoever of design. There was no logo, no colour palette, no style guide, no likes or dislikes… nothing! There is nothing worse than a completely blank canvas. My trick for dealing with it is to start with colour.

Colour can be a powerful influence over a design. Colour can dictate mood, style and even choice of imagery. That is why I find it a useful starting point.

All I had to go on was what the organisation did and the area they worked in. They were a government body that helped to rejuvenate towns in the south west of England. That was fundamentally all I knew.

Now fortunately, I live in the South West of England (Dorset). I have many relatives spread out through Cromwell, Devon and Somerset and could refer to family photos for inspiration. A quick walk around my hometown also helped, as well as getting some fresh air into my lungs!

This trip around the area either virtually (using my photos) or physically (by walking around town) helped me to pick up certain characteristics. These included; the coastline, the rolling countryside and the soil (especially in parts of Somerset where it stains everything red even the bricks of the buildings). Suddenly I had something to work with which eventually led to this basic palette

So what is the morale of this story? Do not sit staring at a blank screen. Get up, look for inspiration offline and approach the problem laterally.

@Media2005

Posted in News on by Paul Boag

@Media 2005 was the first Web standards and accessibility conference here in the UK and only the second worldwide. The conference demonstrated a growing commitment to building accessible and standards friendly web sites.
So what came out of the conference and why will it affect the way we all build web sites.

I was fortunate enough to attend this two day conference and had the opportunity to listen to some of the leading figures in web design. They spoke about how the way we build web sites will change and how it will benefit us all, both users and site owners alike.

I have to confess I was totally inspired by the conference and so here are just some of my initial thoughts:

Taking standards based design the next step

I probably haven’t spoken about standards based design enough on this site before, but what I have written has hopefully explained that web standards are about separating content from design. This has a whole range of benefits including, but not limited to;

  • faster download time,
  • sites being easier to maintain or redesign,
  • greater accessibility,
  • available to a greater range of browsers and devices,
  • better print capability.

However what really inspired me was a talk by Jeremy Keith who took the idea one step further and suggested we also separated out behaviour from content.

If you have read my blog before you will know that I try and avoid technical jargon because there are enough people out there providing the technical detail. With that in mind I am not going to get into the specifics of DOM and Javascript and exactly what I mean by behaviour. However what I will say is that by separating out interactive / functional elements from your web site you gain a number of advantages. These include:

  • the ability to manage all of your functionality (such as popup windows etc.) from one central source,
  • a cleaner, more accessible web site that will still work even for people without the software to view the extra functionality,
  • the ability to add new functionality site wide without editing each page that the functionality needs to appear in.

The beauty of Design

Douglas Bowman gave two very inspiring sessions that raised a number of interesting points. One of the issues he touched on is something that is particularly close to my heart and something which I believe is fundamentally important to good web design. He spoke about our tenancy as designers to be constrained by the practicalities of web page construction and that this often stifles our creativity.

So many web sites look the same, not because they are trying to conform to design standards (which is something I whole heartedly support) but because the designers have an inability to think outside of the constraints of the medium. Douglas encouraged innovation where we design first and work out how to build it later. Only by taking this approach can we ensure not only the best design for the job but also that we are constantly pushing back the technical boundaries of web design.

The real face of accessibility

For a long time now I have accepted that we have a responsibility as web designers and indeed web site owners to ensure that our web sites are accessible to the widest possible audience. Indeed I routinely check my sites against web accessibility guidelines and fix individual little problems so they work better with speech browsers. However it wasn’t until a presentation by Robin Christopherson from Ability Net that I fully began to realise how impossible it is to browse the web as a blind user. Robin himself is blind and demonstrated some of the problems faced by blind users. He did a particularly compelling demonstration by attempting to navigate the Amazon.co.uk web site using a standard speech browser. Although I have tested pages before in speech browsers I don’t think I have ever attempted to achieve anything other than basic tasks. Robin’s demonstration was a real eye opener and has galvanised my commitment to creating truly accessible design.

Praise and criticism

For me this conference was a real turning point. I have to be honest that over the last few months I have become disillusioned with web design. As somebody that has been involved in the web since the early days I missed the challenge and excitement of those chaotic times. Somehow things had become very stale and sensible. However @media 2005 has made me realise that I have a real opportunity to shape the way the web develops in the future and make it a much more usable place for everybody.

I have read some comments that have critised the conference and in particular the speakers for being to insular. Some have expressed a sense that those speaking and running the conference were elitist in some way. Certainly they all seemed to be good friends but I would argue that their closeness is one of the reasons they have achieved so much. I have to confess I had a pang of envy that I was not one of the elite who inspired web designers worldwide and is forging the future of the web. However I quickly realised that it is down to people like me and you to implement these new methodologies on a daily basis if we are really going to achieve a more accessible web. You can have all the evangelists in the world but unless they win converts and those converts act on their new found convictions it means nothing. They have certainly made a convert out of me and I thank them for their inspiration and hard work.

Dealing with complex navigation

Posted in User experience on by Paul Boag

One of the biggest challenges faced by website designers is how to deal with a sites main navigation. It is a particular challenge on deep complex sites.

The problem

How many levels of navigation do you build into your website? Its a fairly fundermental question. Almost all sites have at least two. The main sites sections and then the sub sections underneath. But is that enough? Probably not and yet many web designers fail to consider how content deeper in the site is going to be shown. But how deep do you go? Three levels, four?

Case study

Headscape have recently been tendering for some work with a large university in the south of england. They want a complete redesign of their web presence and require a site flexible enough to encompass all of the different organisations and departments that make up the university. They also want a site that is able to expand and change over the coming years. This is particularly challenging when it comes to the navigation. It didnt take us long to realise that a conventional approach to navigation was not going to work. After all the site could easily become more than 6 or 7 levels deep by the time you navigate through faculties, departments, research groups, and individual courses. Ignoring the fact that this would be horribly confusing there simply was not enough space of the page for that amount of navigation! Add to this the fact that some pages deeper within the sites structure also acted as homepages in their own right. For example the International students section would be the landing page for most enquiries from abroad and so it was important that the user quickly grasped where they were in the sites structure and could easily see the sub sections of that part of the site.

Breadcrumbs

Traditionally breadcrumbs have been seen as the answer to helping users establish where they are in a sites hierachy however experience from usability sessions I have run over the years has shown me that the average user does not use breadcrumbs as much as we would hope. In many cases users simply do not notice them and even when they do many do not understand the concept. Also even if we used breadcrumbs to help the user identify where they are in the site structure this did not solve the fundermental problem of the size and depth of the navigation.

One possible solution

In desperate need of inspiration we started looking at other large and complex sites to see how they deal with the problem. Once again the BBC website proved itself head and shoulders above the rest. In particular it was the BBC sports website that caught our attention.

When you arrive on the site the left hand navigation shows a list of all the different sports they cover. Where it gets interesting however is that when you click on "football" it does not expand the menu as you would expect. Instead it replaces the first menu with a new one that shows the parent of "football" (in this case "Sport Homepage") and all of its children. When you click on a sub section of "football" the process is repeated. You see the children of the new section and the parents which now includes both the "Sports Homepage" and "Football". In effect they use a vertical form of breadcrumbs as the sites navigation.

Pros and Cons

The obvious benefit of this is that it can expand forever. It doesnt matter how many pages you add to the site or how deep it gets the navigation will never break. However it also gives the user a much clearer idea of where they are in the site. This would work particularly well on one of the landing pages I mentioned earlier because the user can see where they are in the overall site but be primarily focused on the children of that landing page.

The downside is that the user cannot jump from one sibling to another. In other words they cannot move between pages on the same level without first going back up a level. Although this could be annoying on slower connections I think this is a fair compromise for what is a much more flexible approach to navigation.