The Ultimate Website Prelaunch Checklist

All of a sudden the site you have been working on for months is approved and the client wants it live. However, things can still go horribly wrong if you are not prepared.

We’ve all been there.

After months of development, meetings, conference calls, protracted arguments over typography, photography, colour ways and copy. All of a sudden the site is approved and the client wants it live.

Do you think to yourself, ‘I know every pixel on this site inside out’ and put it live?

Hopefully not. You’ll have a printed checklist which you complete before you go public.

By no means is this an exhaustive list. Neither is it presented in any particular order. Your own checklist will be very much tailored towards your own individual clients and the type of project you are delivering. Be sure to add your thoughts and suggestions to the comments at the bottom of the page.

Either way, get your team together, get out the red pen and start ticking them off.

Copy Checks

Check your spelling.

If it comes down to a web designer to highlight the smelling pistakes of a copywriter then so be it. Show the world you are no slouch and run a spell check. Better still, get your copywriter / project manager to do this. Be sure you check for widows or orphaned items in important paragraphs too.

Check your tone of voice.

Ensure this is consistent across all your pages, that your audience is being addressed the same way throughout the site. If your services include ‘Research & Development’ ensure it is expressed using ‘&’ everywhere it appears, always with capitalisation, and if you display times and dates be sure to express them the same way throughout. This is a cornerstone of well-crafted, easily scannable copy.

Copywriting on the web workshop

Check your details.

I’m quite serious about this. Phone all phone numbers you have been supplied. Do they work? If you’re building a site for The Royal Albert Hall, do they answer? And are they aware you are shortly going to launch a site, with their number on it, inviting thousands of people to call for more information? These are crucial checks to ensure that the entire marketing process, right down to (phone) calls to action are prepared for the site going live. Check email addresses you have been supplied and make sure they work and are being received by someone. Oh, and check they are not still pointing at you for testing – make sure the clients email address is specified when the site goes live.

Check through any ‘hidden’ copy on site.

Look at ALT text and ensure it is descriptive and not just ‘XXX’ – read through any text within Javascript functions, failure or alert messages, and also and remove anything potentially embarrassing or plain unnecessary.

Make sure you are not going live with any test copy on your site.

Check for instances of ‘For more information call XXXX,’ or worse still, ‘At ACME and Co we pride ourselves on [Dave, has the client approved the mission statement yet]‘ You get the picture.

SEO

Check your keywords.

Ensure you have your meta description in place, and that any keywords are suitable for the site. Do the keywords appear in your site copy where appropriate? Turn off your style sheets and read your site as a search engine will, and check your keywords are written in HTML and not all contained within images.

Check your titles.

Do you pages have relevant and descriptive title tags, and are your page names suitably descriptive.

Check your URL structure

Google has taken considerable steps within Webmaster Tools to reward site owners for declaring, and being consistent about canonical URL’s. That is to declare to Google which URL structure you will maintain on your site, to avoid the duplicate content penalty. So if you choose example.com/products over www.example.com/products, then check to ensure the links within your pages follow this convention.

Check you have a sitemap.

Generate an XML sitemap and submit it to Google, Bing, and Yahoo. Gsite Crawler is a great tool to help create these automatically for you.

Set up analytics on your site and schedule any weekly reports that might need sending to your clients, and also set up any statistical alerts you might need to notify you of any spikes in traffic that might signify malicious activity. Stats packages worth your attention are listed in the URL’s below.

haveamint.com

Standards and Validation

Clearly this is not something that should be left until the last few days prior to launch. But you should always make one final sweep through your content to check for validation issues. You should be checking your HTML, CSS, Accessibility and your Javascript. Quite often you can encounter validation issues late in the project with the addition of javascripts from a third party if a client has reporting software they wish to use, or if you are carrying advertising or inviting referrals from an affiliate network. As these are so often just thrown in to the code at the last minute it is vital to check that they don’t interfere with functions that were (up until then) working just fine. The Developer Toolbar for Firefox is a great time saver when it comes to validating your HTML and CSS, with the WAVE toolbar being similarly indispensable for checking against WCAG guidelines. That said there is no substitute for a good working knowledge of the WCAG guidelines as so much of them cannot be checked against by a plug-in, and requires common sense and a keen eye to avoid problems.

Web Developers Toolbar

Site Functions

Does everything work?

Again, this should have been tested long before now, but don’t go live without checking it. Often you will have moved a site from a development server to a production server in the run up to putting it live, and that may have upset your file structure. Maybe you have an API which relies on the address of a development server to work and will need altering if it is to work at the live address.

Check your search facility

Check your search facility if you have one and make sure that is pulling in results. Also check for dead links across the site with something like Xenu’s Link Checker.

Screenshot of Xenu

Check all browser variations

Check all browser variations that you promised to support, all screen resolutions and ensure that your site degrades gracefully without the support of Javascript and Flash. Your site should be easily interpreted by a screen reader with CSS switched off, and this can be checked by downloading a text only browser such as Lynx for the PC.

Think about common web conventions and whether your site breaks them. Are all your links consistently styled? If all links are underlined, check that no text is underlined for presentational reasons that people might mistake for a link.

Don’t forget to set up a print style for your site.

It is stunning quite how often this ignored. Insert this line into your <head> tags and create your print style sheet.

<link rel="stylesheet" type="text/css" href="print.css" media="print" />

Security

Ensure you have your site files backed up, but assuming that this is something you do as a matter of course, ensure that you are backing up any databases on the website that might contain important customer data. There are services and applications who can automate this for you such as Site-Vault and Iron Mountain, providing you with the peace of mind that only a reliable backup can bring.

Screenshot of Site Vault website

Check your form fields against SQL injections, and test any anti-spam functions you have in place to prevent spam bots.

Protect any sensitive pages

Protect any sensitive pages or folders from being indexed on search engines by putting in place robots.txt files and by excluding them from within Webmaster Tools / Bing / Yahoo Site Explorer and also consider whether you need to use an htaccess file to disable folder view within directories.

Performance

Increasingly this is becoming more an issue. With rumours of Google rewarding faster sites with better rankings it is crucial that your pages load as swiftly as possible.

Safari 4 has a great tool within its developer menu which checks the speed of your pages downloading, and highlights which elements take the longest and therefore might need attention.

Check your image optimisation with a tool like Smushit.

Smush.it website

Check you have caching enabled if appropriate.

If possible consider the use of image sprites to reduce http requests to your site. SpriteMe.org offers simple online solution that might get you started.

Minify your Javascript and CSS files using a tool such as YUI or YSlow from Yahoo to ensure your code is delivered as swiftly as possible. Firefox add-ons such as Dust Me Selectors can help to remove unused selectors from style sheets, helping to keep file sizes down.

Legal

Those lawyers get everywhere. Links to legal policies are so often added to a footer element on a website and then given no further thought until moments before go live.

Copyright

Check that this is set to automatically refresh from the time stamp on the server, and that the copyright owner stated is correct. It won’t always be the client or brand who should be credited.

Terms and Conditions

If your site has a promotional element or takes payment then you will need to make available t’s and c’s. Always consult either the Institute of Sales Promotion or a lawyer for the best advice on these, or if they are supplied to you then make sure they have been checked.

Privacy Policies

If you use cookies, capture data, or distribute data, then you need one. The best advice is always to be honest, and to state clearly what you collect data for, how it is stored, and to whom might it be passed. So if you this might be you then be sure you have a clear statement explaining all of this, or least provide details of how you can be contacted for further information.

Company Registered Information

If you are a registered company then you must display on your website the registered company name, number, and address. Simple, but so often forgotten about. For more information visit either Companies House or Business Link online for more information.

Companies House website

Add icons and error pages

Add your favicon.

And while you’re at it, do you need one for mobile devices such as iPhones? Add this into the <head>

<link rel="icon" type="image/x-icon" href="/favicon.ico" />

And this for an iPhone

<link rel="apple-touch-icon" href="/favicon.png" />

Create 404 pages.

Crucial for so many reasons. If the project is a re-design then search engines will have cached links to pages that will no longer exist. Use 404 pages to present users with links to where that information is now located. Webmaster Tools provides an easy way to produce 404 pages if you aren’t an experienced developer, but ignore these at your peril.

Example error page

Further reading

Smashing Magazine wrote an excellent post entitled “45 Incredibly Useful Web Design Checklists and Questionnaires” that contains many more checklists worth reading. They have other launch checklists, web standards checklists and even a checklist for improving site performance.

If you recognise that the mobile web is important and you need help deciding on a strategy, then book a mobile consultancy clinic.

Book a consultancy clinic or contact Rob about a more in-depth review.

The biggest ecommerce lies and how to avoid them

I am amazed at some of the advice I read about building successful ecommerce sites. I seriously wonder who writes this stuff! In this post I debunk 5 common myths.

Of all the sites I am involved in at Headscape it is the ecommerce sites that excite me the most.

How can you not get excited about working on a website where the fruits of your labour are so visible and direct? Do a good job and the website makes more money, screw up and profits decline. There is something wonderfully black and white about it.

With such a measurable and obvious success criteria, you would have thought best practice would be well established and generally accepted. Bad advice would be quickly exposed for what it is and successful techniques would rise to the top.

However, it would appear that is not the case. I am amazed at how bad some of the advice is and how much bad practice exists.

In this post I want to focus on five of the worst offenders, beginning with the belief that you can never give users too much information.

1. You can never give the user too much [Wrong!]

Only recently I was reading an article about ecommerce that actively argued for providing users with as much information as possible.

On the face of it, this sounds like a good idea. The more information you provide, the better informed their decision becomes. However, in reality too much information can be overwhelming and lead to choice paralysis.

Compare for example the experience of buying a computer. For you and me this is a purchasing decision we are very comfortable with. However, for the majority of consumers it can be an intimidating experience. It is a minefield because there are too many choices and options.

Recently I bought a Dell netbook. Even as an experienced computer users this was a harrowing decision. I knew I wanted a low end, cheap netbook, so immediately ignored the plethora of laptops and desktops that could have confused my purchasing decision. However, that didn’t make the purchasing process easier. I still had to choice between the Dell Mini 9, 10 and 10v. I had to wade through technical specs outlining the differences, most of which I found unintelligible.

Screen capture from Dell Website

Once I had made my choice, I was presented with even more details and options. I had to select colour, type of hard drive, size of hard drive, operating system and on and on and on. In fact it even made me approve options where I had no alternative choice!

When compared to the limited and clearly defined line up of Apple computers, the contrast could not be more apparent.

Screen capture from the Apple website

More is not always better. If you want to encourage users to buy, then you need to make their choice a simple one. Remove everything but the most important information and minimise the number of choices available. This is something that has been understood for some time in traditional retailing, but has not filtered through to the web.

One retail technique that has transferred to the web is up-selling. However, you should thing twice about how to implement this technique.

2. Never miss an opportunity to cross-sell [Wrong!]

We all know supermarkets do it. You are queuing at the checkout surrounded by chocolate, magazines and other extras. They hope we will be tempted to pick up something on the way out. You go in for a loaf of bread and come out with a basket full of chocolates and a magazine on interior design. Any marketeer will tell you how effective this technique is.

Photograph of a supermarket checkout

Many successful websites also use this approach very effectively. Amazon is always looking for opportunities to cross-sell, based on its extensive knowledge of your buying habits and those of other users. However, even though it is obvious we will buy items on the spur of the moment, Amazon does not always up-sell.

Amazon recognises that the web is not the same as the real world. Unlike supermarkets, Amazon will not up-sell once users reach the checkout. In fact they are careful to avoid any distractions.

Screen capture of Amazon checkout

When the competition is only a click away you do not have the luxury of asking users to stand in line at the checkout, while you present them with additional products. Unlike the supermarket checkout there is no person to guide you through the process. It is user driven and so has to be as easy, focused and fast as possible.

Yes, it is important to up-sell. However, do it before the checkout process begins. Once the user makes a decision to buy, you need to ensure nothing gets in the way of that transaction. Some opportunities to cross-sell are worth missing.

Of course, there is no reason you cannot encourage users to buy again after the transaction is complete. That is where we need to look beyond the website.

3. Its all about your site [Wrong!]

Web designers want to sell you web site design services. It is therefore unsurprising that they concentrate their attention and advice on the website. However, the website is only one small part of a successful ecommerce business. The heart of successful ecommerce lies in service, not the website.

Don’t become so fixated on tweaking and improving your website that you neglect other areas of the user experience. Good customer service extends well beyond the users interactions with the website. It also includes vital components such as:

  • Email notifications - Do you keep the customer informed about the progress of their order?
  • Telephone support – Do you allow customers to speak to you directly?
  • Returns policy – How easy is it for customers to return an item if they do not like it?
  • Fulfilment – Are you in a position where you can fulfil orders quickly and dispatch them immediately?
  • Complaints handling – How well do you handle customer complaints? Do you go the extra mile?
  • Ongoing communication – Do you regularly keep in touch with customers? Do you offer them special deals and discounts? Is it easy for customers to opt out of these communications?

Customers who receive superb service are considerably more likely to make a second purchase and even more likely to recommend you to friends and family.

Screenshot from Customer Service Matters

Visit Bruce’s blog Now

It is even possible to substantially reduce your marketing spend if you make customer service a priority. Instead your reputation will spread through word of mouth.

Do not misunderstand, I still believe that getting your website right is extremely important. Small things can make a big difference in the eyes of your users. Take for example security.

4. Users care about security… badges [Wrong!]

There is no doubt that users care about online security. In fact there is still a large proportion of people who are unwilling to buy online for fear of credit card fraud. The media has done an excellent job at ensuring the public are suspicious of online transactions, even though they are willing to hand over their credit card in a restaurant.

Whether the users concerns are justified or not, we need to take them seriously if we want people to buy.

Many ecommerce businesses spend a lot of money ensuring their sites are secure. How then do they choose to communicate this massive investment to their users in order to reassure them? – They slap a badge on their website!

Adding a small Verisign or Mcafee badge to your checkout page is not enough to alleviate users fears. At best they are free advertising for the companies involved. At worst they are entirely ignored because they look like banners.

A screen capture of a website with no security information except a Verisign logo

A better approach is to tackle the problem head on. Add copy to your website addressing this issue and the steps you have taken to ensure the customers security. Do not rely on a single graphic to say all that needs to be said.

5. Amazon is the template we should all follow [Wrong!]

This final lie is probably the most widely held of all. There is a belief that because Amazon is so successful, all ecommerce websites should follow their example.

There is however a number of flaws in this argument:

  • They don’t get everything right (nobody can).
  • They are partially successful because they were one of the first ecommerce websites to market.
  • Their reputation and brand recognition allows them to get away with a lot.
  • Users are familiar with their site and its eccentricities.

In short, what works for them will not necessarily work for you. Too many website owners blindly copy Amazon because they are seen as the leader in ecommerce. Not only is that flawed for the reasons I gave above, it also removes the possibility of you ever being better than Amazon or innovating in anyway.

Amazon Homepage

Don’t get me wrong – I believe there is a lot that can be learnt from Amazon. However, I do not believe it is in anybodies interest to blindly follow their lead.

Bonus lie: Ecommerce is easy

Probably the biggest lie of all is that ecommerce is easy. Admittedly off the shelf solutions such as Shopify make it extremely easy to build ecommerce websites. However, building the site is only the beginning. The real challenge comes in:

  • focusing your site,
  • deciding on when to up-sell,
  • providing great customer service,
  • communicating clearly
  • and learning from others.

Creating a successful ecommerce business is a long term commitment and you will need to continually evolve both your website and strategy.

So, what about you? What ecommerce lies have you heard? What great advice would you like to pass on? Post in the comments below.

Case Study: Wiltshire Farm Foods

One of the biggest challenges of running a successful website is balancing the needs of users with those of the business. This is especially true when an existing business model conflicts with user needs.

Although not always the case, one situation where this conflict can arise is with franchise based businesses. For the last few years I have been working with a franchise business called Wiltshire Farm Foods. Although, their business model has been phenomenally successful it caused significant problems for their online customers.

When business models and user needs conflict

When hired to redevelop the Wiltshire Farm Foods website I saw an opportunity for a quick win. Before a user could enter the website, they were required to provide a postcode. This was a massive barrier to entry as users do not like handing over personal information (such as a postcode) without being given a reason. From looking at the website statistics it was obvious many users were abandoning the site because of this requirement. I couldn’t understand why the company had created such a huge usability hurdle.

The Old WFF homepage

The answer was simple – Wiltshire Farm Foods had chosen to give their franchisees control over pricing. Without knowing where the user was located it was impossible to provide a price.

The decision to give franchisee variable pricing was a good one in the pre e-commerce era. However, as the importance of the web grew, it created a significant problem when competing against large supermarket chains with a national distribution network and standardised prices.

Although this was a problem for online users, the model worked for the business as a whole. Wiltshire Farm Foods had an incredibly successful relationship with its franchisees. Some had been with the company since day one. The business was driven by the entrepreneurial spirit of its franchisees and independent pricing was a key component of that success.

Working within constraints

With the variable pricing constraint remaining unmovable it became a case of managing the impact. Our first step was to move the point at which users were asked for a postcode. Instead of requesting it up front, we only asked for it when users asked for a price. This allowed users to view products and clearly linked the request for a postcode with pricing. We also explained why this step was necessary to reassure users this was not a ploy to send them unsolicited mail. However, ultimately we could not get around the extra step required to see prices.

It would have been counter productive to dig our heels in and refuse to compromise the user experience. Instead we took a pragmatic approach and worked within the business constraints. Ultimately this worked in our favour. When Wiltshire Farm Foods saw the increase in sales that came from moving where users entered their postcode, it encouraged them to consider changes in their business model.

Users now get a web price for each product when they arrive on the site for the first time. This price is then ‘adjusted’ once they login or provide a postcode. The user is notified of the change and because the price normally decreases they are generally happy. It is not ideal but it is a dramatic improvement that has greatly increased sales.

Turning a negative into a positive

Although the introduction of web prices is significant, it has not been the biggest change in the site. The real change has happened in my own thinking. In the beginning I saw the franchise model as a hurdle to overcome. However, I have since come to realise the benefit it has to the overall user experience, especially for the site’s target audience.

The Wiltshire Farm Foods audience is elderly with the average purchaser being in their eighties. Not only does this audience have certain accessibility requirements, they also have a number of concerns that need addressing.

One of their biggest concerns is security, both when purchasing online but also when meals are delivered. They are nervous about letting strangers in their house and yet need help unpacking and storing their meals.

The Wiltshire Farm Foods franchise system accommodates this perfectly. Customers always get the same driver and feel they are dealing with a local supplier rather than a national brand. They can even pay with cash on delivery and place new orders directly with the driver.

The problem was that the website did not reflect this local caring service. I was so preoccupied with the negatives of the franchise system, that I failed to identify it as a major selling point.

Franchises can offer personal service

Fortunately as I grew to understand the business model, I was able to grasp what Wiltshire Farm Foods had known since the beginning – that service was what set them apart. Wiltshire Farm Foods did not need to be overly concerned about universal pricing because they offered things no national supermarket could. They offered a friendly, caring service from police checked uniformed drivers. These drivers would even unpack meals and take next orders. However, most importantly they were a local supplier who customers came to know personally.

Once I understood this important selling point it fundamentally altered my approach to the site. The homepage shifted away from merely showing products to promoting the service that was supplied alongside the meals.

WFF homepage

The homepage now focuses on promoting these ‘value added’ services through the use of animation. However, more importantly we made a feature of postcode entry. Entering your postcode no longer just revealed your region specific pricing, it introduced you to your local franchisee. Gone was the faceless national brand and instead you were given the names and phone number of your local supplier. Soon you will even see a photograph of your local franchisee and details about their delivery schedules.

Screenshot of the local outlet information

All of this helps to reassure the user and personalise the experience. Computers are seen by many (especially the elderly) as impersonal and cold. Techniques like this humanise the experience and connect with users.

Lessons learnt

There is a lot that can be learned from the development of the Wiltshire Farm Foods website. We can learn about the importance of understanding your target audience and their motivations. We can learn how a perceived limitation in a business model can be turned into a strength. However, what excites me most is the opportunities provided by the Franchise model to engage with users in a more personal way that is lacking in many websites. With the growth of online social interaction there is the potential for an unprecedented level of customer care.

10 criteria for selecting a CMS

Choosing a content management system can be tricky. Without a clearly defined set of requirements you will be seduced by fancy functionality that you will never use. What then should you look for in a CMS?

I have written about content management systems before. I have highlighted the hidden costs of a CMS, explained the differentiators behind the feature list and even provided advice for CMS users. However, I have never asked what features you should be looking for in a content management systems. That is what I want to address here.

Illustration of a sales man selling a CMS the client does not need.

When I left home for University my mother taught me a valuable lesson. If you want to save money, never go grocery shopping when you are hungry and always write a list. If you don’t you will be tempted to buy things you do not need.

The same principle is true when it comes to selecting a content management system. Without a clearly defined set of requirements you will be seduced by fancy functionality that you will never use. Before you know it you will be buying an enterprise level system for tens of thousands of dollars when a free blogging tool would have done.

How then do you establish your list of requirements? Although your circumstances will vary there are ten areas that are particularly important.

1. Core functionality

When most people think of content management, they are thinking of the creation, deletion, editing and organizing of pages. They assume all content management systems do this and so take the functionality for granted. However that is not necessarily the case. There is also no guarantee that it is done in an intuitive fashion.

Not all blogging platforms for example allow the owner to manage and organize pages into a tree hierarchy. Instead the individual ‘posts’ are automatically organized by criteria such as date or category. In some situations this is perfectly adequate. In fact this limitation in functionality keeps the interface simple and easy to understand. However, in other circumstances the absence of this functionality can be frustrating.

Blogger Homepage

Consider carefully the basic functionality you need. Even if you do not require the ability to structure and organize pages now, you may in the future. Be wary of any system that does not allow you to complete these core activities.

Also ask yourself how easy it is to complete these tasks. There are literally thousands of content management systems on the market, the majority of which offer the core functionality. However they vary hugely in usability. Alway look to test a system for usability before making a purchase.

The editor is one core feature worth particular attention.

2. The editor

The majority of content management systems have a WYSIWYG editor. Strangely this editor is often ill considered, despite the fact that it is the most used feature within the system.

The editor is the interface through which content is added and amended. Traditionally, it has also allowed the content provider to apply basic formatting such as the selection of fonts and colour. However more recently there has been a move away from this type of editor to something that reflects the principles of best practice.

The danger of traditional WYSIWYG editors is two fold. First, they give the content provider too much design control. They are able to customize the appearance of a page to such an extent that it could undermine the consistence of design and branding. Second, in order to achieve this level of design control the cms mixes design and content.

The new generation of editors take a different approach. The content provider uses the editor to markup headings, lists, links and other elements without dictating how they should appear.

Wordpress WYSIWYG

Ensure your list of requirements include an editor that uses this approach and does not give content providers control over appearance. At the very least look for content management systems that allow the editor to be replaced with a more appropriate solution.

The editor should also be able to handle external assets including images and downloads. That brings us on to the management of these assets.

3. Managing assets

Managing images and files are badly handled by some cms packages. Issues of accessibility and ease of use can cause frustration with badly designed systems. Images in particular can cause problems. Ensure that the content management system you select forces content provider to add alt attributes to imagery. You may also want a cms that provides basic image editing tools such as crop, resize and rotate. However, finding such a cms can be a challenge.

Also consider how the content management system deals with uploading and attaching PDFs, Word documents and other similar files. How are they then displayed to users? What descriptions can be attached to the files and is the search capable of indexing them.

4. Search

Search is an important aspect of any site. Approximately half of users will start with search when looking for content. However, often the search functionality available in content management systems is inadequate.

Here are a few things to look for when assessing search functionality:

  • Freshness – How often does the search engine index your site? This is especially important if your site changes regularly.
  • Completeness – Does it index the entire content of each page? What about attached files such as PDFs, Word documents, Excel and Powerpoint?
  • Speed – Some search engines can take an age to return results. This is especially common on large sites.
  • Scope – Can you limit the scope of search to a particular section of the site or refine search results once returned?
  • Ranking – How does the search engine determine the ranking of results? Can this be customized either by the website owner or by the user?
  • Customization – Can you control how results are returned and customize the design?

The issue of customization is one that goes far beyond search.

5. Customization

I have been unfortunate enough to work with content management systems that are completely inflexible in their presentation.

Illustration demonstrating the inflexibility of some CMS

The presentation of your content should not be dictated by technology. It is simply not necessary now that we have techniques for separating design and content. Unfortunately like web designers, many content management providers have failed to adopt best practice and their systems produce horrendous code. This places unreasonable constraints on design and seriously impacts accessibility.

You need a content management system that allows flexibility in the way content is returned and presented. For example can you return news stories in reverse chronological order? Can you display events on a calendar? Is it possible to extract the latest user comments and display them on the homepage? It is flexibility that makes a cms stand out.

Talking of user comments, it is worth mentioning all forms of user interactions.

6. User interaction

If you intend to gather user feedback, your cms must provide that functionality or allow third party plugins to do so. Equally, if you want a community on your site then you will require functionality such as chat, forums, comments and ratings.

As a minimum you will require the ability to post forms and collect the responses. How easy does the cms make this process? Can you customize the fields or does that require technical expertise? What about the results? Can you specify who they are emailed to? Can they be written to a database or outputted as an excel document? Consider the type of functionality that you will require and look for a cms that supports that.

Also ask what tools exist for communicating with your customers. Can you send email newsletters? Can recipients be organized into groups who are mailed individually? What about news feeds and RSS?

Finally consider how you want users to be managed. Do you need to reset passwords or set permissions? Do you need to be able to export user information into other systems?

But it is not just user permissions that may need managing. You also have to consider permissions for those editing the site.

7. Roles and permissions

As the number of content providers increase, you will want more control over who can edit what. For example, personnel should be able to post job advertisements but not add content to the homepage. This requires a content management system that supports permissions. Although implementation can vary, permissions normally allow you to specify whether users to edit specific pages or even entire sections of the site.

Illustration showing the consequences of not having a permissions system

As the number of contributors grows still further you may require one individual to review the content being posted to ensure accuracy and consistent tone. Alternatively content might be inputed by a junior member of staff who requires the approval of somebody more senior before making that content live.

In both cases this requires a cms that supports multiple roles. This can be as simple as editors and approver, or complex allowing customized roles with different permissions.

Finally, enterprise level content management systems support entire workflows where a page update has to go through a series of checkpoints before being allowed to go live. These complex scenarios require the ability to roll back pages to a pervious version.

8. Versioning

Being able to revert to a previous version of a page allows you to quickly recover if something is posted by accident.

Some content management systems have complex versioning that allow you to rollback to a specific date. However, in most cases this is overkill. The most common use of versioning is simply to return to the last saved state.

Although this sounds like an indispensable feature, in my experience it is rarely used expect in complex workflow situations. That said, although versioning was once a enterprise level tool it is increasingly becoming available in most content management systems. This is also true of multi-site support.

9. Multiple site support

With more content management systems allowing you to run multiple websites from the same installation, I would recommend that this is a must-have feature.

Although you may not currently need to manage more than a single site, that could change. You may decide to launch a new site targeting a different audience.

Alternatively with the growth of the mobile web, you may create a separate site designed for mobile devices. Whatever the reason, having the flexibility to run multiple websites is important.

Movable Type admin system

Another feature that you may not require immediately but could need in the future, is multilingual support.

10. Multilingual support

It is easy to dismiss the need to support multiple languages. Your site may be targeted specifically at the domestic market or you may sell a language specific product. However think twice before dismissing this requirement.

Even if your product is language specific, that could change. It is important that your cms can grow with your business and changing requirements.

Also just because you are targeting the domestic market does not mean you can ignore language. We live in a multicultural society where numerous languages are spoken. Being able to accommodate these differences provides a significant edge on your competition.

That said, do think through the ramifications of this requirement. Just because you have the ability to add multiple languages doesn’t mean you have the content. Too many of my clients have insisted on multilingual support and yet have never used it. They have failed to consider where they are going to get the content translated and how they intend to pay for it.

Conclusions

Features are an important part of the CMS selection process, but they are not everything. It is also important to consider issues like licensing, support, accessibility, security, training and much more.

I leave you with a word of warning – Don’t let your list of requirements become a wish list. Keep your requirements to a minimum, but at the same time keep an eye on the future. Its a fine line to walk. On one hand you don’t want to pay for functionality you never use. On the other, you do not want to be stuck with a content management system that no longer meets your needs.

This has been an extract from the Website Owners Manual - now available as an ebook and for preorder in print.

What's with the attitude?

We face many challenges as designers and developers – IE6, the fast pace or change, meeting the needs of disabled users. However, I am coming to believe that our biggest challenge is our own attitude.

This post started off as a bit of fun. It was going to be another spoof, this time in the form of a top 10 list of harsh truths. However, as I began writing I found myself actually believing many of the points. In the end I was forced to scrap that draft and start from scratch.

I am worried about how people see us as web designers. More than that, I am worried how we behave as web designers, both with our clients and towards one another.

Let me explain what I mean, starting with the more obvious and damaging area – our attitude towards clients.

Our attitude towards clients

I speak to a lot of web designers and in all of those conversations I rarely hear a positive word said about the people who keep us employed.

The overwhelming attitude towards clients is one of disdain. Oh, we hide our feelings reasonably well when dealing with them face to face. However, behind their backs we are often critical and derisive.

We see clients as stupid, awkward, or intent on derailing the project. In short we see them as the enemy.

We have to change this attitude. Not only is it damaging to the relationship, it is also untrue. Just because somebody doesn’t understand the web, does not make them an idiot. Without a doubt they will be far more knowledgeable than you in many, many areas.

You cannot have it both ways. On one hand we set ourselves up as experts who should be listened to. On the other, we are surprised that the client doesn’t instinctively know, understand and except everything we suggest. If they could, we would not be the expert!

We need to recognise the critical role the client brings to the web design process and stop trying to exclude them for fear they might bring something different to the table we might not like.

Stop treating your clients like children and start treating them as peers. That means listening to their contributions even when it does not sit comfortably with your own views. This involves us losing our sense of moral superiority.

You do not have the moral high ground

I do not hide the fact that I am an evangelical christian. That means associating myself with some people who have an enormous sense of smug satisfaction and moral superiority. Some of these people really think they are ‘Gods gift,’ literally! However, they pale in comparison to the moral and intellectual snobbery I encounter in the web design community.

I am fed up with web designers who judge others (and their own clients) with such passion and vigour it borders on the fanatical.

We are not poets, artists or preachers. We do not have the luxury of free thinking theory. We should be pragmatists that work in the real world and solve real world problems.

The problem is that most of our high minded ideals are nothing more than ego. It is about exalting ourselves at the expense of others. Let me give you a few examples of what I mean…

Why doesn’t your site validate?

I can’t believe they code in .net

He is always asking people to retweet his posts.

Oh, they are just link baiting

Comments like that are just about pulling others down. Validation isn’t everything and how can you judge somebody’s decision to code in a certain language without any background information? Hell, what does it matter to you anyway? As for link baiting and retweeting – what is wrong with wanting to drive traffic? There seems to be an attitude that desiring your site to be popular and working towards that end, is in someway wrong! Admittedly new traffic is not the whole story but it is a part of it.

Promoting your sites or services is not desperate or needy. It is good business. If all you offer clients is moral superiority and a well built site, then you are only offering them half a service.

I am not saying there are no lines. I do not condone black hat SEO techniques and I hate SPAM as much as the next person. However, I think we need to drop the attitude and consider the broader picture. We need to consider the business behind the site.

Stop trying to be intellectually superior

Unfortunately we do not just like to feel morally superior, we also like to feel intellectually superior.

We dress our profession up in impenetrable jargon and give ourselves fancy job titles. In many ways we are like teenagers trying to appear more grown up by smoking and drinking.

I guess this is not surprising. Our industry is barely in its teens. We are trying to find our identity and justify our existence. However, in the process we are in danger of becoming elitist and inaccessible to outsiders.

Take for example the recent rash of Top 10 posts. It is something I have started doing myself and have received a massive amount of criticism for it. I have been accused of dumbing down, catering for the lowest common denominator and being desperate for traffic.

Indeed top 10 posts do drive more traffic. That is because people like them. They like them because they are accessible. They are easy to scan and easy to assimilate. In what way is that bad?

Those who criticise do so because they feel that in some way these posts cheapen the industry or devalue what we do. I get the same criticism about my podcast. We joke on the show and have fun. We make the information accessible. Therefore we must be devaluing it.

In my opinion this is a view driven by insecurity. By wrapping up what you say in long words and impenetrable jargon you can hide the truth. You can sound better than you really are.

Unfortunately this just isn’t true. By making it impenetrable you are actually hiding its worth. By explaining what you know in a clear and accessible way you demonstrate its real value.

The desire for exclusivity

All of this is driven by a desire to the ‘cool kid’. Perhaps it is a hang over from our school days when geeks were far from popular. We try to impress and dominate, when we should be empathising and working together.

Another manifestation of this cool kid mentality is our rejection of anything mainstream. As soon as something becomes popular we drop it like a stone. Now our clients are talking about twitter, we accuse them of ruining it and start looking for the next thing. We want to be exclusive, special, different.

The trouble is the mainstream pays the bills. We need to break out of our exclusive little bubble and try to associate more closely with that mainstream. We need to understand what the general populace are embracing and go with that, even if it means still supporting IE6.

Conclusion

This post is aimed as much at myself as anybody else. I catch myself doing many of the things I have written about here.

In many ways the web design community is awesome. There are not many industries where direct competitors talk to one another so openly and freely. However in doing so we have become somewhat insular and very intense. I think sometimes we are under the impression that we are shaping the future and that every choice we make is of crucial importance.

At the end of the day we are just building websites. We need to get some perspective.

Thus ends the rant :p

149. White Hat

On this week’s show: How to become number one on Google *cough*, are customer testimonials worth it and how do you create a reassuring website.

Download this show.

Launch our podcast player

Housekeeping

Some housekeeping to kick off today’s show I am afraid:

Web Design Introductory Training

Drew and Rachel over at EdgeOfMySeat.com are running two training courses next month that look ideal for those starting out in web design. What is more they are offering boagworld listeners 10% off if they enter the promo code ‘boagworld’ at checkout.

The two courses are…

HTML and Web Standards for Beginners – 19th February

a one day course ideally suited to those wanting to get into web design, or perhaps for clients who have to format content with HTML for their websites. Covers the basic web standards principals of semantic markup and separation of content, structure and presentation.

Beginners CSS – 20th February

a one day course for learning CSS from the ground up. We go from zero knowledge right through to building floated, positioned and fixed width layouts.

For more information visit edgeofmyseat.com/training/

Bamboo Juice

Next up is a conference I am really excited to be speaking at. It called Bamboo Juice and is a one day conference taking place at the Eden Project in Cornwall. There is a growing line up of speakers that currently includes people like Jeremy Keith and myself.

It is great to see conferences happening further afield in the UK and I really want to see this one succeed. Please support it if you can. Cornwall is a stunning place and the Eden Project is a must visit. You ticket includes entry to the Eden Project so you will have a chance to look around.

Best of all the entire conference only costs £99! Please, please join us. Its going to be great fun and it should have a nice intimate feel with lots of time for chatting.

You can book your ticket now at bamboojuice.co.uk.

Consultancy Competition

Just a reminder of our free consultancy competition. Headscape are giving away a free days consultancy to a lucky winner. Email us with your name, URL and why you want us to help you out. We will pick a winner at the end of the month.

If you can’t wait that long Paul has started running mini-consultancy clinics via Skype. You can buy 30 minutes or more of Paul’s time and he will chat with you about your site, career or anything else (within reason). Its a bit of an experiment at the moment so if you are interested in trying it out visit the Boagworld forum where he talks more about the idea.

Back to top

News and events

More on jQuery

If you listen to this show regularly then no doubt you will be aware of what a huge jQuery fan I am. I was therefore super excited this week to see the release of a new version of jQuery that builds on what is already an excellent Javascript library.

Most of the improvements are in performance. This is remarkable as jQuery was already one of the most lightweight and speedy libraries available. However, they seem to have made some significant improvements.

The main new piece of functionality is something called Live Events. Live Events allows you to bind events (such as a onclick event) to all elements even if they have yet to be created. Let me give you an example. Let’s say you wanted all links with a class=’external’ to open in a new window. Previously you would create a function that added an event to all links with that class so that when the link was clicked it opened a new window. The problem was that if you added more links dynamically to the page you would have to rerun the function if you wanted them to behave in the same way. With live events this is no longer necessary. This is a huge improvement and one that will streamline a lot of code.

I really cannot say enough good things about jQuery. It really is enormously powerful and a real time saver. What you can do with it is quite amazing as is demonstrated by a post from Smashing Magazine this week entitled "45+ New jQuery Techniques For Good User Experience". Whether you use jQuery already or not, check this post out. It will definitely give you loads of ideas for enhancing your sites.

Getting started with HTML 5

Talking of new releases, there is a significant amount of buzz surrounding HTML 5 at the moment. This is somewhat surprising considering it is a long way from being finished and some even argue we do not need it in its current form.

Cameron Moll does a nice job of providing a round up of what is currently being written about HTML 5 including a nice little summary at the beginning…

The world isn’t ready for HTML 5 at large just yet, but we can begin preparing for it by using common, semantic selector names (header, nav, section, etc.)

To be honest it is still early days for HTML 5 with some estimating it will be released in 2022 some estimating that it will not be fully implemented by browsers until 2022. With those kind of timescales we can afford not to care. Jeff Croft puts it up nicely in his post "Two Thousand and Twenty Two" where he says…

It ultimately doesn’t matter if HTML 5 is available next month, next year, or fifty years from now. Those of us who do real work in this industry know that the only thing that really matters is what specs and technologies are supported by the browsers real people use.

Jeff came under a lot of attack for his post but I have to say I agree with him. What matters to real web designers and real website owners is what browsers will support now. So my advice is to ignore HTML 5 now and brush up on your WCAG 2 instead!

Web design trends for 2009

We turn now to the more immediate future and a post by the people over at Smashing Magazine. "Web Design Trends of 2009" endeavours to look at emerging trends that could become mainstream over the coming year.

To be honest I am not sure these are some much web design trends of 2009, as a look back at the end of the last year. However, it makes interesting reading none the less.

The trends listed include…

  • Use of letterpress typography, where text is ‘punched out’ of the background
  • An increase in the richness of user interfaces through the use of Javascript
  • The general acceptance of PNG transparency
  • Big bold typography
  • An increased use of font replacement using tools like sFIR
  • More sites than ever using overlay boxes to display images and video
  • A proliferation of video and screencasts
  • Blogs adopting a more magazine orientated design aesthetic
  • Lots of Javascript slideshows wherever you look

Nothing particularly surprising, but the article does provide some inspiring examples of these different trends and analysis about wh
y they are becoming fashionable.

Your website can thrive in a recession

We conclude today with another post about the recession. To be honest I am getting sick of talking about it. In fact I suspect it is turning into a self fulfilling prophesy. However, Gerry McGovern has written an interesting post about how your website could thrive in a recession.

The article mainly focuses on the cost savings that can be made by bringing customer interactions online. He quotes research which states:

the average cost of a web interaction is 27 pence, the average cost of a phone interaction is 3.76 Sterling and the average cost of a face-to-face interaction is 9.34 Sterling.

He goes on to say:

So, it is 14 times cheaper to allow a customer to complete a task on a website than to have the customer complete the same task over the phone. The Web is 35 times cheaper for completing such a task than a face-to-face interaction. Isn’t that a compelling business case for a website during a recession?

It is an interesting argument and one that may sway some of the people holding the purse strings. However it fails to take into account the upfront development cost of moving customer interactions online. For better or worse companies are focusing on short term cost savings at the moment rather than long term expenses. As a result some web design projects are being put on hold.

Nevertheless if you work for an organisation that deals with a large number of customers then this article is a powerful arguement. It is certainly something that you need to show your boss.

Back to top

Feature: Becoming Number One On Google

‘Become number one on Google’ – The dream of every website owner and titles like that grab people’s attention. What can you do to help achieve that dream without resorting to black hat techniques? Read More

Back to top

Listeners feedback:

Customer testimonials – Are they worth it?

Question from Dave Rupert –

“Client Testimonials” – whenever some marketing aficionado comes up with these they want them on the site. When was the last time you thought “OOOOH CLIENT TESTIMONIALS!! OMFGWTFBMXBBQ!!1!” and clicked to go see a whole page of them? Are these out of date? Does anyone care about them? Are there examples of good implementation? Do you use Client Testimonials on your site? If so, why?

This is a good question because it has made me question something that I have always considered to be a really good thing on websites.

I think someone in Dave’s position – who I assume is a web developer/owner – won’t ever get excited about a list of client testimonials. Let’s face it, they’re not for Dave. They’re meant for visitors to the site to try and persuade them that buying a product or hiring a service is a good idea. The idea is that customers are far more likely to trust a testimonial from an existing client than the marketing speak on a website.

But this is where I have started to question my thinking. For example: “I am Mr X from company Y and I have to tell you that after using these people’s services I am now a better, more rounded person and I have decided to name my first-born after the MD”… this rather points to the fact that Mr X is the MD’s brother/drinking buddy/receiver of folding in a reverse handed way (delete as appropriate)… or even the MD himself!

So, do potential customers place any value in testimonials or do they instantly think they are fiction. In my opinion, I do still think they have value, particularly if you back up an online testimonial with that particular client’s contact details in a proposal. I also think that video testimonials have more value than written ones because (unless they are a complete setup) you will be getting the client’s real feelings and you can watch their body language.

Slightly going of point, regarding providing client contact details for inclusion in a proposal, I have started to ask potential new clients which of our existing clients they would like to talk to rather than simply providing a list chosen by me. I think this adds a further degree of trust.

Fundamentally, I do still think testimonials are a good thing and we will continue to use them on our site. But I don’t think I will be placing so much importance on them as I used to.

How do you make your site feel safe

Kevin Dees asks an interesting question on the forum:

I don’t know if this question has been asked before but I’m interested in what other designers have done to help make a site "feel safe".

Many times I find myself leaving e-commerce sites… because they do not feel safe. I find that this is due to poor design. Big flashing buttons and the like make me wonder if I’m going to get scammed.

So, I guess what my question is "how, as a designer, do you make your site feel safe, welcoming, and secure with the design itself? What are good practices? How do you make users go were you want them to, yet make them feel like they are still in control? What do you suggest adding or even keeping way from when it comes to design"

The answers he got in the forum didn’t really address his question. They focused on the realities of making a site safe (security and technology) rather than on the perception of security.

A site maybe the safest in the world but if the design isn’t right you are left with doubts. Take for example the new US government site that allows people to apply for visa waivers every time they travel to the US. One would hope that a site collecting that amount of personal data would be extremely secure but the design leaves you wondering if it is legitimate. It just doesn’t ‘feel’ professional.

I have spent a long time trying to come up with an answer for Kevin. However, I have found it hard to define what provides that sense of security. Part of the problem is that I think as a web designer I am more sensitive to the ‘vibe’ a site gives off than the average user. I am not sure I am best placed to judge.

Also, a lot of the things that occurred to me where content issues more than design. Delivery policy, site security, returns policy etc. are all content issues and so do not answer Kevin’s question.

However a few things have come to mind…

  • An attention to detail – Sites that lack an attention to detail always make me nervous. Poor browser support, bad grammar, inconsistencies and ill considered design reek of unprofessionalism. If I am going to spend my money on a site, I want to know that money and time has been invested in its creation. If an organisation is shoddy in the production of their own site, then I can probably expect the same attitude in the way they interact with me!
  • Structure – I think a strong grid structure is very reassuring. It conveys a sense of order that is disconcerting when not there. I think that is the problem I have with the US immigration site. The form you have to fill in is all over the place. Fields don’t line up and the site lacks any sense of order.
  • Colour – Misjudging colour can have a serious physiological effect on how we perceive a site. Some colours ar
    e naturally more trustworthy than others. Blue for example has a very safe reliable quality. However using a conservative blue on a site aimed at young girls will project entirely the wrong image and make the audience suspicious of your site.
  • Trying too hard – Some sites just try too hard, shouting for attention. Flashy graphics, heavy sales copy and advertising orientated imagery all scream desperation and manipulation. People do not like to be manipulated or pushed into responding. They like to move at their own pace. Push them too hard and they will run away.

I am not sure I have done particularly well at answering the question either, but hopefully there is something in there you might find useful.

 

143. Partnership

On this week’s show Paul and Marcus discuss how to promote your web application, ways to improve the client/designer relationship and tools for managing your font library.

Download this show.

Launch our podcast player

Watch the behind the scenes video

News and events

Obama top technology promises

One of the most exciting things about being at this years FoWD conference in New York was that I got to witness the election of the next U.S. president.

Whatever your political persuasions it was a landmark election. Not only will Obama be the first African American president he is also probably the most technically aware.

Obama campaigned aggressively online, from a dedicated YouTube channel to Obama pages on Facebook and MySpace as well as Twitter feeds. He even had his own iPhone application.

So what can we expect from this tech-savvy President? How will he shape the future of U.S. online presence and possibly that of the entire web? An article on tgdaily entitled ‘Barack Obama’s Top technology promises‘ gives us a roundup of various technological promises from Obama’s speeches. These include:

  • A commitment to Net Neutrality
  • A desire to expand broadband penetration in the U.S.
  • A review of the current wireless spectrum usage
  • Tougher legislation around online security.

Of course, promises made on the campaign trail are one thing. We shall see what the reality turns out to be.

Could Microsoft consider adopting Webkit?

Talking of things that may never be, a young (and very brave) developer at Microsoft recently asked Steve Ballmer:

Why is IE still relevant and why is it worth spending money on rendering engines when there are open source ones available that can respond to changes in Web standards faster?

Ballmer’s response was surprising to say the least:

There will still be a lot of proprietary innovation in the browser itself so we may need to have a rendering service. Open source is interesting. Apple has embraced Webkit and we may look at that, but we will continue to build extensions for IE 8.

Although some have seen this as a sign that Microsoft may adopt Webkit, personally I am sceptical. Were Microsoft to completely change its rendering engine it would inevitably break large numbers of sites and cause outrage among many of their large corporate clients.

The backlash when moving from IE6 to IE7 was massive. Moving to Webkit would conflict with Microsoft’s mantra of ‘not breaking the web’.

That said, we can dream. Without a doubt the real innovation and competitive advantage among browsers is in features, not rendering engines. This would in many ways be a smart move allowing Microsoft to concentrate on differentiation through ‘extensions’ and functionality, rather than wasting time on getting pages to display correctly.

WCAG 2.0 resources

Something that is definitely going to happen very soon is the release of WCAG 2.0.

WCAG 2.0. has now become a proposed recommendation. This means it is not only technically complete but has been successfully implemented on a large variety of sites. In short, it has been proved to work.

According to the Web Standards group this means it could therefore be released before Christmas.

This is hugely significant and very exciting from an accessibility point of view. WCAG 2.0. has come a long way from its controversial beginnings and is now a very good set of guidelines.

Now is the time to start building compliant sites and the Web Standards Group has provided some useful resources for implementing WCAG 2.0.

Prototyping with XHTML

Our final story is a post on the Boxes and Arrows website encouraging us to ‘Prototyping with XHTML‘.

The article lays out an approach to wireframing and prototyping, which is based entirely around the use of XHTML. Starting with the XHTML itself, you build up the structure and elements within your site. You then add CSS and Javascript to further refine the concept.

It is an approach with a lot of merit. Unlike other methods, the prototype is not thrown away but becomes apart of the final deliverable. It is also an approach particularly suited to multiple iterations, allowing you to refine the design over time.

In a world of web applications it is becoming increasingly important to demonstrate user interactions in a way static comps cannot. However, although this approach is appealing I do not believe it replaces the Photoshop mockup. Client’s like to see ‘finished’ looking designs. That said, it is another useful tool in your arsenal and you should be sure to read this post.

Back to top

Feature: A Partnership of Cooperation

At this years FoWD I shared how the relationship between web design agency and client is fundamentally broken. Where there should be mutual respect and cooperation, there is negativity and mistrust. Read More.

Back to top

Listeners feedback:

Marketing a web application

Nick Charlton writes: Long time listener, haven’t asked a question before though..

Apart from your blog, the podcast and twitter, how else have you marketed GetSignOff?

To be honest, I have done very little marketing yet. However, I know that has got to change. The problem is that I am not a trained marketeer and so don’t really know what I am doing. That said I do have a rough plan:

  • Free pro accounts – While in beta we gave away numerous pro accounts to ‘web celebs’. However, to be honest it was a waste of time. These guys were either too busy to review it or just didn’t feel it was worth writing about. This time I intend to give free accounts to those who blog about the application. Not entirely sure how I am going to do this yet but I think it might generate some buzz.
  • Offering discounts – Discounts are an effective way of spreading word of mouth. Again I am not entirely sure if or when we will do this, but offering the occasional discount should encourage people to tell their friends.
  • Targeting appropriate publications – I am in the process of writing a number of articles either directly or indirectly related to GetSignOff. I have also asked some sites to review the application. I have approached sites like Digital Web, Think Vitamin and printed publications such as .net. Having a product aimed at people like myself makes identifying appropriate publications easy.
  • Producing supporting video content – I have already produced the ‘Getting design sign off‘ presentation but also intend to make some shorter tutorials for YouTube. These will contain valuable content in their own right, but will also promote GSO.
  • Utilising CSS galleries – Because my audience are web designers we have submitted GSO to several CSS galleries. We know that many web designers use these sites and so this gives our application a lot of exposure.
  • Use speaking opportunities – Speaking opportunities have been a great opportunity for promoting GSO and I have started tailoring my speaking slots around the subject of sign off.

In time we may consider advertising through things like Google Adwords or the Deck. However, until we are confident in the return on investment we are not willing to invest more money in anything other than development.

Font management

Aurel writes: I would realy like to know how designers deal with fonts? From personal experience, I have alot of fonts and it takes me time to find or manage them. So I was wondering if you know of any way to group the fonts, e.g. when you go through the drop menu of fonts in photoshop, they apear in groups (or something along those lines).

The solution I use was recommended on the Rissington Podcast (oh the shame of admitting that.)

It is a piece of software called FontExplorer X which is available for both the mac and PC. It has some superb features if you are serious about fonts. These include:

  • Organising your fonts – Organise using a library, folders, tags and even smart sets. You can directly access all typefaces from a certain foundry or all fonts tagged with a certain keyword? You can even view all italic fonts.
  • Auto activation – FontExplorer allows you to decide which fonts are available in which applications. This is ideal if you want to avoid scrolling through large numbers of fonts in applications like Photoshop.
  • Font information – FontExplorer gives you a clear customisable preview of your fonts as well as detailed information on the character set and usage restrictions.

The application also has an in built store that allows you to buy additional fonts within the same intuitive interface. I am guessing this is how they manage to offer the whole application absolutely free.

Back to top

135. Libraries

In this week’s show we talk with John Resig on javaScript libraries and address the question what is more important when we release an app: speed or quality?

Play

Download this show.

Launch our podcast player

News and events

The complexity tax

Don’t you hate it when somebody beats you to the punch? I recently finished writing a report for our biggest client (Wiltshire Farm Foods). It talks a lot about the need to simplify and remove complexity. It is a lesson we should all learn and so I am in the process of turning extracts from the report into a blog post which we will cover in next weeks show.

However, it would appear I have been too slow and that Gerry McGovern has beaten me to it with an excellent post on the cost of complexity. However, where I focus on why simplicity is important, he addresses the underlying causes of complexity.

For me his post is summed up in the following quote…

Most organizations are producing far too much content. Too many emails, too many PowerPoints, too many reports, too many webpages. All this content creation activity keeps a lot of people busy.

If you are part of a large organisation or work on a substantial website you need to read this post.

10 Rules for Driving Traffic Using Forums

What do you do if you have no marketing budget but have some free time to promote your site? Well, there are a number of guerilla marketing techniques you could use but contributing to forums is one of the most effective.

Sitepoint has posted an article explaining why forums are a great way of driving traffic to your site. It goes on to suggest 10 rules for doing so effectively. These include…

  • Build your profile
  • Follow the rules
  • Start by responding
  • Contribute your expertise
  • Don’t be a ‘me too’ poster
  • Don’t self promote
  • Explain yourself, but be brief
  • If you’re wrong, say so
  • Write intelligently and correctly
  • Negativity is a no-no

This is an excellent article and one that you should definitely read before using forums as a marketing tool. If you do not, you are in danger of damaging your brand, rather than driving traffic.

Accessibility in suit and tie

The life of the corporate web worker who cares about standards and accessibility can be a frustrating one; hampered by office politics and archaic content management systems. In an article on the Think Vitamin site, Bruce Lawson looks at what you can do to make sure your projects are as accessible for your users as possible.

Its a very pragmatic article, which I love. Bruce works from the premise that this is going to be tough and makes suggestions like "some accessibility is better than none". He also talks about the need for ‘buy-in from the top’ but goes on to provide practical tips about how to get that buy in. What is more, his arguments for accessibility were backed up with facts. For example…

Finally, he looks at how to get content providers onboard through education and getting them writing HTML rather than relying on the WYSIWYG editor.

UK Government Browser Guidelines

Our final story raises an interesting discussion; should you decide which browsers to support based on popularity or capability?

Apparently, the UK government believes we should test on the basis of popularity. In a draft document advising public sector websites, it suggests that if a browser appears in visitor logs as being below an arbitrary percentage of total “unique visitors”, then it should not be listed as being “fully supported”.

On the surface this appears very sensible. However, as Jon Hicks points out on his site, this can create problems. He writes…

It isn’t clear how the supported browser list would be enforced, but I’m concerned that this approach will encourage browser sniffing, a move that will exclude browsers like Omniweb, Shiira and iCab, simply because their name isn’t ‘Safari’. They share the exact same rendering engine, and therefore require no further testing. You can be more inclusive without spending any extra resources.

In other words we should be defining our list of supported browsers based on capability rather than popularity. This is the approach used by Yahoo! and it is one that I would fully support.

The Yahoo model supports all browsers through progressive enhancement and graceful degradation, without the need to test on every browser. Its a neat solution but one that the UK government guidelines specifically say they do not advocate…

These guidelines do not advocate specific development methodologies, for example graceful degradation or progressive enhancement. However, it is widely accepted that sites conforming to open web standards such as XHTML and CSS are more likely to work well across a wide range of browsers.

How come if they are widely accepted, do they not advocate them?

