A sympton of technology-driven design: lack of visual impact

After my post yesterday, I’ve been contacted by Ian, owner of the website I gave as an example of technology-driven design:

“Anyway, I am concerned that you have written “I wasn’t able to see anything on the website”. Can you please let me know exactly what you mean by this. I have tested the site in several browsers and have not found any issues. I get an average of 12 unique new visitors a day with an average on-site time of four and a half minutes - a long time to not be able to see anything! Can you supply a little clarification here?”

Fair enough. I do apologize for sounding critical of a site that has a lot of positive aspects.

You’re in a good business these days: as web surfers read less and less, videos have become a great way for companies to describe what they do with enough emotional bandwidth.

Let me try to be more precise on what I see as less positive:

1. Tagline: I like very much your tagline “Putting the show back into business”. But because it doesn’t stick out (same color as most of the website, bad position, no padding on top) it gets neglected. This is what I recommend

color wise: either the color of the menu items is changed so that the red of the tagline sticks out, or the tagline’s font color is made dark grey and doubled in size
positioning: the best place to put the tagline is on the very top, before the header with the grey-ed out images. It will make the message much stronger

2. Visual Communication. Remember that people tend to scan pages quickly as they look for trigger words. Because the website’s layout is missing the sufficient amount of white space, the colors are not used effectively to prioritize and organize the navigation - the website doesn’t communicate much from a visual standpoint.

Areas in the page that contains links, text and videos are considered positive spaces. The negative spaces are the areas in between. They both work together visually. Areas of positive space that are quite near to each other (but not touching) can give the illusion of a third space between them and clutter the space. To avoid such negative spaces that are detrimental to your design, do avoid to place elements too close to each other.

When designing text, strive to provide a clear distinction between what’s important and what’s not. Contrast in typography is a key in a achieving this effect (Right now the website is written mostly in the same font size so the important message in the middle about engaging, persuading and differentiating doesn’t stand out at all) - look at how newspapers do it.

Imelt , a video production website as well, says very little in text but it’s so much differentiated from the rest that for sure you get to read it. Some other websites in your space that do very well at sending the message to the visitor are The Stone Road and Ameritech Media

3. Navigation. Overall the menus and the layout are consistent, the navigation is not stressful. The navigation options have clear labels, are balanced and paths to information are short. But be careful at the message you are sending to your first time visitors!

“We are a very small business. We don’t have the time or skills to develop whizzy websites through observation and interviews and running Bayesian analysis! We want something that is quick and simple to build, dead easy to update with new content, stable and that tells our customers what they need to know about us and what we do. I want them to know that I will make them a great video piece, not that I spend all my time tarting up the website.”

I’m suggesting that often on the web, less is more: if your goal is to show that you “will make them a great video”, visual impact matters more than comprehensiveness of information.

Now Ian it’s only fair, you also offered some criticism of our site in your email:

“At the risk of being accused of petulence, I think you should take a look at your own site as well - the “What is this place” section cuts the “keep up with me” sentence in half; what does ‘XFN’ mean in the Misc Debris section (you commented on a similar issue on the India National Broadcaster site); where are the contact details?; the Archive page seems to be the same as the About page; the Friends and Links pages take you to a) a site that offers a free online SEO but simply doesn’t work and b) one of the most confusing sites I have ever seen - your Wiki based software guide. What a mess!”

You are right about the section what is this place. It looks ok in my browser but at different resolutions it does get cut. Will fix it as soon as I’m done with this post
XFN - It seems that wordpress puts that on every blog by default. But it’s confusing I agree
Contact details are on our main site but I will add my email on the “About us” page as well (alina at iterating.net) so that I can be contacted via this way as well
The wiki guide got a lot of press coverage and everyone in the tech space had only good words about it. But I do agree the user experience could be better. Our target users (the linux users and devs, programmers, IT architects) are reasonably satisfied - we have a couple of thousand daily playing with it - but it could be much better. We do have a new version of design coming up, more compelling and broader in its target, so please do come back in a few weeks and be as merciless in your comments!

PS: a little bit of QA: there is another aspect when I said “I wasn’t able to see anything on the site”. I’m on Mac. This is a video site, and the videos did not load for me: