Dionysus approached us with a brief to realign the website to better leverage the online medium. The site features a full CMS implementation, user registration, search, a blog, events calendar, discussion forum and a photo gallery.

This project for Dionysus went from initial consultation through information architecture, interface design, HTML/CSS coding, CMS implementation (Joomla!), content insertion and training.

The client was an absolute pleasure to work with, and we wish Irene, Seth, Kathy, Angie, QJ,  Jeannette and everyone else all the best with their new website.

How to resize an image online from Ross Allchorn on Vimeo.

Here is our checklist.

1. All links checked
   Are your internal and external links all correct? Think about hardcoded links and dynamic links. If your site is database driven, you can check all internal links with a script.
2. Page title tags consistent & optimal
   Your page title tags are those that appear in the title bar above File, Edit, View etc. It’s important for search engine indexing that the title is clear, concise and depicts what is on the page.
3. Search engine friendly URLs
   If you’re using a CMS you should ideally have some form of URL rewriting feature in place that converts dynamic URLs to search engine friendly ones (example.com?pageid=15 to example.com/product-name)
4. Search functionality
   If you have search functionality on your site, does it work correctly? Is it intuitive and are the search results accurately portraying the information the searcher is seeking?
5. Screen resolution
   Does your website display nicely on screen resolutions your visitors are likely to be using?
6. Content rendering
   Sometimes content can become a bit mangled when copying characters from MS Word or other web pages, and as such a good thorough toothcomb inspection of your content should allow you to rectify any issues.
7. 301 redirects
   If you’re redesigning your site, you want people who have possibly bookmarked your old URLs to automatically come through to the new pages. 301 redirects are the universally recognised “change of address” for web pages and to retain existing traffic and rankings this is gravely important!
8. Custom 404 error pages
   When someone hits a URL on your site that does not exist it will display a 404 error page. These can be customised, and are an effective catchment system for preventing the loss of visitors that hit a generic 404 error page. The page should ideally display with the same/similar aesthetic as your site and offer a clear explanation, navigation and search.
9. Analytics implementation
   If you have a website online, you want to measure it’s efficacy. You can track visitors, bounce rates, conversion rates and a multitude of other interesting and useful information by simply installing analytics software.
10. Favicon implementation
    A small visual feature which can give your site a more “complete” look. Not only will it be an icon used in tabs, but also in bookmarks making it easier for people to find your pages if you make them stand out.
11. Meta tag implementation
    Not as important as they used to be, but still worth doing once you’ve researched your keywords. Don’t stuff your keywords in, but rather keep them relative and to the point.
12. XML Sitemap
    A sitemap is an important feature which tells the search engines what your pages are and how frequently they can expect to be updated. This allows them to index your site at intervals which are in line with your updates.
13. Form to email/database
    If you have forms submitting to email addresses or to a database, make sure they all send correctly, and to the right people/places. Make sure those responsible for responding are aware of their duties as well as any autoresponders are setup correctly and working.
14. User administration settings
    If you have more than one user, you’ll need to make sure they have sufficient (and not too much) authority on the system managing your website.
15. Speed tests
    Is your server performing as it should? Are there scripts/flash/large images causing slow loading times?
16. www and no-www
    If visitors access your website at www.example.com, they should be able to also access it sans-www (http://example.com). It’s a setting your host should enable, and if not perhaps consider another host.
17. Browser compatability
    What browsers are your visitors using? Global statistics can tell you initially, and soon enough you’ll know what your visitors are using from your analytics. At the time of writing, we feel it important for your site to work in Internet Explorer, Firefox, Safari, Chrome and Opera.

These items are in no particular order and bare in mind that depending on the project, there could be more or less items to consider (eg: spell checking, proof reading, legal requirements etc.)

This post is password protected. To view it please enter your password below:

Password:

Essentially it’s working on a 12 column grid and can easily accommodate a neat one, two, three or four column layout. Work in thirds, quarters, halve it, or use the full width (960px) of the design. It’s a fixed width, centered design and I will likely make it into a WordPress theme in due course.

I started building this as an illustration for the course I’ll be teaching in web design for Hirt & Carter next year, and it’s grown so far beyond that. It’s good fun, and tests my skills and knowledge. Coding is going to be fun, but it’s so rigidly grid based, I suspect it’s going to be quite easy. Little do I know hey?

As it seems WordPress is the talk of the web publishing world right now, I’m busy with a lot of WordPress related projects. I had to looks for some specific extensions for the system called Plugins. and in so doing, I came across some nifty addons that I’d like to share. Some I will use on client sites, some on my own, and others I’ll just keep a note of for future reference.

Google Sitemap Generator

This one was actually found in a search for a meta tag management plugin for WordPress, and although I discovered that there are other ways to solve the meta tag debarcle (another time), this one was a good find, and already on this site.

Sociable

This plugin gives you a huge selection of social websites that your visitors can use to share the content of your site/blog. I’ll integrate it into this site, but need to do some offline testing before it doesn’t post links below my intro blurb on the front page (my entire site is WordPress driven).

WordPress.com Stats

Now, don’t get me wrong, I use Google Analytics every day, as I believe it to be the most effective and easiest to use analytics software available. However, the WordPress.com (hosted WordPress) stats plugin gives you instant statistics in your dashboard which is handy and doesn’t require you to log into GA for a quick glance at your traffic.

CForms II

To me there is no debate over this being one of the most useful plugins for WordPress. Create, manage and edit your forms for your website. Publish them on pages, posts, whatever. Submit to email or a database. Built in AJAX form validation… etc.

Subscribe 2

Allow your visitors to subscribe to notifications of new posts and content. Even taking your content and sending an hourly, daily or weekly digest of your new additions. This one is really handy to keep those unfamiliar with RSS up to date via email.

Well, those are them. Some are almost essential (CForms & Google Sitemap Generator), while others are nice to haves that definitely won’t hurt.

Recently, I did a (very) small WordPress driven website for a friend of mine for his up and coming laptop and notebook repair service. Things went anything but smoothly in some aspects like moving from his hosts at the time (no names mentioned) and then some controversy three quarters of the way through when someone criticised me to him sparking some doubt in his mind over my costs. This is what caused me to write about lowballers in the web design industry.

I won’t paste the entire email as there are some bits that are not related to this post (and personal stuff), but since he said:

“Feel free to post any of this on your blog, with my email address as a ref. Will be happy to advise others to use your methods.”

I decided to use this one paragraph which sums up the tone of the email and what he was saying:

“Most importantly: Your sites work – you can quote me on that. I think the value of the site far exceeds what you have charged, and I really want to thank you for going out of your way to sort me out on mates rates there. That CMS is absolutely necessary, there’s just no contesting that.”

Well, to me, that makes me feel a whole lot better in an industry where there is a lot to get frustrated about and it’s nice to know there is more to it than just the pleasure of working with technology in these exciting times on the web.

WordPress by default makes use of the TinyMCE rich text editor and as such, it’s quite extendable. It’s very well documented in their documentation wiki and does a lot more than what WordPress enables out of the box.

This is what I was looking to do

WordPress’ WYSIWYG displaying table editing tools on the bottom row.

Shock horror! I hear some standardistas ranting about tables being evil already. Well, I hate to burst some bubbles, but tables were invented for a reason. Believe it or not, for tabular data!

WordPress, the popular content management system was initially built for blogs, and I am guessing the omission of the ability to create and edit tables in the interface was a well thought out decision and I hold nothing against them for doing so. My clients however, they disagree. Well some of them at least.

Now that WordPress is powering not only blogs, but online magazines, corporate websites and all different types of sites, it’s quick becoming a very powerful and popular generic CMS. Extending it has become a big game.

My client had a pricing page and needed the ability to add tables, modify cells, padding, spacing, background colours etc.

Cobus over at Fresh01 found this page on the WordPress codex site which you’ll noticed I’ve commented on. I just felt the need to write this post with a bit more detail.

The process

Firstly I downloaded TinyMCE, and put the “table” folder into the plugins directory in wp-includes/js/tinymce/plugins.

Then in the file tiny_mce_config.php I edited this line:

$plugins = array( 'safari', 'inlinepopups', 'autosave', 'spellchecker', 'paste', 'wordpress', 'media', 'fullscreen' );

and added

,'table'

into the array.

I then scrolled down and edited

$mce_buttons_3 = apply_filters('mce_buttons_3', array( ));

by adding

'tablecontrols'

making it

$mce_buttons_3 = apply_filters('mce_buttons_3', array('tablecontrols' ));

Then opened up a post/page edit and refreshed the page…. Viola! Table editing tools.

Problem, I can’t edit the cell colours…

Well, after editing the config file and being familiar with the way it’s laid out, all I needed to do was look at the available buttons and controls for TinyMCE and find the button for background colour, and that happend to be backcolor.

Therefore, after ‘tablecontrols’ in the line

$mce_buttons_3 = apply_filters('mce_buttons_3', array('tablecontrols' ));

I added

, 'backcolor'

So it looked like

$mce_buttons_3 = apply_filters('mce_buttons_3', array('tablecontrols', 'backcolor' ));

And thats that.

If you want to add other buttons and controls, browse through that wiki page, and if they don’t activate, you’ll just need to upload the relative plugin folder from your downloaded TinyMCE package.

This may come across as a rather opinionated post, but it’s my view, and my blog. Any thoughts (logical, non trolling comments) would be most appreciated.

I’ve broken the different types of systems into

• Home Grown CMS
  A system built in-house rather than buying one or customising another system.
• Open Source CMS
  A system built by a community of developers under a sharing community based methodology. Usually free. Examples – Joomla, WordPress, Typo3.
• Proprietary CMS
  Built by one company, maintained, supported and available as either a one off cost, or licencing payment structure. Examples – Realm Platform, Expression Engine, Vignette.

Home Grown CMS

Up until late 2007, I was heavily involved in the design and development of a content management system called SimpleCMS. It’s since been discontinued, thought it continues to effectively power a few websites. Successfully adopted as it was, suffice to say, the development team lost steam and we opted to count our losses and move on.

The concept behind developing a home grown CMS system is a very noble -if not misguided- cause on the most part. I tend not to talk in absolutes, but if you don’t have a rather large budget (£50,000+) or an exceptionally self motivated and enthusiastic development team it’s a classic example of a reinvention of the wheel.

If you have the infrastructure, and an exceptionally strong need for something custom that is not done by one of the many established systems, then this could be an option. Word of warning here… do your homework on what’s available!

Home grown CMS systems are sustainable when you have a long term team of developers with a proven track record of successful developments.

Pros

• Write your own system and have it do exactly what you want.
• If it’s a niche system, and licenced accordingly, it could be resold later to others.

Cons

• Prohibitively expensive.
• Can take a good deal of time to develop.
• Often you can get the functionality you need from free or relatively inexpensive alternatives.

Open Source CMS

A system that is free to download, install and work with. What could be better? On the surface, this seems like a no-brainer, but when you dig a bit deeper, there are some serious cons that creep into the mix.

The popular systems out there, amongst others, include Joomla, Drupal and Typo3. Some systems initially intended to power blog style sites are also evolving into quite competent content managers. WordPress and Textpattern being the two that I know the most about.

If you’re looking at cost, you’re mistaken in thinking that getting a professional result from an open source system on a smaller budget is likely. More often than not, the professional Joomla or WordPress designer and manipulator comes at a professional, market related price. The fact that the system is free means little when you want a specific design, layout and modes of publishing, moderating and syndicating.

The world of open source CMS’s does cover an extremely broad field of requirements and a large percentage of websites should be fine on one of them. More than a little research should be carried out before deciding on a system and any future possible requirements.

Open source CMS systems are sustainable when you are aware of the fact that although you’re getting it for free, you still have to put a lot of work in. Slapping up a default theme and expecting things to do themselves is counter productive, and you won’t get far.

Pros

• Most systems are supported by a large community and you will find assistance all over the globe.
• Modifications to the site, including the CMS itself is permitted by the GPL licence, so it can effectively be “white labeled”.
• A large selection of systems and features.
• The decent systems are constantly being updated, and security flaws patched up.
• The software itself is free.

Cons

• Due to the large community, there are a lot of semi-skilled and outright charlatans out there proclaiming to be gurus.
• When things go wrong, the solution could prove costly and take time, unless you have a true specialist on call and available.
• Due to their popularity, they can be targets for spam and hacking.
• Training and support is often hard to find, but not impossible.

Proprietary CMS

Getting a system that has been built up commercially by a company dedicated solely to developing their system can be a very good thing. The sustainability of a proprietary system with the possibility that you paid for it, and it is maintained by those who developed and support it can’t be under emphasized.

You’ll have an initial cost, and that price can vary. Don’t  be confused with someone charging to install and customise an open source system to a company that is selling their own product. Chances are the open source guy does not know a lot about the underlying code in the CMS and when things go wrong, fixing can be a problem.

Selecting a proprietary CMS is also a matter of truly establishing your requirements and finding one that is suitable. There are some truly amazing systems out there like Realm Platform and Expression Engine.

Proprietary CMS systems are sustainable when you work with a reputable company and understand what they do (and don’t offer) before setting up your site.

Pros

• You’re dealing with the people that made the system. Likely from the ground up.
• Features are often plentiful and can accommodate most site’s requirements.
• Custom features are often an option (at a cost of course).
• Training and support are offered.
• Constant development ensures security and bug fixes are attended to promptly.

Cons

• Initial cost can be perceived as high.
• You are putting a lot of trust in one company, so choose wisely.

Summary

Really, as usual, it highly depends on how you approach your project, who you are, what you need, how quickly and how much you have in your budget.

I am heavily swayed towards the Open Source or Proprietary options unless you have extraordinarily unique requirements, a ginormous budget and a good deal of time.

Leaving the two options of open source and proprietary, I’d have to say that given the right people, either option could be suitable to you. For some clients, I know they can make do on a WordPress site, while for others, I wouldn’t dream of using anything other than a system that is fully supported by an established company.

In conclusion, I’d say I will normally opt towards the proprietary system as the optimal solution, but should the budget or requirements be lower, the need for support and training be less, I’d look at something like Joomla or WordPress.

You can’t always predict every facet of a project’s lifespan. Things change and evolve as you work on it. As detailed a scoping document you draw up, there are more often than not extenuating circumstances that influence the workflow and final result of any project.

• client expectations may differ from those of the designers and developers
• additional features may be required mid-way through the project
• features might need to be changed or removed during the project
• as much as we’d love it not to be the case, there are always bugs of some sort to contend with.

Believing otherwise is naive. If things on your initial agreement don’t evolve during the design and development phases, you can rest assured that there will be some form of maintenance, additions, changes, repairs or unforseens following launch.

You can’t turn lead into gold

Coming to grips with the fact that things will grow and change, you also have to look reality in the eye. You have to realise that a poorly conceived and hastily carried out project isn’t going to grow into a solid, stable and flexible one.

Making some good choices early in a project’s lifespan is imperative to the successful deployment of a website. Things to consider before starting work:

1. Have you done your homework?
   It’s important to know what you can budget on your web project. It’s not too difficult to look at the expected ROI to justify the expense. By setting a target amount of conversions to have it pay for itself you’ll know what you can afford, and a good website design consultant would be able to tell you if thats realistic or not. You do realise that just publishing a website doesn’t automatically guarantee success? Have you looked at the cost implications of online marketing?
2. Decent web hosting
   Do you own your domain name? Does your host do daily backups? What kind of support do they offer? Do they have all the technologies installed to launch your site? If all these questions were answered with a yes, or a favourable response, then you’re probably on the right track.
   Three last things I’ve learnt over the years…
   1. You do not choose your host based on price!
   2. You do not choose your host based on price!
   3. You do not choose your host based on price!
3. Development team
   It should be obvious, but it’s overlooked time and time again. Your nephew’s best friend might be able to get a little bit done for you… he might even do it quite well. But when he gets offered a job getting paid more every month than you’re willing to pay him for one website, he’s going to take it.
   A website design company needs to be sustainable, and for that, they should preferably show some form of business longevity.
   Client references? Ask, I know I’d be able to give a list of happy clients to contact if you were considering me for some work. If they don’t, either they’re so big that the NDA’s don’t allow them, or they simply don’t have.
4. Design team
   First and foremost here: Print Designers are NOT Web Designers! Web interfaces designed with a print mindset more often than not result in an unusable mess. The coding of which can be more than double the amount of time and money spent than having it designed by an experience web interface designer. Thats not to say that collateral assets cannot be sent to the website designer by the print designer with style guides, colour palletes, CI document etc. Just leave the the page layout and interaction design to those that know it best.
   Portfolios are an important way to gauge the creativity of a team. A good grasp of effective colour use, usable layouts and the general aesthetic value of their work.
5. Technology
   Believe it or not, I won’t even type one acronym in this part. The question here is… do you want to use an open source system (WordPress, Joomla, Drupal, Typo3 etc.) because it’s free, or do you want to use an open source system because it’s used by such a wide community and will be supported at least in the forseeable future? If the latter, do you know if you can get the support you need in the country (or at least timezone) of your residence? Really? Do they work in their pyjamas or are they legitimate companies like those you chose for development?
   Your other option is to go for a fully supported, homegrown system. Developed, maintained and supported by the people who initially made it. Sometimes this is the best option. They should have the longevity and sustainability that you need.
6. Marketing & Maintenance
   Are you going to maintain content of the site yourself, or at least in-house? Does the vendor of the technology or development team (often the same people) offer training? If something goes wrong with the site, are there people on call to fix it promptly? Remember, it’s not always their fault… it’s like a car. You can’t get angry at a vehicle manufacturer when your tyres wear, or cam belt needs replacing can you?
   Marketing your website is a multi faceted process. It’s best explained by people like Christine at Altersage. It’s a serious topic and one that your development and design team have to take seriously, or don’t take them seriously… seriously.

Conclusion & Footnote

This post was sparked by a repair project we’re currently doing. It was a project that started small, on a very small budget, then as it grew it started to trip over itself. Regardless it grew more, changed development teams who made it worse and now it’s broken and in need of a considerable amount of fixing. To the extent of requiring a re-do.

It’s not the only time I’ve encountered this, and I think it’s safe to say that some people never learn, no matter how many times it happens to them. Hopefully after reading this you’ll be wise enough to not let it happen to you.

A good foundation laid by the right people with enough initial research to give you a better chance at success is what it’s all about.