Fortunately there is an opportunity to change things before this is set in stone. I recommend reading the WaSP article on the recommendations and then sending some polite feedback to the powers that be.

Back to top

Interview: John Resig on javaScript Libraries

Paul:Joining me today is John Resig, who is famous for jQuery and the work that he has been doing with jQuery. John, it is great to have you on the show.

John:Well, thanks for having me.

Paul:I have to say this at the beginning. I have to get this out of the way. I absolutely love working with jQuery, and it’s an absolute pleasure. I remember twittering just a few days ago that every time I start doing anything in jQuery it makes me smile, so that’s got to be a good sign.

John:Well that’s good. I’m glad to hear it.

Paul: What I wanted to do today is get you on the show and not just for me to suck up and say how great jQuery is, but to kind of look a little bit broader at the subject of JavaScript libraries. Because I have to say from a personal point of view my opinion has changed quite a lot about JavaScript libraries and I’m kind of interested in your perspective on things as somebody that’s actually created one. I think the place I want to start is for a long time I had the attitude that you shouldn’t use JavaScript or indeed any library and that you should know the underlying code yourself and all of this kind of thing. Let’s start with the question of how do you know if it’s appropriate to use a JavaScript library? When is it appropriate to use it? What’s your opinion on that?

John:Well, I guess my opinion is it’s always appropriate, and I mean the simple fact of the matter is that there’s two things. One is that when you’re developing, you’re trying to support, generally a large number of browsers simultaneously. This is the same as if you are doing CSS development, JavaScript development, you want to support a large enough market share and you want to make that development process easy. The problem is twofold that you’re going to be encountering weird browser bugs and the APIs, the different utilities the browsers provide, will be different. For example, Internet Explorer provides different ways of handling events from all the other browsers. So what libraries do is that they remove you away from dealing with browser bugs, which is huge. And at the same time they provide a simple interface that you can interact with that will just work ubiquitously.

Paul:Is there a problem there in the sense of, you know, somebody came along and they basically learned to write jQuery for example from scratch, but never learned the kind of underlying JavaScript? Is there a problem there, do people need to know JavaScript before they start using a library?

John:It depends on the library, but I don’t think you do. I don’t think you have to know JavaScript. In a lot of ways, at least in my experience with jQuery directly there’s a lot of people who have used jQuery who have never done any programming whatsoever. jQuery does embody a lot of advanced concepts but you don’t necessarily have to know them in order to make good use of jQuery. I know this sort of translates well into some of the other libraries but one point of concern you brought up was what if someone learns a library but doesn’t learn JavaScript? I used to be more concerned about that, if someone only knew a library and I guess from a purist perspective, that’s a bad thing. Fundamentally, you want people to be getting better at programming JavaScript, not this specific thing. However, I think the reality of it is, is that so many people are just using JavaScript or CSS or doing web design, they just want to get their job done. It’s not really a matter for them of becoming an excellent JavaScript programmer or awesome CSS user, you want to get from A to Z and finish their work in an effective manner that works everywhere. So I think it’s important to realize that this market, so to speak, exists. It’s a very large one. And that ignoring it completely will just leave users frustrated and going back to the simple cut and copy paste scripts that they used to use. So, I think what libraries are doing is they are instilling good standards, they are instilling good practices, even though the users don’t necessarily know about it. And then eventually what’s good is that since these libraries have these good practices that users can always open up a library and read about it and try to understand better what’s going on.

Paul:I guess that’s always been a little bit of my concern with relying heavily on a library is that if you come across something that’s a problem or a bug or something like that, you can’t fix it yourself because you don’t necessarily know your way around the library. What’s your response to people that say stuff like that?

John:Well by the same token if you encounter a problem with a browser you are far less capable of fixing that issue. There’s really no way about it other than that ultimately it would be good to have that knowledge, absolutely. I fully support people who want to do that and I’m writing a second book now encouraging people to do that, to dig into libraries, to learn more, to build their own. What’s important here is that you just don’t, you can’t force people to do it if they, one if they don’t want to or if they’re just not capable. There’s no reason I feel to force a designer, someone who’s a designer by trade to learn the fundamentals of object oriented programming, or functional programming. Theoretically that can help them some way in the future but what’s more important to them is doing good design and I think by helping people keep their focus where it should be. Obviously if a library is able to help programmers program better, that’s good as well. It’s all about helping people keeping their focus and making sure they aren’t down a rabbit hole getting sidetracked.

Paul:I think that’s the thing that really attracted me to jQuery is as a front-end interface designer was the fact that I could pick it up and run with it very easily. The conclusion I came to is, “OK. Well if I do by some chance find a major problem with it, there’s a massive community of very clever people out there that I can ask and I can get help from.” So, that kind of reassured me, I think. If then, we’ve kind of come to terms with the fact: “OK we want to use a library.” There are so many different ones out there. Run us through some of the different options available and the pros and cons and how do you go about picking which library is right for you?

John:Well it really depends a lot. There’s a coupe questions you need to answer. Probably the most important of which is you need to ask yourself, how do you want to write JavaScript? Because libraries end up augmenting or really changing the style of how you write JavaScript. So, finding a library that you like how it looks. It sounds very superficial, but you like how it looks, you like how the code feels is a great place to start. There’s obviously a lot of libraries to choose from. There’s a select group of libraries whose quality is generally above the others and the popularity of those libraries generally reflects the quality as well. Out of those I pick generally jQuery, Prototype, Yahoo UI, dojo, then also MooTools and sometimes XJS. What’s interesting is all those libraries are open source and they are all the most popular JavaScript libraries. I don’t think that’s a coincidence. It’s just a matter of fact that in the web these open source frameworks are going to improve better and attract more users and generally have better community to surround them. So out of these libraries though you break down into a lot of different paradigms for development. I’ll try to summarize as best I can, but it really is not substitute for trying it out yourself. Looking and seeing some examples you can have a pretty good feel right away. So, Prototype and MooTools, they both extend the native objects of the language. They both try to improve the JavaScript language itself. So they add new methods to arrays, they make strings better, at the same time they provide things like object-oriented code
, and all the way out to doing things like events and AJAX. The normal things that you would expect. But at a very broad level they are trying to improve the overall quality of the language and of the experience. Then you have Dojo, Yahoo UI, and XJS and they are generally very modular, very package oriented and they have components you can easily snap in and out with nice ways of handling dependencies and it can end up being a very cleanly architected style of coding. They really support object-oriented code, and additionally events, AJAX, all the normal stuff you would expect. I would tend to group jQuery a little bit differently in that jQuery is more oriented toward improving the relationship between JavaScript and HTML and that it’s highly focused on searching through an HTML document, modifying some things, just getting in and getting out. Unobtrusive, and it doesn’t provide any language features, it doesn’t provide any object-oriented code writing features, it’s just hyper-focused at the task on hand.

Paul:It strikes me from my experience with jQuery that it’s very much a tool that’s primarily focused at helping front-end interface people implement the kind of functionality that they require from a usability point of view rather than necessarily doing, I mean would you build massive applications in something like jQuery?

John:It’s absolutely possible and people do it all the time. For example, T-Mobile’s T-Online in Germany, they built their entire user area so like their mail, their calendar, and everything using jQuery. So it’s absolutely used for very large projects. What I think is very interesting for jQuery at least is that while we don’t explicitly provide the object-oriented styles that most hardcore developers are used to we provide some very interesting alternatives especially they way it, like functional programming that I think actually end up suiting development very well. It’s very different, I will completely grant that, but it’s still very capable of scaling quite large.

Paul:So if people go out there and they have a kind of play around with these different libraries and try each of them out as you say to kind of find what fits their style of coding, once they’ve found something that kind of codes in the way they would like to, for example for me the similarities between jQuery and CSS made it a very natural fit, but what are the kind of things that you should look for from a functional perspective? What kind of things should be included in a JavaScript library? Does that make sense?

John:At the very core there should be a set of features. Of the libraries that I listed previously they all have methods for doing DOM traversal, so traversing through an HTML document, modifying an HTML document, events, so handling user interaction, animations and AJAX. All of them have some support for that to one degree or another. You can be fairly safe in knowing that if you pick a library you will have that base level. In my opinion those sets of features are probably the most important features and the ones that you end up using the most with your applications. Some people might say in their particular case that maybe animations aren’t as important, or maybe that they aren’t using AJAX, it really depends but for most of the time that set of features is fairly comprehensive. On top of that you really have to start to, once you’ve tried to use it, and once you’ve played around, there’s a whole set of secondary features that you kind of have to dig into, ones that aren’t immediately code-related. Things like the community around a library, the documentation for a library and even the health of the projects themselves.

Paul:What do you mean by that last one, the health of a project?

John:There’s a lot of things. In health, do they have an active development team? Are there developers? Are there multiple developers? It’s the famous hit by a bus; if a developer is hit by a bus will the project still continue? Is there a team will continue? Can you view the source code? Is there a repository where you can go? Is there a bug tracker where you can submit bugs? And finally is there a test suite, is what you’re going to be using going to be tested and analyzed to make sure it stays working. Another point that’s important to bring up is that a lot of browsers now are starting to integrate the test suites of these libraries into their test suite. So for example actually this is a lot of my work at Mozilla, was integrating the test suites of Prototype, Scriptaculous, jQuery, MochiKit, a bunch of libraries into our test suite such that if we ever added a change that caused a regression to happen in a library we would catch it and we would fix it on our end. Obviously we would do this in a very smart way, we wouldn’t just blindly be like, “Oh something broke!” We would communicate to the library what the issue was or whatever and this has been very big because now you can, there’s an extra level of safety and security here, in that you’ll know that if you’re using a library like this that it’s going to continue to work going forward in these browsers. That’s an extra level of safety that your personal code can’t provide. I think that’s very interesting. I want to jump back here really quick to the other issues I mentioned.

Paul:Sorry, I distracted you there and we took you off topic.

John:It’s OK, it’s OK, of community and documentation. So community, it can be usually be pretty easy to determine the health of the community. All these libraries will have some sort of a mailing list or a forum that you can go to. Just hopping on there, seeing how many messages are posted, seeing what the typical response is like, how they treat new users, just stuff like that it can be really useful because if you’re just starting out, you know you’re going to have some pretty basic questions. Do they understand your problems? Do they help you out? Doing some searches on Google for example to see how many people are talking about it, or using a service like Technorati or something. Are people blogging about it? Is it positive? Are they having problems? The other thing is documentation. This is also pretty easy to tell. If you are starting out with a library, you’re probably going to start out by doing a quick test, running a simple application just to get a feel for it. When you’re doing that you’re immediately going to be in the documentation trying to figure out how things work. I think you’ll be able to determine pretty quickly if the documentation quality meets a standard that you, because if you aren’t, if the documentation just isn’t that good, you’ll immediately have problems and I guess you will have to resort to the mailing list or the forums or whatever. Secondary is, do they have good examples? Do they have books if you want to learn from a book? Do they have books that you can buy to learn from? So again there’s a whole lot of issues here but what a lot of it boils down to is looking at the libraries, looking at their style of code, does it seem alright with you? Then just doing a quick test with each of the libraries that you’ve picked out, building like a menu or just a basic form of interaction. How easy is it? How hard is it? Does it in fact mesh with you well? This is something you can do over the course of a single day and it definitely shouldn’t take you any longer th
an that. If it’s taking longer than that then you probably want to try a different library. Ultimately you should be trying to use these libraries to make your development simpler and easier. If it doesn’t improve your productivity, if it doesn’t improve the quality of your code then you probably shouldn’t be using it to begin with.

Paul:Tell us a little bit about the kind of plug-in architectures that exists around many JavaScript libraries. Certainly I know there’s a strong plug-in architecture with jQuery. Does the same kind of thing exist with other libraries?

John:It depends. What jQuery has is a little bit unique in that we provide a number of plug-in points that plug-ins can snap into and extend how jQuery works. So they can add in new CSS selector behavior, or they can add in new events or all sorts of intricate additions. Other libraries have things that aren’t quite of the same vane, in that they’ll have modules or packages that you can use. Also another thing that varies is how do the various projects treat these plug-ins? At least with jQuery there’s a dedicated plug-in repository that’s used that plug-ins are listed in that you can browse through, you can see ratings, comments, discussions and things like that. Currently no other framework has something similar to that to the best of my knowledge. It’s much looser, just people uploading, putting things to their websites or Google code or some such. So again, at least to me, what makes plug-ins, jQuery-style plug-ins important is that they are, that there’s extension points and that they are supported by jQuery fully.

Paul: The only thing that I think that I kind of struggle with a little bit about plug-ins, you know I love the idea that there are other people out there that can do the hard work for me in that they can develop something I was looking for, and I love the fact that I can go to jQuery, I can type in whatever I’m looking for and it will pull back stuff. I’m always a bit unsure mind about how reliable those plug-ins are, you know as you’ve been saying with the kind of, the core jQuery library that you’ve created I know there’s a big team of developers working on it, I know that it’s thoroughly tested, I know what browsers it’s tested against, all of that kind of stuff. Plug-ins are a bit more of an unknown entity. Is there any kind of advice that you can provide about judging whether a plug-in or module or whatever is reliable or not?

John:I mean you sort of have to use the same standards that you would use in looking at a library. Looking at, what you mentioned, is it tested? Is there good documentation? Are there, how many developers are working on it? Like for example in the jQuery project we started a sort of, sub-project called jQuery Glide in which we’ve taken a whole bunch of plug-ins and actually blessed them and proved them, given them themes, excellent documentation, examples, all this stuff and made them sort of official. We’re doing this more and more, trying to bring in more plug-ins, improve their quality and make sure that they’re up to our standards. There’s still tons and tons of plug-ins that are just excellent, but the issue comes down to that you have to sort of train your eye to look at, and be able to spot when something has good quality. The thing that’s easiest for a plug-in author or a library author to do is to just set up a page that has their code on it and has a basic example. At the very least every single library is going to have that. If you dig in and see that it has documentation, that it has tests, you begin to realize that that plug-in is a much higher quality, at the very least. I think it’s really starting to dig in to these side issues, that you begin to get a better picture of how, of the true nature and of the true health of a particular library.

Paul:Excellent! That’s really useful and I think it’s easy to just look at these libraries and indeed the plug-ins as well and ask, “Well do they have the basic functionality that I require?” But, like you say, looking at things like the community and documentation and things like that are equally important. It’s been very useful John. Thank you for taking the time to come on the show. No doubt we will get you back in the future to talk about some of the specific things going on with jQuery and maybe this book that you’re writing as well, sounds very good. Thanks for your time.

John:Thanks for having me, Thank you.

Thanks to Todd Dietrich for transcribing this interview.

Back to top

Listeners feedback:

Quality or Quickly?

What is more important, to reach market quickly or to launch with a quality product?

I received this question from Pete in South Africa…

I have been working on a small web application, which I hope to launch soon. My problem is that I am spending ages tweaking and improving it before launch. I fear that if I spend much longer on it somebody will beat me to market. What is more important, getting the product right or launching it quickly?

It is a good question and one with no single answer. It is certainly something we have been struggling with as we prepare to launch GetSignOff.

To read the rest of this blog click here.

Back to top

Too many content management systems

I know we live in a capitalist society. I know we are supposed to believe in choice. However, there are just too many damn content management systems. Another extract from the Website Owners Manual

Let’s face it, most content management systems look the same there days. They all offer very similar functionality. After all, most people want similar things. Once you have narrowed the field by price it can be hard to make the final decision.

However, functionality and price should not be the only criteria by which you make your judgement. There are a number of additional issues which need considering. In many ways these are just as important.

These include:

  • Licensing
  • The development team
  • Security
  • Accessibility and code quality
  • Documentation and training
  • Support
  • Community

We should begin by looking at the subject of licensing.

Licensing

Examine in detail the license attached to your choice of cms. It is not uncommon to find licenses that state you can make no change to the source code or use a alternative developer.

You may also find that licensing is per site or worse still per user. This can become very expensive if you want to setup multiple sites or have a large number of content contributors.

Ideally you want an agreement that allows unlimited use of the cms with the exception of reselling.

The development team

Look carefully at the development team behind any cms you are considering. For example is it an open source project with a community of developers or the product of a single company?

Neither approach is wrong. However you need to be confident in the long term health of the product.

Open source projects can be highly productive despite often being created by volunteers. That said, they can die off quickly if a more attractive project comes along. If you are considering an open source solution look at the age of the product. Mature products are more likely to remain supported in the long term.

With a commercial product you need to be confident in the long term viability of that company. Consider requesting a copy of their accounts to confirm their financial stability.

In both cases look for a team that are regularly releasing updates to their system. This is particularly important from a security perspective.

Security

Security is an important issue for any content management system. If your site is hacked you could loose content and find yourself in litigation if hackers get hold of your users personal data.

Judging the security of a content management system is not easy unless you have technical expertise. If unsure, get an experts opinion. However at the very least you can do a google search on the name of the cms and ‘security issues’. If you see lots of results then you will definitely want an expert opinion.

Accessibility and code quality is another important, and yet hard to judge, issue.

Accessibility and code quality

As we established in chapter 7 it is important to build using the latest best practice. This ensures your site is accessible and provides the flexibility to adapt over time.

Judging whether a content management system uses best practice is difficult if you are not a web designer. However, talk to the cms developers about their approach to accessibility. Equipped with the knowledge from chapter 7, you should be able to get an indication of their competency.

One aspect of best practice we have yet to discuss are webpage addresses. For a long time content management systems produced addresses that were hard to read. For example:

http://www.boagworld.com/index.php?sourceid=navclient&q=4

However, more recently content management developers have realized this is hard to read and damaging to search engines placement. Therefore modern content management systems produce addresses that look more like this:

http://boagworld.com/technology/friendly_urls/

This is a huge step forward and also allows the web address to be used as a navigational tool. Users can identify where they are in the site and even edit the url to find different pages. For example if the above address is shortened to:

http://boagworld.com/technology/

it will return all pages within the technology section.

Whenever possible look for systems that support friendly urls. They are a good feature to have and provide an indication of how up-to-date the practices of the developers are. If a cms supports friendly urls they probably support accessibility and standards too.

Additional information on best practice should also be made available through the documentation that supports the cms. This too is an important differentiating factor.

Documentation and training

Good documentation is a crucial component of any cms. As I have already said, content providers may not be using the system on a daily basis. They can easily forget how it works. Documentation should therefore be comprehensive and easy to use. Some content management systems also provide walkthroughs and video tutorials. These also help users understand how the system operates.

There should also be documentation for developers too. This will enable your web team to adapt the cms to better suit your needs. Without this it can be nearly impossible to work out how the cms works.

Alongside documentation, training is another useful resource. This is important for content providers who need more than a manual before they start using the system. Training provides them with hands on experience and the opportunity to ask questions.

No matter how good the cms and supporting documentation, there are occasions when you will require additional support.

Support

You need to ask some hard questions about support. What happens if you identify a bug in the content management system? Will you be required to pay for the fix? How fast can you expect a response? Do you require 24/7 support?

You need to know your requirements and have a good understanding of what the cms provider can offer.

Beyond fixes, there are broader questions about help. If you have a problem with the system is there somebody you can turn to for advice. Do you have to pay for this support and when is this support available?

Of course not all content management systems come with support. It is unusual for anything but enterprise level systems to offer this option. If it is not available you need to look at whether the system has a vibrant community.

Community

The community is made up of other individuals who use the cms. They share advice and experiences via forums, mailing lists and support sites. Such communities are particularly important for open source content management systems because these products rarely offer formal support and training. However, many commercial products also have excellent online communities.

A good community will be able to answer questions, offer support and even make available a range of plugins that can be used with your cms. Before investing in a cms ensure it has a vibrant community. Visit the support site and look at how many users are registered and how often they post. Examine the kind of topics people are discussing and particularly how supportive they are to new users. It is not unusual to find apparently vibrant communities that are hostile to new users asking ‘dumb questions.’

For more from the Website Owners Manual and early access to chapters as they are written go to the books website.

124. HTML 5

In this weeks show we explore how to create better online surveys and Lachlan Hunt joins us to discuss HTML5

Download this show.

Launch our podcast player

Watch the behind the scenes video (Part 1)

Watch the behind the scenes video (Part 2)

News and events

Removing Microformats

The story that has generated the most email this week is the BBC announcement that they will be dropping the hCalendar Microformat. This decisions comes because of long standing accessibility concerns over the machine readable content within that particular Microformat. The problem is that code meant to be used programatically is potentially read out to screen reader users and displayed as meaningless tooltips to sighted users.

The decision of the BBC to adopt Microformats was a huge boost to the movement. Equally the rejection the hCalendar is a blow. However, it is important not to get this out of proportion. Remember, they are only rejecting a single Microformat not the whole approach.

The other thing to consider is that the BBC is a public service organisation with an incredibly high obligation to ensure maximum accessibility. In many ways they are in a unique position. Although it maybe appropriate for your organisation to pull hCalendars too, it should not be based on the decision of the BBC.

My advice is as follows. If you already have hCalendar information on your site I would probably leave it (dependant on your exact circumstances). The Microformat community is working on a solution and I would implement that rather than removing hCalendar entirely. If however, you are not yet using hCalendar then I suggest you hold off until an updated specification is released.

Becoming employable

In the past we have spoken about becoming a professional web designer. I know that many people who listen to this show or read the blog are students. You are concerned that the skills you are being taught are out of date and will not improve your employment prospects. How then do you become a more employable web designer? What skills do you actually require?

Andy Rutledge tackles this subject in his post "the employable web designer". Without a doubt it is the best post I have read on the subject of web design career development. I highly recommend you read it.

The thing that impresses me is that it looks beyond the obvious design and technical skills required to be a web designer. It also tackles the business and communication skills too. He really drives home quite how wide an understand a good web designer has to have.

My only criticism is that it could feel demoralising. You may read the list and think it is an unachievable aim. However, I don’t think that is the case. What Andy outlines is the optimal requirement of a web designer, rather than what is needed to get your first step on the ladder. I certainly did not have all of the attributes listed when I started.

All we need now is a second post telling us how to gain the skills he lists.

Better CSS font stacks

David (a boagworld listener) sent in the next story. It covers a subject that I am currently still grappling with. It is a post about CSS font stacks.

If you code in CSS you already know about font stacks. It is where you specify the fonts you wish to use. You can say for instance; use Helvetica and if that isn’t available use Arial. If that fails use a generic san-serif font.

For many of us that is as far as our thinking goes. The majority of us use very basic font stacks that are uninspiring to the point of being insipid.

I love this post because it lays out a very clear methodology for improving your font stacks. It also goes on to provide an impressive selection of font stacks organised into heading and body fonts, allowing you to instantly improve your site

If your site is looking tired and boring, but you don’t have the time to redesign, consider adding a new font stack. Such a simple change could make a real difference.

Do flexible layouts still matter?

Our last story of the day is a post from Smashing Magazine entitled Flexible Layouts: Challenge For The Future. To be honest I was ensure whether to include this post or not. On one hand it covers an issue many people have been asking me about. On the other, its arguments seem stretched and the whole thing ends with an advert for a CSS framework.

The article tackles zooming and fluid design. The new generation of web browsers – Firefox 3, Opera 9.5 and Internet Explorer 7 – provide full screen zooming. This gives users has the ability to enlarge the whole interface, not just text. Some are arguing that this is the end of fluid layout because zooming tackles many of the accessibility concerns associated with fixed width sites. However, this article strongly disagrees.

The author argues that flexible designs are better for mobile devices, that pixels are becoming less important and that the user shouldn’t be required to customise a site to their needs (it should be done automatically). Although his arguments are weak at times and he uses some fairly dodgy comparisons I do generally agree with him. I see no reason to think fluid design will go away anytime soon.

That said, I am in no doubt that page zoom does reduce the number of occasions fluid sites are necessary. Ultimately there is no right or wrong answer. It is entirely based on the situation. For example Boagworld, Headscape and The Website Owners Manual all use fixed designs. However, many of my client websites do not. That decision is based on numerous factors such as device, user base and business priorities.

Back to top

Feature: Creating a Better Survey

The web allows us to interact with our customers more than any other medium. One of the tools in our arsenal is the online survey. However, these are often badly implemented. In this weeks feature we find out how we make your surveys more effective?

Back to top

Interview: Lachlan Hunt on HTML 5

Paul: Joining me today is Lachlan Hunt; It’s good to have you on the show

Lachlan: Thank You Very much

Paul: It’s great to have you here I really appreciate you taking the time to join us, now the reason that we asked Lachlan on the show is because he posted a brilliant article on the A List Apart site about the subject of HTML 5 and I have been keen to look at this subject for a while partly because of my own ignorance to be honest, um, so lets kinda kick off by if you could perhaps tell us a little bit about where HTML 5 is at the moment I know that kinda getting a language to a release like this finalized is a massive process so can you tell us where we are at in that process.

Lachlan: OK, it’s, um, a really an ongoing process with browsers implementing different parts of it progressively so it’s not, you know, going to be all implemented at once and ready to go in one, er the next few browser implementations. We have some features implemented already and shipping in browsers other features which are being worked on at the moment and other are planned for, but still a few years of yet. But it is gradually getting there. We are trying to focus on what authors really need, instead of trying to do it all at once

Paul:Ahh, okay so that a slightly different approach that we have seen in the past, the idea of an incremental roll out. So how does that work from the W3C’s point of view are they doing modular releases is that how it works

Lachlan: Um, at the moment no, but the way the spec is structured each part of the spec, what I am trying to indicate is the stability of each section of the spec as we go along. SO thing like the Canvas API which has been in browsers for a few years now, it should be getting to IE very soon. That section is pretty stable, Other things for example "data grid" or a lot of the web forms are not widely implemented.

Paul: OK so that quite an interesting approach to the problem I guess from what you were saying earlier to me there is a community base element people can get involved and contribute. How is that all working then?

Lachlan: Well we’ve got a REALLY REALLY open mailing list on whatwg.org anyone can subscribe at the moment there wa about 800 subscribers on that list anyone is free to subscribe and post feedback about the spec if they want to, but that’s not for everyone obviously because it’s quite a high volume mailing list and not everyone can keep up with that. We have also got an open blog on http://blog.whatwg.org/ where absolute anyone who wants to can write an article submit it and have it published. Anything to do with what the WHATWG are about, HTML5 and anything related to it at all. It’s also a good way to let the community know what’s going on by publishing articles also to find out what people think because they keep posting comments on there as well. We have also got an open forum which is at http://forums.whatwg.org/ again anyone can subscribe to that, am sue you know how a forum works

Paul: So there are lots of different ways to be involved, I have to confess things like that can feel quite intimidating to get involved in. You’re kinda worried about putting your foot in it, and saying something really dumb, is there kind of Opportunities to lurk and are people fairly friendly over there? I guess you are going to say yes aren’t you

Lachlan: Yeah everyone is friendly over there,they are nice sort of area to go to aim at web developers and people who aren’t quite as technical with the spec areas and stuff. You can ask any question you want and just learn whatever you want as well. Their is also the w3c side of it as well. Which is strictly related but is more focused on the actual technical side and issues so yeah. The What WG and the W3C are both publishing exactly the same spec and they both work on it together and feedback can be sent to either place, it will all be taken into account

Paul: Oooh, that’s useful. So looking at kinda the state of affairs at the moment with HTML 5, reading through your article there was some things in there that really sounded quite exciting, there was this thing about structure and some kind of additional elements that could be used, which provide a little bit more structure, headers and footers and things like that can you tell us a little about that, and maybe explain a bit of what those do.

Lachlan: Well at the beginning of the work back in 2004 / 2005 we basically took a look at what a lot of site where doing and we noticed that they were all using a similar structure. All the blog’s were using headers and footer and generally things like column layouts to show articles and stuff like that. So we wanted some semantic elements to come and cover each of those features that people actually used, solving the real problems that they were actually focusing on. instead of having to do "Div" elements for everything, which is what people do we give them an actual element and that also has a side effect of increasing accessibility because an element with specific semantics can be hooked into the accessibility API’s and help someone with assistive technology navigate the document a bit easier.

Paul: Okay, because I mean reaction just glancing at it quickly and not thinking about it was what’s wrong with the div with an ID Equals footer, or an ID equal header or whatever but like you say, as you think about it more it become obvious that if those are considered distant elements, one person might call it a footer another might call it "the bottom" or whatever else if they have consistent semantic names then you know you can have screen readers and stuff jumping to the footer or avoiding / not reading the footer depending on what is set in their preferences, is that what you are thinking?

Lachlan: Yeah that sort of it, it’s also helping the authoring side too, as there are lots of Div elements in source code which makes it easier to read if you have got elements with different names

Paul: yeah very much so, I spend half my life trying to which closing Div relates to which elements, that very exciting. Obviously the other big area you talk about in your A List Apart article is the audio visual elements and there is a lot that’s happening in there. It’s always had the vague feeling that HTML has never had any kind of, erm, erm, the audio visual elements have always been and after thought, what happing in HTML 5 in regards to that?

Lachlan: Well we have added the video and audio elements to the spec to try and allow video to be added directly to HTML, at the moment we have sites like youtube revel and all the other video site out there using flash to embed video and using the flash to give customized controls and stuff to the user, it’s really awkward, depending on proprietor technology, so we want to open that up a bit give a very very easy to use Javascript API to hook into and promote custom controls and all sorts of cool stuff with videos and of course audio as well. We have got experimental implementations of that in opera and in webkit. I have heard mozilla is considering implementing it as as it is now I am not sure of the status of their implementation. However the one big problem with video and audio at the moment is with Codecs, there are a whole load of software patent issues going around and we are not quite sure what codec we are going to standardize upon or if we are going o be able to get common codec support among the browsers, That’s an open issue but I am no lawyer to I cannot really go into that, so the ultimate aim is that you will be able to embed your movie file, your avid file or whatever directly into the HTML without the need to kinda pump it through something like flash

Paul: cool

Lachlan: that make it a whole lot easier to the authors hopefully

Paul: Yeah, you kind of, to some extent got to ask the question why do we need that when we have got a solution like flash

Lachlan: Well because Flash is a proprietary technology it’s managed only buy Adobe , they control it, they control the changes and what does and what does not go into future versions of it, however the thing with HTML is that it is an open standard platform which can be implemented by anyone and maintain interoperability between those venders.

Paul: It’s intrusting isn’t it that adobe has just announced they are opening up the flash format, do you wonder if that’s a reaction to some of the stuff you have been doing to kind of force their hand if they want to stay ahead o the game and dominant they need to be open

Lachlan: Yeah I don’t know how that going to work though, it depends, if they open the format up and actually make it an open development process where anyone can contribute to the future version and features which go into it or whether they just write the specs and tell other people to implement based on what they write, so I don’t know much about that. It will be interesting to see how it goes.

Paul: Very interesting, Now the next thing you cover in the A List Apart article is something which you titled "Document Representation" now I have to confess this confused me, so do you want to explain a little about what you meant by document representation. What you were getting at there.

Lachlan: Yeah, well in the past we have had HTM, and XHTML with two separate specs, HTML 4.1 which a lot of people use and XHTML 1.0 which a whole lot of other people use one of them is based on XML and is really really strict syntax that requires well formedness and is supposed to when you serve it correctly, if you make a well formedness error the browser is suppose to stop processing and throw and error message saying "Sorry I cannot handle this" where as HTML is more sorta loose and convenient in its error handling, it’s the traditional inspired by SGML, although really only syntactically similar these day but the error handling is a bit more lenient and you can get away with making a lot more errors. So instead of having two distinct language which you can use we have combined them into a single language which share the same elements and attributes and everything and as much a possible and when the browser reads those file it produces and internal representation called the DOM, a lot of javascript user will be familiar with the DOM as they work with that with their scripts to modify the document through the DOM. That’s an internal representation which is mapped, the DOM which is sort of mapped to by the syntax’s, the HTML and the XHTML syntax’s so it give the authors a choice of which syntax they want to use

Paul: So why do we need that choice what is the key difference, I mean you talk about HTML being more lenient are there other reason for choosing one over the other.

Lachlan: erm, well I don’t really know. However a lot of authors do prefer the strict syntax of XHTML like to make sure they quote the attributes and encode all their ampersands properly. They like to know they have done everything perfectly as with HTML a lot of people do make mistakes inadvertently and don’t want end users to see big error messages, so it’s a bit more user friendly if some little small error slips though their CMS and causes problems.

Paul: So it’s basically come down to personal preference then

Lachlan: yeah

Paul: Okay, that’s fair enough, so both, we are going to see equal support for both of them in browser manufacturers are we

Lachlan: Well that’s the hope we have said that we have got good support in most browsers, it’s just IE which is lagging behind

Paul: (Sarcasm) Oh that’s a suprise (Laughs) Okay are there ant other things in HTML 5 that might be of interest to those listening to the show which we should be paying attention to?

Lachlan: erm, well, as I said before we got canvas implemented in most browsers

Paul: So tell us, what’s canvas

Lachlan: It’s a 2D drawing API that you can use javascript to draw dynamic image with. People have used it to implement things like graphs that are built using tables of data which are on the page. People have also gone and done 3D games with it which is really cool

Paul: Wow, that incredible. I mean that sounds very similar to SVG is it a different thing.

Lachlan: It is different SVG is entirely done with XML, you modify that with script via the DOM by changing elements and attributes and stuff or with CSS. Canvas is an immediate mode graphics API where it is more like a bitmap sort of thing where as SVG is vector graphics, and canvas is bit map. They can both do images, the same sort of images, if you like but we have both vector images and bitmap images, so they both can serve different purposes.

Paul: Right, I see. Okay that’s good, so okay the big question, kind of the final question everyone is going to have is when can they start doing some of the cool stuff. Now you said right at the beginning this is going to be modular support based thing so we are going to be able to see some of these elements before others. You know some parts before other, so what can we do now, what are we going to be able to do soon give us an idea of where things are at.

Lachlan: erm, okay let’s see I think what’s being implemented at the moment. Cross document messaging is being implemented at the moment, that’s an API that lets you send message between documents with javascript without worrying about cross domain security issues,

Paul: Oooo…. that’s good.

Lachlan: Yeah it’s a really, really handy API that been implemented in opera for a while and I heard mozilla is implementing it soonish and should be in firefox 3 thought I am not entirely sure about that. That should be very very soon, erm, what else have we got, we got…. hmmm, this is tough

Paul: Sorry put you on the spot there (laughs) is that last one supported in webkit?

Lachlan: erm, I am not sure I would have to double cheek that

Paul: Okay that’s fair enough

Lachlan: yeah,

Paul: Okay so any other elements? Things like the structural changes are any of those being supported yet?

Lachlan: Not quite yet, erm as far as I know support for those requires changed to the phaser, and to implment the new pharsing algorithm in HTML 5, as far as I know browsers are not yet focusing on doing that because..

Paul: Okay that’s a shame, because that one I liked the sound of, what about the audio and the visual stuff?

Lachlan: We have experimental implementations in opera which supports OGG video, though it’s not really in a public build version yet, there is a experimental version which was released last year sometime. And webkit also has support in their nightly builds, which supports mpeg 4 unfortunate they don’t support the same codec but you can experiment with them.

Paul: (laughs) That would be far to easy

Lachlan: yes I know

Paul: So it’s all progressing slowly but, erm you know obviously the one name which has been very absent in the list you keep mentioning is Internet Explorer, so I expect we can probably see some slower movement there. We are talking you know in the years before this all becomes mainstream and we can actually start using it. Is that a fair comment to make?

Lachlan: Yes it will be several years before the entire spec is finished, we are hoping that it can get finished sooner rather than later but realistically it’s going to be quite a while yet, But it is important to know people will be able to use theses features before the spec is finished; so it depends on when browsers start supporting features authors can go ahead and use it.

Paul: That’s great and real exciting that you can start to do that sort of stuff. you know that we don’t need to wait for it all to be set in stone before moving forward. And it’s always exciting as well to see the future, know what coming up and be aware of everything. so is there somewhere people can go a websites address and keep an eye on what is currently supported by browsers.

Lachlan: Not at the moment but that’s something worth looking into, I think there is a wiki on the Working Group site, it does have some implementations listed but I am not sure how up to date. But it’s something I think we should look into

Paul: Yeah it would be great to have some kind of single page which says what features are supported by each browser that you could check back every few months see what’s going, there you go there is my contribution to the working group (laughs). Alright it was really good to speak to you and thank you so much for your time, What we will do is to get you back in further down the line and have a check to see where we have currently got to in the development of HTML 5, Thank you so much for your time.

Thanks to Jamie Knight for transcribing this interview.

Back to top

Listeners feedback:

Staying healthy on the web

Evan writes: My question to you is not entirely related to design, development or management but rather about health in the web industry. This is very important but we often seem to forget about it. We spend hours upon hours at our desks but are unaware of the damage this could be having on our health. Eyeballs almost touching the screen, typing without a break, sitting incorrectly – just a few examples. So, what do you do to maintain good health while working?

I am possibly the worst person in the world to answer this question. I consistently abuse my body while at work. In fact a physiotherapist friend said I had the worse posture in front of a computer she had ever encountered.

However, there is possibly something to learn from my terrible example. Let’s look at what I do and compare that to best practice.

  • I sit with my leg tucked up under me – Posture while working is important. Both feet should be flat on the floor, rest your wrists on the desktop in front of your keyboard and make sure your monitor is at eye level (in other words avoid laptop screens).
  • I stoically refuse to use anything other than my preferred mouse and keyboard – Using the same keyboard and mouse in the same position day after day can cause damage. Try using a variety of different hardware and positions. Push your mouse and keyboard nearer or further from you to change the position of your arms.
  • I believe that an individual pixel should fill my field of view - Leaning too close to your monitor is a particular weakness of designers who want to position that pixel ‘just so’. This not only damages your eyes but also your back. When you learn forward your neck and back support the weight of your head. When sat upright, the head is supported by a straight spine and therefore your chair bears the weight.

On the upside I do take regular breaks. I would like to claim this is because of my health. However, I think it has more to do with my short attention span. I get easily distracted and wander off to do something more interesting.

From Photoshop to HTML

I see a lot of PSD 2 HTML services on the internet but never tried any out. It seems to be an great option for an designer for making an quick website, to edit later myself.

What is the opinion of you guys? Love to hear you discuss this topic in one the next podcasts.

An long time listener from Holland.

I have to confess to being a snob over these services. Until recently I have always doubted the quality of the code but after seeing some recent examples I have begun to change my mind.

We are even considering giving them a try at Headscape, just to see what happens. Certainly from an economic point of view they make sense especially if you have more work than you can handle. That said, I do have three concerns.

First, results may vary. Without a personal recommendation it could be hard to find a provider who can produce the quality you require. Anybody can convert a photoshop document into HTML. However, it is much harder to do so using techniques like microformats, semantic markup and accessibility. Also, just because the quality was good once, does not mean it will be so again. As the good providers get busy it can lead to a decline in quality.

Second, people code in different ways. Unless careful attention is given to commenting, it is hard to pick up somebody elses markup. This is fine for relatively static sites where only small changes are required. However for projects where change happens regularly as the site evolves, it is more important that the markup is tailored to your style of coding.

My final concern is that this could lead to designers not learning HTML. As I have said before on the show, I believe all designers should be able to code themselves. You need to understand how the web works and markup is apart of that. Also, if you cannot code how can you judge the quality of the markup you receive?

Back to top

110. The mighty Meyer

On Show 110: Eric Meyer on version targeting, the business benefits of usability testing and do I have to have a blog?

Play

Download this show.

Launch our podcast player

News and events | The profit and loss of usability | Eric Meyer on version targeting | Listener emails

News and events

Before we kick off the news section today I should point out that I actually link to many more articles, tutorials and news stories than I ever include on the show. If you go to boagworld and click the links in the header you can receive all of these posts by either email or RSS.

CSS reference library

Raise your hands if you have ever used the W3 School. Okay put your hand down now because you are looking kind of stupid. For those of you who didn’t raise your hands the W3 School is a comprehensive reference sources for almost every web language around. It really is very impressive.

The problem is that it doesn’t provide the nicest user experience. If you are looking for CSS reference information then a possible alternative is the new Sitepoint reference section. At the moment it only includes information on CSS however they are obviously looking to expand.

Its design is a lot more attractive than W3 School and although it is not as comprehensive it will provide you with all the latest information on CSS properties including CSS 3. It also provides you with an indication of which browsers support that property.

Stay on :target

Talking of CSS 3 there is an interesting article by Brian Suda over at Think Vitamin entitled Stay on :target. Target is a new CSS pseudo-class being introduced in CSS 3. Although it has yet to be implemented by Internet Explorer it is supported by many other browsers.

Essentially what target does is allow you to style a target element in much the same way you can style on hover. So when you click on a link that goes to a fragment identifier (what used to be called anchor links) then it styles that fragment.

So for example a good use of this attribute would be to highlight the content that you have just been jumped to (like the fade to yellow technique) or to hide and show content when the user clicks on a tab.

Of course many of you might be asking why I bring this up when it isn’t supported in IE. Well, not only is it an interesting glimpse into what is to come, it can also be used right now when the functionality provided isn’t crucial. For example you wouldn’t want it to hide and show content but it might be okay to highlight linked content with it.

Read the article and you can see the potential yourself.

Search behaviour patterns

Another article worth reading is Search behaviour principles over at Boxes and Arrows. This article looks at how people search and the different types of searchers there are. It also looks at what things affect the way people search and techniques that can be used to accommodate their approaches.

As I have said before on this show, not enough attention is given to search and this article will really get you thinking about how to better accommodate it. Best of all there are still a lot of hints that can be applied here even if you are lumbered with an inflexible search mechanism that cannot be customised or tweaked.

10 principles of effective web design

Talking of search usability brings us nicely on to our final story of the day which is a post from Smashing magazine. We haven’t mentioned them in a while but this week they are back with another top ten list. This time it is the 10 principles of effective web design.

Personally I think it is a misleading title as actually the post is about basic usability techniques. That said, it is a very good list and contains some really solid advice. It also contains lots of examples which really helps you get your head around the issues.

I don’t think the post has a lot to offer seasoned usability testers but if you have always avoided the subject in the past then this is a nice simple starting point.

Back to top

Feature: The profit and loss of usability

We have looked at the subject of usability testing relatively recently on the show and have mentioned it countless times before. However, never have we taken a step back and asked the fundamental question: why is usability testing important? This week we look at how usability testing can be presented to clients and dispel some of the misconceptions about it.

For more detail on what we cover read my post The profit and loss of usability.

Back to top

Expert interview: Eric Meyer on version targeting

Paul: So on last weeks show we discussed Internet Explorer 8 and some of the plans Microsoft have for it and joining me this week is Eric Meyer. Hello Eric, good to have you on the show.

Eric: Cheers, hello.

Paul: Cheers, very British of you.

Eric: I try to localise my content.

Paul: Yes, very good. Most impressed! We’ve got Eric on the show really because this whole news surrounding Microsoft and what they were planning to do was broken on the A List Apart website, in 2 articles, one of which Eric wrote. The reason I think I wanted to get you on the show to talk about it is because I was kind of struck by the honesty of your article that a lot of what you were saying was very much ‘I really don’t want to like this idea but…’ kind of attitude. Which is the kind of attitude that I think goes down well with the people that listen to this show. So I was wondering Eric, could you kick off by giving a brief explanation of what it is that Microsoft are proposing doing, just so that we’ve got a bit of an understanding of it?

Eric: Um, well pretty much what they’re proposing is that Internet Explorer, Internet Explorer 8, and in the future will recognise a single element, a meta tag which can be used to say ‘This is the version of Internet Explorer that I want you to act like’ so that Internet Explorer 11 can act like Internet Explorer 8 did, or Internet Explorer 7.

Paul: Right.

Eric: So the idea basically is well they call it Version Targeting so that you can have your page actually targeted to a certain version of Internet Explorer even if newer versions have come out.

Paul: Ok. So, I mean at face value that sounds very much like browser sniffing, which is obviously something that has kind of become considered bad practice. How does it differ?

Eric: Well my perspective is that it differs because it actually reverses the direction of sniffing. Browser sniffing To date it has been a case of authors trying to figure out what browsers they want to sniff for and what should happen as a result. This was sort of the reverse side of. It would be the browser sniffing the page to say, ‘What do you want me to do?’, at least in the case of Internet Explorer. It should be clear that Microsoft has so far as I am aware anyway not proposed that anyone else has to do this, or that this has become any part of any sort of standard. They’re saying if it is what we want. This is what we’re planning to do on the browser. So they have the same echoes. I really feel like they are not the same thing. There are a lot of people who disagree with me but they are really very different because one of the reasons that browser sniffing by authors has become viewed as a bad practice is because it becomes fragile over time. First of all there’s a case of people saying ‘If this is Internet Explorer do such and so’, and they don’t consider that there might be a version this version of Internet Explorer that might change what I’m trying to work around. Another reason is that people make guesses about what will be in user agent strings which is usually what people browser sniff on and sometimes those guesses turn out to be wrong as when Safari first came out its user agent strings had the phrase White Gecko in parenthesis.

Paul: Yeah.

Eric: A lot of people had done browser sniffing scripts that looked for the word Gecko so all of the scripts thought that Safari was Mozilla, Firefox or whatever and so some of them broke. In a way it is hard to fault the authors because how are they supposed to know a browser from Apple, not based on Gecko, would have the word Gecko on it’s user agent string and yet that happened so this would be much more controlled it seems to me were it would be browser saying ‘What do you want me to act like?’ and that’s the other reason this has varied from browser sniffing usually tries to predict the future, whereas this version targeting that looks like it will happen in Internet Explorer it actually has to predict the past which is inherently easier to do.

Paul: Why has Microsoft decided to take this position? It seems to me like in some ways they’ve created a rod for their own back in the sense that they are producing I don’t know, Internet Explorer 11 and in that has got to be the rendering engine for 10, 9, 8, 7 and all the way back. Is that not just a lot of work on their part? What’s driving them in this direction?

Eric: I think it will be a lot of work on their part. I do not believe that the idea is to have completely separate rendering engines for each of those browsers, but to have effectively if then else statements in the rendering engine or cases or switch statements for a little more program language savvy. The reason that they’re doing this is that they really have a problem, well they have a dilemma, and they need to get out of the dilemma. The dilemma that they face is basically this: There are a lot of pages out there both on the public web and in private intranets that were developed to IE6 or IE7 let’s say and weren’t developed in an open standards way they weren’t developed the way a lot of people in the standards movement develop sites which is to code to the standards and then figure out how to work around the problems that they encounter. If you have an intranet, a massive intranet site, and your company standard is IE7 the default tendency is to develop it to IE7, you use behaviours that are not correct according to the standard, but are the way that IE7 acts. You have all these past mistakes which every browser makes past mistakes. IE7 it can be argued has made more mistakes than others, not an argument I want to get into. They have that situation where there’s this large legacy of pages. So they can’t have those break for a number of reasons, many of them business reasons, actual monetary reasons but at the ground level you could look at it as if the browser changes enough that those pages start to break it becomes a bad browsing experience for users of that browser. At the same time, the Internet Explorer team would like very much to improve their standards support. They did this for IE7; they fixed a lot of things. They went more towards the updating the browser and didn’t worry quite as much about breaking sites, and they got into quite a lot of trouble over it both internally and externally. There were people who took on the task for breaking the web. We’ve been here before as an industry back in 2000. This is how DOCTYPE switching became to be because the first few iterations of IE and Netscape did very badly at CSS support. They tried and more power too them but Internet Explorer got the box model wrong. Netscape got so many things wrong that they had to junk it and start off with a new browser. So DOCTYPE switching was basically invented as a way of being able to say ‘Given these criteria render pages the way they used to be rendered and give them these other criteria go the more standard route’. From the Microsoft prospective this is like a super DOCTYPE switch except in this case instead of hinging it on a DOCTYPE they’re hinging it on information about what the browser version is.

Paul: Yeah. It is interesting when I first heard about this and I first read your article and the other one on A List Apart, my initial reaction was oh no all this feels wrong and indeed which is what in the sense you said that you went through when you were writing the article and then we actually were discussing it on last weeks show with John Oxton and John Hicks, the same kind of thing came out that we felt very uncomfortable with this and we were reflecting on a lot of things that were said including Jeremy Keith who made this point of you’re actually in a position where you’re actively having to tell Internet Explorer 8 how to behave like Internet Explorer 8 and not IE7, which seems a bizarre set of circumstances but since then I’ve been thinking about it a little and I’m struggling to come up with a reason that I really object to this beyond a principle of the thing that I feel like I shouldn’t agree with it but I’m having trouble articulating why I guess. What kind of things are you seeing? You must have seen a lot of objections come up when you are brave enough to step up and say what you did on A List Apart, I’m sure there was quite a backlash. What kind of things are people saying and throwing against this?

Eric: Well I can see quite a few objections.

Paul: *laughs*

Eric: Well one of them is an objection that Jeremy brought forth which I think I am glad that were talking about that which is that the default behaviour is to default to IE7 as I understand. So when IE8 comes out, if it doesn’t see this version target meta tag in a page it will assume that page is to be treated as IE7 would have treated it, which again completely reverses what were used to. What were used to is when a new browser comes out the page will be interpreted according to the latest and greatest unless you’re using a quirks mode DOCTYPE switch but anyway, it’s bizarre, and yet I did go through the same thing when I first saw it I was like &#”;What!&#”; *laughs*

Paul: Yeah.

Eric: Good old WTF basically.

Paul: *laughs*

Eric: And when I first saw this it was at the beginning of January when Aaron Gustafson submitted the first draft of his article, I hadn’t actually heard about this before then, and I started arguing with him about it in the A List Apart editing forum and very quickly came to realise, &#”;Why am I objecting to this?&#”; and I took the time to step back and say &#”;What’s the deal here?&#”; and that’s were my article came from with the two of us going back and for and it was like, could you write an article about that because that’s what a lot of people are going to go through. So there’s the default behaviour, you have to have the meta to have the latest and greatest, yeah, I would like to see that changed, I would like to have Internet Explorer act the way browsers always have because that’s what I’m used too, but at the same time I have to be realistic about the problems that they face, that I was explaining before.

Paul: Yeah, because that wouldn’t solve their fundamental problem which is that people that aren’t aware of working to the latest standards aren’t going to be aware that they have to put meta data in there pages either.

Eric: Right, so people have said that Microsoft, of anyone, are in a position to educate people who are not aware of the need to do that one thing and that’s the point I made when I was talking to a member of the IE team about this. There are other objects that I think mostly have been related to that for example Bruce Lawson posted just in the last few days, the default behaviour means that from an accessibility point of view any page that doesn’t have this meta tag is stuck with IE7′s accessibility support which apparently is not were it should be, so he’s made the point that freezing pages to IE7 in the absence of any other information freezes them in this inaccessible state, I’m not an accessibility expert so I don’t know how best to categories that but, will have accessibility problems and keep them for years and years as opposed to, ya know, as accessibility problems improve in Internet Explorer, getting those benefits and that a very real objection and a very real concern, and I think one that needs to be made to the Microsoft people because accessibility is very important. There are other objections from the javaScript community, it’s actually been interesting in the javaScript community, there’s been a real dichotomy, there have been some javaScript library authors who’s been like &#”;Yes! Finally, thank god somebody is talking about versioning!&#”; right, and there’ve been others who have been like &#”;Oh my god, are you kidding, libraries will have to support all these backwards engines&#”;.

Paul: Yeah.

Eric: Again, I’m not an expert to know what side of that certain dichotomy I would come down on, in my own blog posts I’m saying, wouldn’t you just use object detection and not worry about what the version number is?, but I guess that doesn’t fully address the problem, or at least that’s what I’ve been told. Again it’s something that needs to be figured out, because there have been some fantastic javaScript libraries and fantastic things that can be done with those and if this is a move that will hamper the growth of that field then that’s something else that would also bother me. There’s also the security objects, the idea that every backwards versions that you have your complicating your ability to keep your security holes closed, that’s the kind of thing we’re I have to say &#”;Look that’s down to the browser maker to figure out&#”;.

Paul: I guess that the problem with the whole default behaviour thing is how badly it’s going to break things, how many sites are going to be broken if the default behaviour was the latest browser and how badly are these sites going to be broken, are they going to be unusable? Are we talking about some small changes? I guess there are a lot of websites out there as well that just aren’t supported at all, content has been put online, nobody is checking them, nobody is checking when a new browser comes along, and if when IE8 was released and those websites became completely inaccessible and unusable then obviously there’s a big issue there because your loosing vast amounts of content on the web. I guess a lot of it is unknown entities at the moment isn’t it? It’s guess work.

Eric: Yeah. There’s a lot of guess work and that’s part of the problem, I think if we knew, if there were some kind of statistics, like if the IE team were to come out and said we built a version were the default behaviour was latest and we tested it against these 1000 QA sites and 20% of them broke, 5% were completely unusable, that would be one thing, or if they said we tested and 2 sites were broken, you could still read them but they look a little weird, that would be different and nobody does really know and at least nobody outside of Microsoft and maybe not even them, I don’t know if they’ve done that kind of testing yet. And, I’m sorry, there is one other objection that come from a couple of other browser manufacturers that this is in affect, anti-competitive, whether it’s meant to be or not, but it has that effect because Internet Explorer has such a large market share they have to worry about what it does and so to them it becomes a lot harder to do that, so if they are going to keep up this effort it’s going to become a lot harder to do in this version targeting world after a few releases, of course the question is whether they would need to do that or not and there’s a lot of debate about that, there are people who are like, &#”;Just stop, stop making reference to Internet Explorer and just let it strangle itself to death&#”;. I don’t want to get into all the back and forth that’s happened but that is another objection.

Paul: I guess, is there some danger here as well that once you’ve got this version targeting in place Microsoft could go off on some complete tangent and start introducing all kinds of proprietary functionality into their browser that isn’t supported in the other and we end up in a situation were we’re having browser wars again with different browsers implementing different proprietary tags and stuff like that, or are we truly beyond that do you think?

Eric: Umm, It is certainly a risk and how much of a risk influences were people stand on this. I don’t see that personally as being much of a risk, because yes, the Internet Explorer team could introduce a load of proprietary properties that let an author change the colour of the browser kernel right or replace the backwards and forwards buttons in the browser, whatever, and if nobody else supports that, I think those efforts will largely support them strangling themselves, I mean, colours scroll bars we don’t really hear about anymore, people will still do them, but nobody else really cares.

Paul: Yeah.

Eric: So, I would not claim to be smart enough to see everything that could possibly be done but I think in a lot of ways that might not be a bad thing, because it would let Microsoft experiment with less constraints, they can do initial implementation of things that are in CSS3 and if the behaviour of those things changes, in a later version they can fix what they did, they can change to match the spec, and then still have backwards compatibility for pages that took assumption of that, there are people that would say &#”;Well they should never implement anything that hasn’t been completely nailed down&#”;, but that doesn’t really work, because one of the ways that you get yourself out of the candidate recommendation stages at the W3C is to have implementations and the only way to have implementations is for someone to implement them and if they find out during that phase, and this is what the candidate phase is about, if they find out in that phase that such and such property that has been specified, doesn’t work in the real world for whatever reason, they’re then able to go back and change it, but in the mean time if your Internet Explorer and 11′ty billion pages have been implemented to your particular version of the property.

Paul: So, you wrote this A List Apart article that went out of the 21st of January, and we should probably say that we’re recording this interview on the 29th of January and it’s not going to go out for another week, so things might move on in-between but there’s obviously been a lot of discussion since you released that article, have your views really changed in any way, are you still in favour of this approach or have there been more concerns raised that have made you doubt it?

Eric: Hmm, I’m still in favour of the general idea, the implementation I’m a little less, I guess I would say I’m more agnostic about, but the general idea of backwards compatibility so as not to break sites, whilst still being able to change and improve and fix the browser I’m all in favour off. The default behaviour still bothers me, and I’m still having trouble working out if there is a case of honest to goodness technical reasons or it just feels wrong, there has to be something, how’s it’s gone about is a different question, if the IE team and the people that they have to answer to effectively can be convinced that having the default behaviour switched and then educating people whole want to freeze their sites, on how to freeze there sites using the meta, they can be convinced to do that and that that will fix the problems that they face then I’m all for it. Accessibility concerns do bother me and I think that that’s another argument in favour of switching the default behaviour but at the same time I also have to recognise that switching the default behaviour, as you said earlier, from a certain prospective, completely negates the entire reason to do this, given a certain set of circumstances if they’re going to switch the default behaviour it might almost as well not even do it. Again though that also depends on how much breakage on how many sites and what kind.

Paul: Yeah.

Eric: The other unknown that we’re facing here is we don’t yet know just how different the IE8 behaviours are compared to IE7, we have a clue in that we already know that there’s an internal build of IE8 that can support the ACID2 test, which they weren’t even really very close too, well I guess that depends on who you talk to, but they didn’t support it before so in or to support ACID2 they have to have things like generated content with CSS which we completely don’t have in IE7 they have to have fixed some of there parsing bugs and so on and so forth that hints at a very large change, an even bigger change than that between IE6 and IE7, but we don’t know at this stage, it could be, and this has been one of my objects to ACID2 or one of my discomforts with ACID2 over the years, it could be that they’ve just implemented exactly the things that were needed to ACID2 work and not more, which is the wrong way to go about supporting ACID2 and I don’t know that they’ve done that, but it’s possible. So I may be that it’s not such a huge change, but those things came about as sort of a broader push towards implementing more advanced selectors and fixing bugs and implementing area content and really pushing into the areas of CSS2 that they don’t support and the areas of advanced CSS modules that they don’t support yet, then that could be an enormous change and in that case there’s more chance of them breaking a ton of sites if they don’t have a mechanism like this in place to deal with them.

Paul: So I mean in some senses, after discussing this for however long we’ve been discussing it, there’s very little at this stage that we can really do about this, for the average web designer, Internet Explorer 8 isn’t going to be out in the immediate, one presumes and even when it does we’re talking about relatively minor changes that they’re going to have to make to their site, I guess the biggest immediate concern is maybe how you think about building sites at the moment, do you worry so much about things like progressive enhancement if maybe the way that Internet Explorer works in the future, I guess they’re still good principles.

Eric: Yes, absolutely they’re still good principles and that is how I have developed sites and will continue to develop sites and really I think what it comes down to here is who’s going to have to add the meta tag.

Paul: Yeah.

Eric: Is it going to be people who do forward development, ya know forward compatible development, is it going to be standards aware developers or is it going to be people who aren’t in that sort of craft. It’s not fair in a way, that the people who have been doing things in the right way will have to take that on, but on the other hand it could well if you look at the numbers, there are a lot less of us.

Paul: And in some ways we’re much more equipped to do it.

Eric: Right, to understand why it’s needed and how to do it the right way and when not to do it for that matter.

Paul: Yeah.

Eric: Because when you develop a site for someone and it seems like a one off and they really not going to be keeping it up, you might want to keep the meta tag off because you know that that will default to IE7 and that’s what you want or you might explicitly include it because you want it to default to IE7 and IE8 or ya know on my site if this happens I’ll probably use the edge keyword of IE equals 1024.

Paul: Yeah.

Eric: So I’ll always get the latest and greatest and so that’s for me personally, but for a client I would have a much harder time justifying that because clients don’t care if it’s forward compatible development or not they just care about whether their site works and will continue to work right and so the point has been made, as you did, that in a lot of ways people who are sort of more clued in are better equipped to take this on as opposed to somebody’s grandmother who uses Dreamweaver or whatever to put together a site for her poetry circle and this happens all the time, they don’t even look at the mark-up let alone would understand why this would need to be done why there would need to be some kind of meta tag, first you would need to explain the concept of tags etc, etc, etc.

Paul: I mean a lot of these people don’t even realise that there are multiple versions of a browser, or indeed that there are multiple browsers.

Eric: *laughs* And those are also issues that will need to be faced, somebody is going to have to do this. A lot of these advances that IE8 seems to have ready to go as indicated by passing the ACID2 test may well have to come back out.

Paul: Yeah.

Eric: You can always back changes out of a code base and that really seems to me to be the dilemma and I’ll want to say again, there are people who reject that as being the choice, there are people who feel very strongly that that isn’t in fact a choice, even if you except that’s a choice that they should keep the changes in but be willing to break sites because sites always have to be updated anyway and that’s how browsers have always done it, so there’s a large amount of history that says that can happen but browsers can still advance.

Paul: We will see won’t we, that’s what it boils down to. We will have to wait and see. Okay, Eric, thank you so much for coming on the show and talking that through, it’s an interesting area and I think it’s an area that will have significant impact on how things develop in the future, so it’s good to have your perspective on it. Thanks very much.

Eric: Paul, thanks for having me on, I really appreciate it.

Back to top

Listeners email:

Basic CMS options

As in last week’s show I so badly bastardised the name of our textmate reviewer, I decided it is only fair to allow him another go this week. He asks:

I have a friend who wants me to build a website that they can update. They don’t know how to write HTML or CSS. What is the best way to solve this problem?

The obvious solution is to use a content management system of some type. Indeed this is something we have covered before on the show back in show 24. If you were building a relatively big site that needs constant updating, then I would definitely encourage you to check out that episode. However if your needs are simpler a full blown CMS might be overkill. In such situations you should consider a simple blogging system like WordPress.

One final option maybe to use a tool like Contribute. That way you could build a nice simple static site but your friend would have a WYSIWYG tool to edit it.

The importance of blogs

Our second question is from Lauren:

My question is about starting a blog. Right now, my nights are filled with homework, but once I complete my program, I can truly dedicate my time to building my portfolio. Are blogs really that important now? I don’t know if I can come up with meaningful content to make my blog stand out. Does this mean that I won’t be able to find a good job in the industry without one?

You talk about a portfolio and blog as if they are separate things, but I would suggest they should be combined. As somebody who regularly hires web designers, I have to say I find portfolio websites frustrating. At worst they show me some pretty pictures, at best examples of fully functional websites. However, what they don’t tell me is the thought process behind the designs. Why did you choose the colors you did? Who is the target audience and how did this affect the design?

A blog can also be used as a portfolio but allows more depth into the designs you are presenting. Also, a blog allows you to link to other content on the web and express your views on that content. This shows me as a potential employer that you are well read and interested in what is out there.

As a student looking for your first job I wouldn’t expect your blog to include new CSS techniques or innovative approaches to user testing. However, I would like to see examples of work fully explained and evidence that you are reading other web design sites and have opinions on what you are reading.

Show 95: In honour of the the RAF

On this week’s show: Paul shares some techniques for selling your services through your online profile. Marcus discusses project time scales and Ben Hunt talks about marketing your web business.

Play

Download this show.

Launch our podcast player

News and events | Project time scales | Social networking for sales | Ben Hunt on marketing a web business

News and events

The Rissington Podcast

For over 2 years now we have been doing this podcast and in that entire time we have reigned supreme. There have been other web design podcasts but lets be frank they have been shit ;) Obviously out of politeness I have pretended they had their place but I think it was obvious to all that only boagworld was really worth listening to.

However, like all great empires sooner or later they crumble and fall to a new rising star and I fear that maybe true with Boagworld. There is a new kid on the block called the Rissington Podcast. Not only is it hosted by two web design guru’s in the form of John Oxton and Jon Hicks but it is also professionally put together and at times really funny.

This rambling, question based show shares some great advice on web design in an entertaining and friendly manner. Definitely check it out, we promise not to cry. After all, it is even more British than us!

Net Promoter Score

On last weeks .net magazine podcast we got talking about how to measure the improvements we make to the user experience in order to prove their value to a client. Peter Merholz from Adaptive Path mentioned something called the Net Promoter Score which I have confess I had never heard of.

Fortunately I wasn’t alone in my ignorance because Andy Budd had not come across the term either. However, unlike me he took the time do some research into the Net Promoter Score and post his findings online…

To calculate your Net Promoters Score, you ask your customers “how likely they would be to recommend you to a friend”, and get them to grade their answers on a scale of zero to ten. Zero would be extremely unlikely while ten would be highly likely. Those who answer nine or ten are considered promoters, and are the most likely people to evangelise your services. Those who answer between zero and six are considered detractors and are the type of people who will spread negative views about your services.

To work out your Net Promoters Score, you simply subtract the percentage of detractors from the percentage of promoters. A good score would be in the range of 50-80%, while an average score would be 5-10%. A poor score would be in the negatives…

Andy then goes on to explain how this basic question can be used to assess the value of your service. I can see why Peter brought this up on the show as it would seem an excellent way of assessing improvements made to the user experience. By testing before and after a site redesign it would be easy to measure improvements in the experience.

Try it on your next project.

15 Excellent Examples of Web Typography

This is a bit of a random news story but I really wanted to mention it. I am excited to see that the movement towards better typography on the web continues to build momentum and I am constantly amazed at just what is possible with a bit of determination.

Typography can me an incredibly powerful tool in our design arsenal, as I have no doubt said many times before. However, if you still need convincing then check out these 15 superb examples of web typography which I came across this week. There really is some inspiring stuff in here and it should be enough to get even the most jaded web designer playing with type again.

Social net offers new perspective

Talking of being inspired, my last news story of today is a post by Bill Thompson on the BBC technology site. I am not sure it is directly to do with web design but it certainly went a long way to re-energising me about the work I do on the web.

The article focuses on how the social side of the web is transforming not just the way we interact online but also our world as a whole. While other journalists seem to be hammering the social net as a haven for child predators and terrorist trainers, Bill talks about how it is uniting cultures and making the news we see on TV real again.

Bill writes:

What will happen when these people (referring to online friends we have made) start dying in famines or wars, or when the climate changes caused by global warming lead to floods and droughts and natural disasters?

What happens when the photos on Facebook and Flickr show devastated crops and starving families – and these people are not just faces on the television but old friends, people whose likes and dislikes and reading habits and favourite films we know and share?

The world is different when it’s the people you know, and I do not think we will be able to resist the forces of change when our friends are dying on screen, in front of us, and we know that we could do something but have decided not to.

The article really grasps the power of the social web, a power I personally am all too well aware of. Running and developing an online community is a strange thing. Many perceive social networks as a numbers game (a way of attracting traffic). However at its heart are real people and real relationships. I will never forget a woman called Crystal whom I became friends with back in 1997 when I ran a virtual community. Crystal was dying of cancer and was housebound. For such a long time she was the heart of our community until one day she died. The grief that we felt was just as real even though none of us had ever met her face to face. She was a real friend to me, a real person.

I think that is why many online communities fail. They fail because they don’t grasp that communities are about people and relationship rather than features and technology.

Back to top

Marcus’ bit: Project timescales

I have often rambled on about the importance of contracts on this podcast and, within those the contracts, the need for a detailed spec, a detailed task list and associated timescales and milestones.

I still think all of those things are important but I do think that often (me included) people go into a land of fantasy when it comes a) when they can start a project and b) how long each one of those tasks will take.

Clients are guilty of this too.

This is what usually happens:

  • The client, not knowing how long the project will take, picks a date for project completion because they don’t want it left open. Let’s call it ‘date x’.
  • Unless it’s patently impossible to achieve, agencies will agree to this deadline because they don’t want to adversely affect their bid.
  • A certain amount of back and forth over the delivery date happens because, for example, it takes longer than expected to agree on a contract, or maybe the scope has extended a little, etc. But the agency can’t really move the date to somewhere comfortable because they have already agreed to ‘date x’. So, all parties then agree to ‘date x plus 1 month’ or similar.
  • The project then slips and both parties start blaming each other for it – the agency feels that the client is overly pushy and, worse, the client thinks that the agency is unprofessional, inattentive etc.

Be honest from the start

Seriously, do it. I was just having a conversation this morning with a potential client (hi Graham) who is looking for a new site. He has an unrealistic delivery deadline of the end of October. With Headscape’s current workload, I felt that we could deliver the project, at best, by the end of January. This blew our chances completely but -

a) Graham appreciated the honesty and, who knows, may want to work with us again or recommend us to others;

b) If I had underestimated – a favourite at this time of year is to say ‘we can do it by Christmas’ – then I would have become very unpopular internally and also with the client when we failed to deliver.

Don’t forget you have other clients

It is so easy to think ‘standard CMS site redesign equals 10 weeks’ and then go and quote a date for completion 10 weeks from now! Don’t forget the following:

  • It usually takes at least 2 weeks to sign a contract
  • Do you have the resources to start straight away?
  • What other projects are imminent?
  • Staff holidays

Educate

I think the problems I am referring to relate to the fact that, even now, we are working in a relatively ‘young’ industry. This means that many clients simply don’t have an understanding of how long projects, and the tasks within those projects, can take.

This used to be a problem with pricing and still is in some cases. However, client expectations of cost seem to be a lot more in line with each other than they were, say 3 years ago.

If we can explain what we do and how long it takes right from the start with a potential client, then hopefully client expectations of project length will also balance out.

Back to top

Paul’s corner: Social networking for sales

From time to time I get questions about how to build your reputation in the field of web design. How do you become well known so that you can attract more work in? Its a fair question and one that inspired an article I wrote recently called The Geeks Alternative To Golf.

Back to top

Ask the expert: Ben Hunt on marketing a web business

Ben:

Ill be talking about marketing a web business. And the things that I cover will apply particularly to small web businesses, little shops, web designers. But, the principles that we will be going over will apply to the whole of web design and in fact the design of any site at all.

What I am going to be talking about I guess comes under headology, psychology. It will be stuff like: self perception, posture, attitude, and brand – which are really central things.

So, starting with brand… what is brand? Well, brand is how people perceive you. What do you offer, what can you do for them. And what differentiates you from alternatives. Differentiation is absolutely vital and you must not ever underestimate it. There is a couple of books that have been really influential in hammering this point home to me.

The first one I would like to mention is called Purple Cow. It is written by Seth Godin, the kind of godfather of marketing. And the core premise of Purple Cow is… whatever you do, you have got to stand out 241 you’ve got to be memorable. In the 22st century just fitting in with people’s general expectations, fitting in with the crowd simply doesn’t cut it anymore.

The second book that I really loved is called Zag and it is written by a guy called Martin Neumeier. And it comes at the same kind of thing, but from a different angle. It says, “When everybody zigs, zag.” You go in the other direction. What ever is going on around you, do whatever it takes to stand out, to be noticeable and to go against the flow. Zag is also full of brilliant examples that explain why and also how you can go about it.

So what I am going to be covering is broadly three steps that will help you to get into a really winning mindset. Okay, so let’s dive in.

These days so much to choose from that we are surrounded by so many brands and so many messages all of the time. What drives our decisions and our choices as clients and what drives our client’s choices. And I find that it really really helps me if I try and get into the head of my potential customers. So the first thing to note, which is really often overlooked, I cannot stress this enough is people who land on your website (generally speaking) want you to be the one.

No one really enjoys trolling search engine results. People say to you, “Oh you know, you competitors are only a click away.” And I would like to say to these doom-and-gloom merchants, “So what!”. You know, when somebody is on my website, we are half-way there. We are over the first hurdle.

And these people are going to fall into two categories. They are either going to be someone who is looking for what we do and if they are fantastic! All we need to do then is to communicate that, quickly and cleanly to them, without giving them any reason to click back to the Google search results. And if this people is in the other category of people who aren’t looking for what we offer, no problem! We have got nothing to lose. We’re unlikely to be able to turn them around at this point and they are probably looking for something else.

But what we might hope to do, is leave a positive impression so that one day when they are sitting there at there desk going, “Do you know what we really need is someone who does expert site reviews, or somebody who specializes in Web 2.0 design.” You might hope that hey remember you.

It is really important to get your head around this reality that people who are visiting your sites are your friends and they want you to be right, so all you have to do is not bugger-it all up.

Okay, so let’s take it for granted that your honored site visitor is in the first camp. They are here because they are looking for what you offer; they want you to be the agency for them. Moving on to step two… How to let them make a positive decision.

Now here my advice is, work out who they really are. Who are your real customers? I see a lot of small agencies and free lancers, who on their websites they try and betray themselves as something they’re not – either bigger or broader or more capable. We don’t need to do that. The absolute core of this whole blurb I am spatting at is don’t pretend to be a big corp megabucks agency, if you’re not. Yeah…

The whole trick is to be who you are, and portray that in a strong way that people love; that people connect with. I mean, you’ve seen all this stuff where people say, “We this and we that.”. You know, all over their website. When it is clearly one guy sitting in his bedroom. And there is nothing wrong with being one guy sitting in your bedroom doing work; there is a market for that kind of thing. And the other kind of stuff you find is people say is that, “Oh, we do work for clients ranging from 50-quid jobs (for small local businesses) up to mega-gazillion jobs for international blah-blah-blah…”. And you sit there going, you don’t do those kinds of jobs.

So who are you trying to win? Are you trying to win BMW and SONY and Disney? Do you think they… those guys are going to come along to your website and fall for this stuff? Let’s say they did.

Let’s go on a flight of fancy and say that the VP of Marketing for Disney lands on your website cause they just happens to find himself between web agencies, looking for a new one, and he goes, “Oh wow! These people seem to have a team although I can’t see them because there are no names and there is not much of a portfolio. And they say that they work with companies just like mine, a massive global conglomerate.” Let’s say you caught him on a bad day and he accidentally picks up the phone and calls you. How long is he going to be on the phone for, one minute 241 two minutes, before he realizes that you can’t possibly give him the security that he as a big-massive client needs. So we just need to accept that these aren’t the guys who will be paying your wage.

So think, “Who are the real people who want what you offer?” And then, we brand ourselves, we pitch ourselves for those people uniquely. There is no point in pretending to be what you are not. What you need to do is present what you are, in the best light possible, which brings us onto step three… How to show who you are in a way that wins customers.

So the trick is to examine all the aspects of what you are, what you do, and how you work whether you perceive it as positive or negative. And build those things into a brand, into a whole impression, that really delivers for you. So let’s get back into our customers head.

Who are they, first of all? So they are not BMW and Disney and all of these guys. They aren’t going to be paying your bills. Who is going to be paying your bills? Who needs what you have? This is a two-way match between supply and demand. You can’t just be what you are not. You can only offer what you can offer. You can’t sell to people who need something else.

Let’s start with the givens. Let’s start with what you are and what your capabilities are, what you can do. And then, picture a market for that. But the trick here is to select what to show that might make you memorable and create a connection.

Often the things that you might perceive as weakness… for example if you are stuck in that mindset of thinking, “You need to pretend to be a massive full service agency.”… the things that you think are weaknesses may in fact be real strengths if you can spin them right, if you can present them in a right way. But, fundamentally this is all about getting your head around it.

Branding isn’t about pretending to be something that you are not. Branding is about working out who you are and what you really do and then standing there and saying it with confidence in a way that really impacts people.

Okay, so let’s look at a few things. Ah, you might be thinking, “We are not based in central London.” Great! You’re nearer to your local customers. You’re nearer your local small businesses who want somebody around the corner. They don’t want a big kind of so-ho agency.

So you are thinking, “We are just one person.” Fantastic! You have no huge wage bills and that keeps the cost down. And very often, your clients can know that they can pickup the phone, and might even have your mobile number, and they can pickup the phone and speak to you. And that is worth an awful lot to a lot of clients, knowing who is going to be on the other end of the phone.

“What about if you haven’t got an office?” Who cares if you haven’t got an office? You go to your clients and meet at their premises. It also keeps the fees down. Your local clients will respect that.

“You don’t know everything about web technology.” Who does? You might be a specialist in PHP or CSS. Or you might have a particular passion for religious organizations or green issues or whatever it is, whatever really floats your boat is whatever you want to do. Let’s do that.

Nobody knows everything. So if you are a small scale agency, we talk about this a lot, everyone has a network of other professionals and amateurs in your area, or around the world, who can help. And even the big agencies do that – everybody does that.

So what we are talking about is, say what you are really about. Lots of people make a positive decision to work with my agency, after reading our ethical policy that we publish on our website. And that works great for us because the kind of clients that we love to work for are actually attracted by reading that stuff and the other clients who are in industries that we don’t do, they don’t bother to get in touch. Which saves everybody time and effort. So now you are getting your brand together. We need to build in, what your audience wants.

So if you are really suited to dealing with other local small businesses, say. Think about what signs, what signals they are looking for to be able to make a positive decision to take the next step.

There are two important things to remember here. Remember the customer in on your side. They want you to be the one. And also, here’s a new one, you don’t have to close a sale on your website.

They job of the website is to get a qualified visitor from the point of first initial contact, knowing nothing about you, to the point of taking the next step. That’s it. So focus your efforts on giving the right kind of visitor, the right kind of signals, that you probably right for them. That is all that you need to do.

Now generally, you’ll be looking to reinforce just a few points and I always think of these as like check boxes in somebody’s mind. I like to picture somebody; think of what they look like, where they’re working, sitting at their computer typing something into a search engine and clicking on some results. And thinking, “What are the check boxes, what are the three or four check boxes (there are not usually more that that), in this person’s mind that I need to tick-off?”

And if you can tick-off those check boxes without upsetting the person, or giving them any reason to go away, and not believe in you then you’ve probably done your job. Then what you do is, you say (here is a call to action)… “If you want to talk about this more, that is fantastic, pickup the phone and call me and I would love to speak with you!”

Let’s imagine, depending on the market you are talking to, what kind of check boxes might be in somebody’s head. I think very often that they are things like, “I can trust these guys.” or “They are not going to be too expensive and will fit my budget.” or “They like working with companies like mine.”

So they are looking for evidence of all of those things. And it might be like what we said before; “I can get somebody on the phone if I need help.” And clients aren’t necessarily super confident in their requirements. You know, if it is an engineering company, and they don’t really know anything about media or marketing in particular, then there is no reason to think that they are sitting there being really really cynical. What they looking for is a friend, they are looking for someone to be on their side and to help them through this process.

All we need to do is get them effectively to feel good about you 241 is really what we are saying. We have to get them from first finding you, to coming to a point where they have no reason to think you are not the right agency for them, then you give them a call to action and you say, “Let’s get together and let’s talk about we can do for you.”

The thing I would add here is to do with focus. You need to plan the steps from the home page through to that call to action. Now you know your website might only be one page. You might only need one page to do that. You don’t have to have a news section. You might not have news to give. Don’t put a news section on because it will be a dead pit.

You should put on your website only the things that you need to get that person from A through to B. And you need to be very very focused about it. So don’t put in more pages than you need. Don’t put in more images than you need. Don’t put in more blurb-bump-from-rhubarb, the more blurb-bump-from-rhubarb you put on your website the more you’re going to be watering down your message.

Get all of these steps right, you have done your job and you should see the difference in your bottom line.

Back to top

An international web

I hope you will excuse the slightly self-absorbed nature of this post. It is mainly an apology but also hopefully an opportunity to learn some lessons and look at how communicating on the web is a unique experience.

When I first started the podcast I had a very specific tone I wanted to strike. I wanted it to feel like it was a bunch of mates sitting in the pub talking about web design. A simple enough goal you might imagine but in reality it may well be almost impossible to achieve. Let me explain what I mean…

The apology

Yesterday I received an email from a first time listener to the show complaining about me teasing Americans. At first I thought nothing of it. I have learnt to be fairly thick skinned. Whenever you put content out on the web you are bound to attract criticism from time to time. However, I did post on twitter about it and this kicked off an interesting conversation.

It quickly became apparent that my “jokes” could be seen as offensive by some of my American listeners. So, before I go any further let me say that I am sorry if this is the case. It was certainly never my intention to offend anybody and I will certainly try and tone things done in the future.

Analyzing the mistake

That said, lets go on to look at what went wrong and what broader lessons can be learnt. Lessons which can apply to us all rather than to just an insensitive podcaster.

When you screw up as much as I do you quickly learn to analysis your mistake to avoid repeating history. As a result the email obsessed me for much of yesterday afternoon. Thanks to contributions from Thomas Vander Wal and Anton Peck it quickly became clear that the problem lay in my failure to accept the nature of the medium in which I work. Unlike my original desire for the tone of the show, producing a podcast cannot be like chatting with your mates in the pub. I think there are three specific problems with that premise:

My audience are not my mates – However much I would like to convey that feeling, ultimately my audience do not know me. They do not understand my sense of humor or know that I mean no offense when I overstep the line.

They are not sitting with me – The listeners to Boagworld cannot see me. They cannot pick up on my body language or see the grin on my face. They have only the tone of my voice to judge the intent behind my words. As we all know body language is a huge part of how we understand what is being said.

“The pub” and “mates” are very British centric – Even in my thinking about the tone of the show I was exhibiting a very British outlook on the world. Any web based content is very international in its reach. It isn’t confined to a people group even if that is your intention. Even though the British and Americans speak the same language we have very different cultures. I am not going to embarrass myself by trying to guess the differences. However, I know that when programmes such as the Simpsons or Family guy portray the english as buck toothed, weedy, posh blokes this doesn’t offend me. To me they are poking fun at a stereotype, not me personally. Perhaps this has something to do with the perception of national identity. I don’t know. All I know is there is a difference, a difference that until now I have largely ignored.

Lessons learnt

So enough peering at my navel. What lessons can we learn from this. We all run websites. Most of us blog. We are constantly speaking to a world wide audience. How can we ensure that our communications do not cause offense or indeed drive users away. Here are some suggestions.

Be careful with humor

I think my personal mistake makes it very clear that humor can be a particularly dangerous area. For example British humor is very sarcastic, subtle and self deprecating. There is a good reason why most UK sitcoms don’t do well abroad or have to be remade.

Don’t be fooled by a common language

Just because people are reading your website in your language doesn’t mean they have the same cultural background. I am constantly amazed at how different the english speaking world is. I think the fact that we speak the same language lulls us into a false sense of security. Of course there is also a mass of people who will still read your website, but english is their second language. These need even more care because it is easy for them to misunderstand what you have written if their english is not perfect.

Consider getting a copywriter

If people struggle to understand humor in a podcast, where you can hear somebody speaking, how much more of a problem is it in written word? I often talk about the fact that the copy on your site should be engaging and draw users in. It is hard to do this with the written word alone. How do you communicate enthusiasm, empathy or indeed any other emotion without body language or tone of voice. This is a highly skilled area and I think as website owners we need to seriously consider using professional writers to help us get it right.

Review before posting

Think twice before posting anything. We all know that don’t we? You read through the copy of your website over and over again, right? Same with your blog posts? What about your posts on twitter? Hmm… maybe not :)

Look beyond the written word

Finally, I just wanted to mention that I don’t think this problem of cultural differences and misunderstandings due to medium is limited solely to the written word. We have already seen it applies to audio, but what about the video or the imagery on your site. A lot of websites contain imagery that convey huge cultural meaning. I am not even talking about the obvious stuff like showing bare flesh in an Islamic country. I am talking about the more subtle things too. For example recently I went to a website that offered a service which allows users to record audio messages for the podcast by calling a normal telephone number. I have looked at loads of these sites before and they always only provide a US phone number. Well I arrived at this new site hoping it would be different but took one look at the design and use of imagery and immediately left. The look of the site was so US centric and the stock imagery was full of people who were obviously American that I left before even checking the details.

So there you have it. My screw up, my apology and hopefully some stuff we can all learn from it. Am I going to dramatically change the show? Absolutely not. Am I going to give more consideration to some aspects of how I present stuff? Absolutely.

Podcast 53: Ecommerce Usability

Product information can make or break an ecommerce site. In this week’s show we look at the usability of ecommerce sites and in particular how you display your products.

Download this show.

To subscribe directly within itunes click here

Recently I have been reading Jakob Nielsen’s book “Prioritizing Web Usability”. Although I don’t always agree with everything Jakob says this is an invaluable resource and I strongly recommend that you consider buying it.

I have just finished the chapter on product information for ecommerce sites. What he had to say on the subject was so good that I thought I would share some of it with you.

We cover:

  • Pricing – What to display and how to display it
  • Common Questions – Ensuring you address FAQs on subjects like delivery, returns and security
  • Product descriptions
  • Layering product information so as not to overwhelm users
  • Product imagery
  • After sales support
  • Supporting articles on your products and the benefits these provide you as a website owner

Later in the show we also discuss some of the comments about ecommerce usability made, in the boagworld.com forum.  Unfortunately we couldn’t cover all of the issues discussed so if you would like more detail visit the ecommerce thread on our message board.

In the news

There are some very interesting stories in the news this week. Probably the biggest story is the possibility that Google intend to by YouTube. For more information on this acquisition check out TechCrunch’s report. However, more interest to me are two stories found on the BBC website. The first is a report stating that people are more concerned about net crime than being burgled. This remarkable report emphasises the need to reassure users continually about the privacy and security of their personal information. The second article exposes the fact that despite people being more tech-savvy than ever before, they are still left confused by the mass of technical jargon online.

Review

Finally, we review an easy to implement ecommerce system called Shopify. Although not quite as straightforward as RightCart it does have considerably more features and is definitely worth checking out if you are considering a small scale ecommerce website. For a more complete rundown of the different ecommerce packages available read the ecommerce software thread on our forum.

atMedia: IE7 and beyond

Chris Wilson, the lead developer on IE 7 shares some of his thoughts on the upcoming release of Internet Explorer.

There have been endless posts on the various new features and fixes in Internet Explorer 7 so I won’t bother going over what Chris covered in this area. However there were three tip bits of information which you might not be aware of:

Getting ready for IE 7

I didn’t realise quite how many tools Microsoft have produced for web designers and website owners to help them assess their site in IE7. In fact they have produced an IE 7 readiness toolkit which you can download. The one tool that particularly caught my attention was an expression finder which allows you to identify any hacks in CSS.

IE 8 and beyond

Microsoft seem to be more committed to moving Internet Explorer forward than in the past. They are already working on the next two releases and it would seem that we won’t have to wait another 5 years for the next upgrade!

Windows update

The big question every web designer is asking, is how long before they can drop support for IE 6. Well that depends on how fast IE 7 is rolled out. It sounds like this will happen fairly fast because it will be included as part of the windows update. It also looks like it will be a high priority update because of all of the security fixes. In short Microsoft will be pushing IE7 as hard as possible.

Podcast 24: Selecting a content management system

With almost all clients wanting to have at least some control over their websites, the choice of content management system has become a key component in a successful website project plan.

Download this show.

This week Paul and Marcus are joined by fellow Headscape employees, Mark Crawley and Chris Scott in the new Headscape office!

Boagworld news

This week Paul rants about a new web design podcast while praising another that has been nice enough to massage his already over-inflated ego.

Talking of over inflated ego’s, Paul wants to remind everybody about the Geek Dinner being thrown in his honour (well that’s how he likes to think of it) this coming Thursday. Paul and Marcus can’t wait to meet all four of their regular listeners in person as well as making a load of new geek friends who have never heard of this podcast!

Techno buster: Server side and Client side

Why is it that all web developers like to speak their own special language? This week Paul and Mark unpack the differences between server side and client side by trying to explain the roles and limitations of both in plain English.

Main feature: Selecting a content management system

Paul kicks off by discussing the four types of content management systems:

  • Editing of static HTML websites using tools such as Dreamweaver and Contribute
  • Editing of specific site sections like news and events
  • Editing of entire site content including site architecture
  • Enterprise level content management with workflow and permissions

The discussion then expanded to look at the pros and cons of bespoke content management systems vs. off the shelf products. Finally we ended by looking at what factors should influence your decision when choosing a CMS.

Factors included:

  • The flexibility to control site design
  • The hosting requirements of the CMS
  • The functionality offered by the system
  • The expandability of the CMS
  • The learning curved required to implement and use the CMS
  • Your budget
  • The systems support for accessibility and web standards
  • The quality of the WYSIWYG editor

Related article: Designing for your CMS

Web resources: CMS related sites

Open Source CMS
This great site allows you to view demos of every open source CMS imaginable as well as providing user ratings and an extensive forum. As the name suggests this is a great place to start when looking for an open source CMS.

CMS Matrix
This site allows you to compare several content management systems based on a variety of criteria including security, flexibility and support. This is an excellent site if you are trying to narrow your field of options.

Xstandard
Xstandard is truly a top of the line WYSIWYG editor. It produces valid, accessible code as well as allowing designers to limit the control content editors have over the appearance of a site. We have covered this editor before but it’s so good it deserves a second mention!

Your thoughts

We have received loads of email relating to content management systems already and so we know this is a big area of interest for our listeners. Share your thoughts and experience of using content management systems by posting a comment here.

The price of success

Today I have seen both the good and bad sides of managing a successful website. Receiving recognition can be a two edged sword and one that every website owner needs to be prepared for.

It has been amazingly gratifying to see the success of boagworld.com and I am incredibly appreciative to the many members who have been so committed to it.

Recognised by the 9 Rules Network

Today all of the hard work has been recognised with the inclusion of boagworld.com in the 9 Rules Network. For those of you who have not come across the 9 Rules Network before, it describes itself as follows:

We highlight the very best web content in the world and package it in a nice bow for you to unwrap. Our members discuss topics like Web 2.0 design, Hollywood gossip, cognitive psychology, sex & relationships, entrepreneurship, and many others.

The 9 Rules Network includes such great web design authors as Molly Holzschlag (molly.com), Roger Johansson (456 Berea Street), Robert Nyman (Robert’s Talk) as well as collaborative blogs such as Particle Tree.

Being included on a network as highly selective as 9 Rules is a huge honour and being listed alongside the names above is simply mind blowing.

Success attracts SPAM

if you have been unfortunate enough to receive an email from me offering you sex or Viagra, I am sorry to say that you were just suffering from junk mail

However today has also shown me the other side of success. With the growth of boagworld.com and the increase in links to the site, I have seen a staggering explosion in comment spam. I have been using the web for long enough to simply accept this as a part of life. I was determined not to moderate the comments on this site and long ago accepted this would mean I would have to regularly "clean" the comments by removing the junk. However, because of the growth of the site I have found the comments facility becoming increasingly popular among legitimate users. I therefore added a new function to the site, which allowed users to subscribe to comment threads so they are automatically informed when something new is added. The downside of this is that people subscribed to a thread were also receiving the junk that was being posted there.

SPAM damages accessibility

The result of all of this is that I have been forced to add one of those annoying image security codes to my comments facility. What makes me so angry is not that it is an inconvenience to most of my users (although that is frustrating) but rather that it creates a significant problem to users with some form of visual impairment. The ironic thing is that only yesterday I was listening to TWIT which included a blind user complaining about exactly this problem. How is a blind user supposed to enter a security code found in an image that he cannot see! In short spam, is making the web more inaccessible for millions of visually impaired users.

I have worked around the problem as best I can by allowing comments to be submitted for manual moderation without entering the security code. However, this is reliant on me spotting the genuine submissions among hundreds of spam entries. Far from ideal!

So if you have been unfortunate enough to receive an email from me offering you sex or Viagra, I am sorry to say that you were just suffering from junk mail and this was not a genuine offer.

However, you will be pleased to know that it should not happen again even if posting on this site has just become slightly more frustrating.