looktouchfeel - Graphic Design in Daventry & Northampton

Web Design Criticism: A How-To

2010-05-19T08:51:00.000-07:00

Original article by D. Keith Robinson

Web design is a relatively young field. It’s youthful, growing and made up of people from all kinds of backgrounds, many of whom lack formal design training. We have learned, and still are learning, as we go.

I came into my first job as a Web designer for Boeing back in the mid-1990s, with no formal design training. I was lucky to get some training on the job, and I would guess that my experience there was similar to that of many who are reading this article. I had the opportunity to work with some very talented and highly experienced designers who all had made the jump from other design fields to the Web.
It was there, as part of that training, that I learned about critiquing, both giving and receiving, through regular design reviews.

Formal Design Reviews = Fun? Maybe not. Educational? Heck, Yeah.

Those reviews weren’t fun. They were difficult and demanding and required quite a bit of effort. However, they were also meant to yield the best possible design work through careful evaluation and constructive criticism. They weren’t inherently negative, but they did focus on what was wrong with a design and what could be improved, rather than what was working—which, to some degree, makes sense. The goal was to improve the quality of work.

Many days I left those reviews feeling like a failure, and some days I felt unnecessarily beat up. But I was often reminded that these reviews weren’t personal and were tough for a reason. In hindsight, I’m glad I had them. They improved the quality of my work immensely and taught me quite a bit about how to evaluate my own work as well as the work of others. Still, I look back and can’t help but pick out problems—not with the process or intent, but with the specific things we used to evaluate our design work.

Almost exclusively, we evaluated the designs based on established visual design principles, many of which are sound and worthy of consideration when evaluating a website design. But, at least in the beginning, we rarely touched on things that went beyond the visual design of the websites and products we were building. I think we could be forgiven that; again, Web design was new then, and we were all learning.

Shortly thereafter, I got involved with the Web design community outside of Boeing (though Boeing had a thriving, diverse and rather large community in its own right), and I began to see how the rest of the world judged design work. It was mostly limited to informal comments in forums and such, again very much “thin-slicing” and focused on snap judgements and gut reactions related to style and visual design. I felt lucky to have what I had: formal, informed, passionate and professional feedback, even if it wasn’t as deep as it should have been.

How We React

This hold true today, more than 10 years later. A person tends to critique a design in one of several ways. The most common, and usually least valuable, is by gut reaction. Gut reaction is valid and can be valuable; in fact; if you look at most established design principles, you’ll see something about emotional connection. On the Web especially, this connection is often formed in an instant. It can and often does develop over time, but the initial reaction should be noted and can be important to the overall success of a design.

Gut reactions often hold little value in a critique because they are not properly articulated. The person giving the critique will reduce their initial reaction to words like “suck,” “awesome,” “like,” “hate,” which does nothing to help the designer improve their design. These kinds of reactions are fine to note, but to be valuable they need to be articulated well. This requires a longer look at the design and a clear understanding of what the designer is looking for.

The most common reason the process breaks down is because it’s hard to follow. It takes time, attention and an understanding of what is being evaluated. Unfortunately, people don’t seem willing or able to go that extra step to make their feedback, whether positive or negative, helpful. They’re more concerned about getting their gut reaction off their chest and moving on. In some cases, they simply don’t have the tools to reflect on and articulate their reaction. A good critique requires time and a grasp of fundamental design principles.

Honestly, why else would a designer fire off a “That sucks” comment? If you’re reviewing a fellow designer’s work, you should feel obligated to make your review as helpful as possible. Those unhelpful comments result more from a lack of understanding than a lack of willingness to put in the effort. To this end, I wanted to see whether established principles exist by which to judge Web design and whether we have guidelines along which to offer critiques. So, I did some research.

As With Most Things, Begin With Research

I began with some extensive research on Web design criticism and critique. I didn’t find much, but a few things are worth sharing. Jason Santa Maria, who is a wonderful designer and a leader in our field, wrote a good article about giving and taking criticism. He has some good advice there, and through his formal schooling he seems to have had a similar experience with criticism and design reviews that I did. He goes into the specifics of critiquing itself, and any designer could benefit from a quick read of it. As well, a few months ago a good post on responding to criticism was posted here on Smashing Magazine. It’s about responding to criticism rather than giving it, but some useful ideas are there.

As interesting as those articles are, I couldn’t find anything on giving critiquing Web designs in particular or on established design principles by which to judge websites and applications. In hindsight, and after many revisions to this article, I’m not all that surprised. Given the broad and multi-disciplinary nature of the Web, the subject is difficult to tackle.

Any Universal Web Design Principles?

Some attempts have been made to define universal principles for Web design, here on Smashing Magazine and over on the much-missed Digital Web, but these (for me at least) are too broad to be readily usable. They’re a good place to start, though, and worth studying.

More helpful would be to dig deeper and look at more specific principles, such as Principles of Design and Jakob Nielsen’s Usability Heuristics. With these, we could begin to dissect a Web design into its component parts and critique each individually. But let’s be realistic: not many will take the time to do that.

Learning the principles of usability, user interface, typography, visual design and so on is something every Web designer should work towards. This understanding will give you some of the language and criteria you need to effectively criticize. The rest is effort.

In addition to my research, I’ve spoken to many other designers about what makes for a useful critique. While one would expect many of the answers that were given, most people believe that it depends largely on engaging with the design and the designer, on having a conversation with them. I’ve noticed a lot of this happening in Dribbble, a great community for designers that’s currently in beta. I have a few invitations, which I’ll give to those with the best comments. Just note in your comment that you’re interested in the Dribbble invitation.

After all this research and reflection, I’ve come to define a good critique as one that takes a gut reaction, applies context and understanding to it, and then communicates that in a constructive, conversational way.

To this end, I’ve formulated some simple rules for judging a Web design.

Some Guidelines For Constructive Web Design Criticism

1. Note Your Gut Reaction, But Take Time to Explore It.
If you can’t articulate your reaction, stop there and keep it to yourself. As I’ve said, gut reactions can be valuable, but we need to explore them. Think of the last time you saw one of your favorite websites after a redesign. You may have liked it or hated it right away, but after using the website for a bit, your opinion (hopefully an intelligent one) became more moderate. Take the latest redesign of Facebook, for example. I was immediately confused. I think I actually typed something to that effect in the search field, which had been moved to where I thought the status update field would be. But I quickly found my way around and was soon comfortable with it. What’s more, the changes made a lot of sense overall. My gut reaction was expected; big changes can be disruptive, but I needed to look more closely to see that these changes were positive.

2. Learn to Articulate Your Observations, and Invite Being Questioned.
A designer should never, ever critique another designer’s work unless they are willing to have a meaningful conversation about it. This is a biggie. Expressing an opinion without offering to talk about it holds little value. You may be passionate about your craft (and your opinion for that matter), but for that passion to have much merit, you need to be willing to have a two-way conversation about it. Off-hand comments, particularly anonymous ones, are unhelpful for a number of reasons, most of which are pretty obvious. The point is simply that if you’re going to form and share an opinion, be willing to go a bit deeper and have a conversation about it.

3. Be Specific, and Offer Suggestions if Appropriate.
This is related to the last point. The more specific you are in praising or knocking a design, the more helpful you critique will be. Use descriptive terminology, speak the language of design, relate your opinion back to established principles. Think of your critique as one side of a debate in which you have to defend your opinion.

4. Always Consider Context and Audience-Appropriateness.
A personal website can be judged on how well it captures the personality of the designer. A mobile-specific website should be evaluated on a mobile device. And so on. This one can be hard, especially if you don’t know the context or audience. That said, avoid critiquing a design without knowing the context going in. Sure, by understanding visual design principles, you can critique just about any design on that level, but that’s usually just scratching the surface—helpful, but not nearly as helpful as it would be if you took the time to go deeper.

5. The Most Important Measure of a UI’s Success Is How Well It Meets Expectations.
I recently wrote about this in depth. The point is that you should judge the utility of a user interface by how well it meets your expectations. Of course, if your expectations are exceeded in some way, that’s great, too, but simply having everything behave as you expect is a good start.

6. Subjectivity Is Fine if Labeled as Such and Articulated Properly.
Following on the point about noting your gut reaction, judging a design subjectively is perfectly fine. Sometimes, even after having taken our time and knowing the context and audience and all that, a design still just doesn’t feel right. As long as you articulate that in a way that makes it clear you’re not sure why you feel that way (and if you accompany it with other helpful remarks), the feedback is probably worth sharing.

7. Don’t Neglect the Content.
Unless you take the time to use the website and to read and absorb the content, your review will likely be superficial. While content doesn’t often fall under the responsibility of the designer, it’s still a big part of the design. Judge a design based on how well it presents the content and facilitates its use or consumption. Of course, here we have one of those “it depends on the website” situations, so context is doubly important.

8. Study the Principles Used to Judge Design, and Learn the Language.
I’ve touched on this quite a bit already. It’s probably the best thing you can do to give better criticism and to become a more educated designer. In order to properly form and articulate an opinion about a design, we need to know the principles and patterns we’re dealing with. And without understanding the language, we can’t easily have a conversation about the quality of the design.

Conclusion
Giving a great critique isn’t rocket science, as long as you take some time and use a proper frame of reference (knowledge, context, criteria) to engage and think critically about the design. So, what do you think? Agree? Disagree? I’d love for readers to weigh in here on what they think makes for a useful Web design critique and share what they think makes a Web design successful. Also, feel free to critique this article… I know I could use it.

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Order your copy of the LTF book of inspiration

2010-02-24T15:26:00.000-08:00

We've released a hardback edition of our inspirational portfolio of branding and web design, from the period 2008 - 2010.

You can order your copy from Blurb.com:

http://www.blurb.com/books/1173008

Looktouchfeel

Design & Marketing

By Ricky O'Neill

Book Preview

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Interview on BBC Radio Northampton - The Twitter School

2010-01-07T06:24:00.001-08:00

Interview on BBC Radio Northampton - The Twitter School

2010-01-07T06:24:00.000-08:00

src="http://www.google.com/reader/ui/3247397568-audio-player.swf?
audioUrl=http://LINK" width="400" height="27"
allowscriptaccess="never" quality="best" bgcolor="#ffffff"
wmode="window" flashvars="playerMode=embedded" />

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

The Twitter School Causes Media Frenzy!

2010-01-06T00:49:00.001-08:00

OK, maybe "Frenzy" was a bit of a manipulative heading... so sue me ;0)

But this week alone The Twitter School has been featured at Towcester News Online, in the Northants Chronicle and tomorrow we'll be interviewed on BBC Radio Northampton.

We've also had a call from ITV Anglia who have expressed interest in bringing the cameras along to our next workshop!

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

A Christmas Carol - by LTF

2009-12-23T02:37:00.001-08:00

Try JibJab Sendables® eCards today!

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

RATM at Xmas #1, John & Traceys Facebook Campaign... what does it all mean for Social Media in 2010 and beyond?

2009-12-21T06:17:00.000-08:00

Whatever you may think of the result of this particular campaign, or indeed its very existence, you cannot deny the implications of it. Not only does it have implications in Social Media, in the Music Industry and Popular Culture, but I believe in all forms of democracy.

And what if this campaign wasn't about getting Rage Against The Machine to Xmas #1, what if it was to "Bring back the death sentence in the UK", or "Vote Mad Raving Luny Party in the next General Election"... and what if it WORKED??

Is this a good thing? Does it mean the people are getting their say?

Lead Singer of Rage Against The Machine, Zack de le Rocha said "this represents the silent majority...". Is that right? Or did people get caught up in it? Did they just want to "stick it to the man"? Or had they all, all 600,000+ of them, been losing sleep over the fact that Simon Cowell's been running the Xmas charts for 5 years in a row?

I think we as a society, and we who represent the world of Social Media, have a duty to discover/learn/investigate this. And determine how best to utilise the power of Social Media for GOOD and not EVIL (I'm not saying Rage are evil, I LOVE RATM, have done for years).

And what of John & Tracey Mortimer...? They were clearly very aware of their social responsibilities during this campaign. They raised a massive £70,000 on their facebook page alone for the homelsess charity, Shelter. And RATM have promised to not only send proceeds from the single sales to a Charity, but also to perform a FREE concert in the UK in 2010. But what if this kind of power, this kind of movement, gets into the wrong hands? Will the public only get behind things they really care about, or will they just get caught up, follow the herd and make huge changes that are not representative of the people's true views?

Also, what about Social Pressure? Because a group exists, does that make the cause ok?

What do you think? This is more of a conversation starter than a blog post... get involved - I'd like to hear your thoughts.

Social Media Consultant, Northampton.

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

WillDan Christmas card

2009-12-16T09:41:00.001-08:00

We recently did this Christmas card for WillDan Systems, as a seasonal promotional product, see a wider range of our print based design at www.looktouchfeel.com

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Phoenix County Metals

2009-12-16T09:38:00.000-08:00

Phoenix County Metals commissioned us to do their website, and here is the result, see www.looktouchfeel.com for more websites like this.

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

House of Hose branding

2009-12-16T09:36:00.000-08:00

We were asked by House of Hose to design their website and establish their brand identity, this is the logo we designed for them. See more branding examples at www.looktouchfeel.com

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Moore Media logo

2009-12-16T09:32:00.001-08:00

This is the logo we designed recently for Moore Media, a wider range of brand identity examples can be seen on our website at www.looktouchfeel.com

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Like Minders leaflet

2009-12-16T09:28:00.001-08:00

Along with their website and branding, we recently designed this DL sized promotional leaflet for Like Minders, see a wider range of our print based design at www.looktouchfeel.com

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

London Hand Therapy website

2009-12-16T09:25:00.001-08:00

As well as their brand identity, we were asked by the London Hand Therapy to design and relaunch their website, see more at www.looktouchfeel.com

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

London Hand Therapy branding

2009-12-16T09:22:00.001-08:00

A full range of our branding and identity work can be seen on our website at www.looktouchfeel.com, this is the logo that we designed recently for the London Hand Therapy.

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Duckling Green Children's Centre

2009-12-16T09:17:00.000-08:00

Duckling Green Children's Centre asked us to do their website recently, please see www.looktouchfeel.com for similar work.

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Beane Valley website

2009-12-16T09:09:00.001-08:00

We were recently commissioned by Beane Valley Children's centre to design their website, and here's the result... for more work like this, visit www.looktouchfeel.com

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Is our company name cool, or stupid?

2009-12-16T05:17:00.001-08:00

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Knowing How Much To Charge

2009-12-03T12:47:00.000-08:00

The most basic thing to establish when it comes to pricing are your hourly and daily rates. I used to get confused about why there were hourly AND daily rates and actually, I still can’t get a sensible answer out of anyone, even people who’ve been Freelancing for decades! The way I view it is My hourly rate is 1 x Y and my Daily Rate is 10 x Y, because I work long hours (and usually if you’re working on a day rate, you might have to travel to and from the place).

Full article on Scrunchp, here:

http://scrunchup.com/issue-3/knowing-how-much-to-charge/

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

A great intro to Web Standards

2009-11-30T14:36:00.000-08:00

From the man that made it happen:

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Superb idea by IKEA's Marketing Team - Facebook Viral Campaign

2009-11-29T14:24:00.000-08:00

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Where does it all go wrong in the feedback process... ..avoiding "McGraphics".

2009-10-30T09:47:00.000-07:00

Something that we hear a lot from fellow designers is that they have lost control of their client, in so far as feedback just keeps coming, sometimes from multiple people, and the designer feels that they are losing money and that the project has gone way off scope.

We used to get this, but over the last couple of years have made changes to avoid it (more on that another time... I thought we had it sussed but Paul Boag gave me a bit of advice which has caused me to try another approach - Rick).

We call this issue, "McGraphics"... McGraphics is where your client becomes )or believes they become) the 'design expert' and begins prescribing how and what you should be doing with the design. They might say, "can we have this part blue, that bit red and make that part circular, please". When this starts to happen, the minute you say "yes, ok no problem", you start to lose control and take a submissive role in the relationship.

The way to retain control of the feedback process is to position yourself as the expert RIGHT AT THE START... remain positive but establish the fact that you are a design expert and explain to the client HOW to provide feedback. It's important that (ideally at the kick-off meeting) you ask the client to focus on the objectives of the project, and leave the design solutions for meeting those objectives, to you.

If you get this wrong, or fall into a submissive role, this is what you get:

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Our approach to Web Accessibility, and a dash of common sense

2009-10-29T15:50:00.000-07:00

Lead Developer at looktouchfeel, Simon McFarlane, explains our "everyday approach" to Web Accessibility.

"We're often asked by clients what we do to ensure Accessibility. Whilst we realise that this is often just to enable a stakeholder to put a tick in a box, it's actually more important than many clients realise. BUT! Let's not get obsessive about it...it's about common sense as much as anything else.

The most important element required to make your site accessible is the use of well structured pages created using XHTML and CSS - the building blocks of your site.

Web users have many specific requirements... almost too many to list. Trying to second guess users wants and needs is very hard, and a bit of a red herring too.

What we typically do is completely separate the style from the content of the site using CSS (Cascading Style Sheets). By using CSS the web user can customise their browser in anyway they wish. For example they can remove all the style, change font size, background colour... all with relative ease.

We ensure the content of the site is well structured using headings, paragraphs and lists... all images have an alternative text description for screen readers. We try where possible to keep the contrast high on text and if it doesn't affect the integrity of the design, we'll use underlines to signify links in the main body text.

Because of the well structured content; screen readers wouldn't have a problem with our sites. Most screen readers are separate programs which you install on your computer. Due to this there isn't much you can do apart from make your site reader friendly - which we have done.

We hide at the top of the screen 'skip to navigation' / 'skip to content' links which are specifically for screen readers to speed up the use of the site.

Internet Explorer 7 / 8, Firefox, Chrome and Opera all allow 'zooming' of site rather than just increasing the font size (Try holding down Ctrl and pressing +). This means everything gets bigger - in many ways this is more useful than simply increasing the font size...

Often we'll add an accessibility page to the site explaining what has been done and a link to the BBC accessibility site... this has lots of information, options and instructions: http://www.bbc.co.uk/accessibility/

For example, all the methods on this page will work with the majority of sites we build: http://www.bbc.co.uk/accessibility/win/sub_root.shtml.

If you'd like to know more about Web Accessibility or our methods for designing and developing websites, just drop us an email (us@looktouchfeel.co.uk) or give us a call (01327 828 443)"

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Should brand/web designers do "Spec work"?

2009-10-28T16:03:00.000-07:00

In a word, No*.

In a few more words...

We're with Paul Boag on this one (and many others) when we firmly throw our hat into the "no spec work" ring. We get asked a lot (usually on web design projects or for tenders) whether we will create some designs free of charge, in order to impress the client and MAYBE get the job.

This request is a silly one for several reasons:

1 - We don't know enough about the project, not having had any time to discuss the brief with you or fact-find about the users or target audiences - so our design will purely be there to make you go "wow", but will be completely useless and get binned the minute you engage us for the project proper. This is a waste of our time (time=money) and your money.

2 - We've been in this game since 1999 - that's a bloody long time and we've learnt a hell of a lot. This is what you, the client, pays us for - our experience and expertise - NOT our ability to use Adobe Illustrator.

3 - Design is a PROCESS - not something you pull out of a hat and go "TA DA!". With Spec Work, there is no process - only razzle dazzle.

4 - We've got other work on, which is signed/paid work - we can't jeopardize that to spend time on design work for nothing, now can we?

5 - We agree strongly with many other PROFESSIONAL designers that Spec Work, and those that agree to it, undermines and undervalues our profession. Positioning design as a commodity, rather than a craft.

So... please don't embarrass both of us by asking us to do Speculative Design work - because, we don't do that. Sorry.

Most people that do ask will usually understand once you explain these reasons, and most will agree to pay for a day or so's consultancy to create a piece of useful design work that they can take forwards.

*OK, OK, OK - if we're talking £50k+ projects, we might consider it, but even then we would strongly suggest that the client simply pays us a few days consultancy so we can carry out a mini design process and create something that will be USEFUL in the subsequent project.

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Launching the new Aspire website...

2009-10-09T04:03:00.000-07:00

As part of a wider re-branding project, LTF carried out a total re-design and re-build of the aspirecompanies.com website. A global site, substantial in size, content and technical features – this was a great project that involved branding, design, photography, copy writing and development.

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Celebratng the Bar Code

2009-10-07T07:46:00.000-07:00

It's the Bar Code's 57th Anniversary today... find out all about it's history, here.

In celebration of this landmark occasion, we have created a "looktouchfeel" barcode:

(You can create your own here - http://www.morovia.com/free-online-barcode-generator/)

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Welcome to looktouchfeel...

2009-10-01T12:51:00.001-07:00

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Blasting the Myth of "The Fold"...

2009-09-09T02:06:00.000-07:00

I loved this article so much I am re-posting it...

by Milissa Tarquini on 2007/07/24 | [55 Comments]
The Above-the-Fold Myth

Ready made Re-Tweet:

Blasting the myth of "the fold" - educating clients to let go of the obsession (just a little bit) - http://bit.ly/13CyXE

FULL ARTICLE...

We are all well aware that web design is not an easy task. There are many variables to consider, some of them technical, some of them human. The technical considerations of designing for the web can (and do) change quite regularly, but the human variables change at a slower rate. Sometimes the human variables change at such a slow rate that we have a hard time believing that it happens.
This is happening right now in web design. There is an astonishing amount of disbelief that the users of web pages have learned to scroll and that they do so regularly. Holding on to this disbelief – this myth that users won’t scroll to see anything below the fold – is doing everyone a great disservice, most of all our users.
First, a definition: The word “fold” means a great many things, even within the discipline of design. The most common use of the term “fold” is perhaps used in reference to newspaper layout. Because of the physical dimensions of the printed page of a broadsheet newspaper, it is folded. The first page of a newspaper is where the “big” stories of the issue are because it is the best possible placement. Readers have to flip the paper over (or unfold it) to see what else is in the issue, therefore there is a chance that someone will miss it. In web design, the term “fold” means the line beyond which a user must scroll to see more contents of a page (if it exists) after the page displays within their browser. It is also referred to as a “scroll-line.”
Screen performance data and new research indicate that users will scroll to find information and items below the fold. There are established design best practices to ensure that users recognize when a fold exists and that content extends below it1. Yet during requirements gathering for design projects designers are inundated with requests to cram as much information above the fold as possible, which complicates the information design. Why does the myth continue, when we have documented evidence that the fold really doesn’t matter in certain contexts?

Once upon a time, page-level vertical scrolling was not permitted on AOL. Articles, lists and other content that would have to scroll were presented in scrolling text fields or list boxes, which our users easily used. Our pages, which used proprietary technology, were designed to fit inside a client application, and the strictest of guidelines ensured that the application desktop itself did not scroll. The content pages floated in the center of the application interface and were too far removed from the scrollbar location for users to notice if a scrollbar appeared. Even if the page appeared to be cut off, as current best practices dictate, it proved to be such an unusual experience to our users that they assumed that the application was “broken.” We had to instill incredible discipline in all areas of the organization that produced these pages – content creation, design and development – to make sure our content fit on these little pages.

AOL client application with desktop scrollbar activated

As AOL moved away from our proprietary screen technology to an open web experience, we enjoyed the luxury of designing longer (and wider) pages. Remaining sensitive to the issues of scrolling from our history, we developed and employed practices for designing around folds:

We chose as target screen resolutions those used by the majority of our users.
We identified where the fold would fall in different browsers, and noted the range of pixels that would be in the fold “zone.”
We made sure that images and text appeared “broken” or cut off at the fold for the majority of our users (based on common screen resolutions and browsers).
We kept the overall page height to no more than 3 screens.

But even given our new larger page sizes, we were still presented with long lists of items to be placed above the fold – lists impossible to accommodate. There were just too many things for the limited amount of vertical space.
For example, for advertising to be considered valuable and saleable, a certain percentage of it must appear above the 1024×768 fold. Branding must be above the fold. Navigation must be above the fold – or at least the beginning of the list of navigational choices. (If the list is well organized and displayed appropriately, scanning the list should help bring users down the page.) Big content (the primary content of the site) should begin above the fold. Some marketing folks believe that the actual number of data points and links above the fold is a strategic differentiator critical to business success. Considering the limited vertical real estate available and the desire for multiple ad units and functionality described above, an open design becomes impossible.

And why? Because people think users don’t scroll. Jakob Nielsen wrote about the growing acceptance and understanding of scrolling in 19972, yet 10 years later we are still hearing that users don’t scroll.
Research debunking this myth is starting to pop up, and a great example of this is the report available on ClickTale.com3. In it, the researchers used their proprietary tracking software to measure the activity of 120,000 pages. Their research gives data on the vertical height of the page and the point to which a user scrolls. In the study, they found that 76% of users scrolled and that a good portion of them scrolled all the way to the bottom, despite the height of the screen. Even the longest of web pages were scrolled to the bottom. One thing the study does not capture is how much time is spent at the bottom of the page, so the argument can be made that users might just scan it and not pay much attention to any content placed there.

This is where things get interesting.

I took a look at performance data for some AOL sites and found that items at the bottom of pages are being widely used. Perhaps the best example of this is the popular celebrity gossip website TMZ.com. The most clicked on item on the TMZ homepage is the link at the very bottom of the page that takes users to the next page. Note that the TMZ homepage is often over 15000 pixels long – which supports the ClickTale research that scrolling behavior is independent of screen height. Users are so engaged in the content of this site that they are following it down the page until they get to the “next page” link.
Maybe it’s not fair to use a celebrity gossip site as an example. After all, we’re not all designing around such tantalizing guilty-pleasure content as the downfall of beautiful people. So, let’s look at some drier content.
For example, take AOL News Daily Pulse. You’ll notice the poll at the bottom of the page – the vote counts are well over 300,000 each. This means that not only did folks scroll over 2000 pixels to the bottom of the page, they actually took the time to answer a poll while they were there. Hundreds of thousands of people taking a poll at the bottom of a page can easily be called a success.

AOL News Daily Pulse with 10×7 fold line and vote count

But, you may argue, these pages are both in blog format. Perhaps blogs encourage scrolling more than other types of pages. I’m not convinced, since blog format is of the “newest content on top” variety, but it may be true. However, looking at pages that are not in blog format, we see the same trend. On the AOL Money & Finance homepage, users find and use the modules for recent quotes and their personalized portfolios even when these modules are placed well beneath the 1024×768 fold.

Another example within AOL Money & Finance is a photo gallery entitled Top Tax Tips. Despite the fact that the gallery is almost 2500 pixels down the page, this gallery generates between 200,000 and 400,000 page views depending on promotion of the Taxes page.

It is clear that where a given item falls in relation to the fold is becoming less important. Users are scrolling to see what they want, and finding it. The key is the content – if it is compelling, users will follow where it leads.

When does the fold matter?

The most basic rule of thumb is that for every site the user should be able to understand what your site is about by the information presented to them above the fold. If they have to scroll to even discover what the site is, its success is unlikely.
Functionality that is essential to business strategy should remain (or at least begin) above the fold. For example, if your business success is dependent on users finding a particular thing (movie theaters, for example) then the widget to allow that action should certainly be above the fold.

Screen height and folds matter for applications, especially rapid-fire applications where users input variables and change the display of information. The input and output should be in very close proximity. Getting stock quotes is an example: a user may want to get four or five quotes in sequence, so it is imperative that the input field and the basic quote information display remain above the fold for each symbol entered. Imagine the frustration at having to scroll to find the input field for each quote you wanted.

Where IS the fold?

Here is perhaps the biggest problem of all. The design method of cutting-off images or text only works if you know where the fold is. There is a lot of information out there about how dispersed the location of fold line actually is. Again, a very clear picture of this problem is shown on ClickTale. In the same study of page scrolling, fold locations of viewed screens were captured, based on screen resolution and browser used. It’s a sad, sad thing, but the single highest concentration of fold location (at around 600 pixels) for users accounted for less than 10% of the distribution. This pixel-height corresponds with a screen resolution of 1024×768. Browser applications take away varying amounts of vertical real estate for their interfaces (toolbars, address fields, etc). Each browser has a slightly different size, so not all visitors running a resolution of 1024×768 will have a fold that appears in the same spot. In the ClickTale study, the three highest fold locations were 570, 590 and 600 pixels—apparently from different browsers running on 1024×768 screens. But the overall distribution of fold locations for the entire study was so varied that even these three sizes together only account for less than 26% of visits. What does all this mean? If you pick one pixel location on which to base the location of the fold when designing your screens, the best-case scenario is that you’ll get the fold line exactly right for only 10% of your visitors.
So what do we do now?

Stop worrying about the fold. Don’t throw your best practices out the window, but stop cramming stuff above a certain pixel point. You’re not helping anyone. Open up your designs and give your users some visual breathing room. If your content is compelling enough your users will read it to the end.
Advertisers currently want their ads above the fold, and it will be a while before that tide turns. But it’s very clear that the rest of the page can be just as valuable – perhaps more valuable – to contextual advertising. Personally, I’d want my ad to be right at the bottom of the TMZpage, forget the top.

The biggest lesson to be learned here is that if you use visual cues (such as cut-off images and text) and compelling content, users will scroll to see all of it. The next great frontier in web page design has to be bottom of the page. You’ve done your job and the user scrolled all the way to the bottom of the page because they were so engaged with your content. Now what? Is a footer really all we can offer them? If we know we’ve got them there, why not give them something to do next? Something contextual, a natural next step in your site, or something with which to interact (such as a poll) would be welcome and, most importantly, used.

References

1 Jared Spool UIE Brain Sparks, August 2, 2006:Utilizing the Cut-off Look to Encourage Users To Scroll

2 Jakob Nielsen’s Alertbox, December 1, 1997: Changes in Web Usability Since 1994

3 ClickTale’s Research Blog, December 23, 2006: Unfolding the Fold

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Interview on BBC Radio Northampton - What's Your Story?

2009-08-27T07:45:00.001-07:00

Joe Pignatellio kindly raised awareness today about the What's Your Story website conceived, designed and developed by looktouchfeel as part of our marketing consultancy services to JR Press.

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Get yourself down to the HAKAMOU bar/restaurant

2009-08-19T01:15:00.000-07:00

We've been working with the guys at HAKAMOU - a funky new "Easter Island" themed bar/restaurant in Northampton...

We designed their website for them, developed by the lovely Esme at Site Simplicity, who is "on the team" at Hakamou. And we've just delivered them these funky fresh menus too:

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

What's Your Story? Fantastic local business campaign...

2009-08-14T00:00:00.000-07:00

FOR IMMEDIATE RELEASE

Contact:
Doreen Ashmore
JR Press
01327 301 566
Doreen@jrpress.co.uk
www.jrpress.co.uk

Local businesses overcoming downturn by sharing ideas and positive thinking

Daventry, Northamptonshire, 14^th August 2009

Local businesses in Daventry and the surrounding areas are sharing their marketing ideas, and stories of success, during the downturn thanks to a new website called “What’s Your Story?”. The website, launched on August 14^th, will showcase submissions from local business owners, explaining how they have used marketing to counteract any decline in sales.

The website’s aim is to generate a “feel good” factor among local businesses and to create a valuable resource for businesses owners looking for inspirational marketing ideas. The campaign, “What’s Your Story?”, is the brain child of Doreen Ashmore, Sales & Marketing Manager for JR Press, a successfull Printing company in Daventry. Doreen has high hopes for local businesses in 2009; “Everyday we are speaking to clients and hearing very positive things. We wanted to share these stories and collect more, so that we can spread this positivity and fight the downturn together”.

Stories already submitted include that of DNG Dove Naish, a local chartered accountancy. Victoria New wanted to share their strategy; “We have increased our marketing activity generally and have re-assessed our client care standards in the process by making recommendations where extra services could provide savings and add efficiency”.

To read (?) the stories, or to submit your own, visit the What’s Your Story website at www.jrpress.co.uk/yourstory

For additional information or a sample copy, Contact:

Doreen Ashmore
JR Press
01327 301 566
Doreen@jrpress.co.uk
www.jrpress.co.uk

JR Press, a printing company in Daventry – established 1984.

# # #

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Seeking a talented young graphic/web designer

2009-07-28T14:18:00.000-07:00

I'm looking for a talented young graphic and web designer who is looking to boost their

experience and portfolio by working alongside a freelance consultant (yes, me) on everything

from re-brands to web designs, social media marketing to animation. Are you this person? Do

you know them? Will someone you know, know them? (you get the idea...) - Please put them

in touch with me via www.looktouchfeel.com

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

AllTranz Branding

2009-07-09T05:24:00.000-07:00

New pics from AllTranz - the branding we created for them has been applied to all of their vans and trucks. ;0)

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

The most unique internet video competition ever?

2009-05-27T16:20:00.000-07:00

The most unique internet video competition ever?

We’re working with a 300 year old cereal company based in Crewe, Cheshire. Mornflake is the 8th oldest company in Britain handed down over 14 generations. As a company, it epitomises probity, fiscal responsibility and social conscience and has rejected every offer of being acquired in all this time. Kind of values we want to see in all companies right now, right?

Problem is; few people have heard of Mornflake, although anyone who eats porridge is likely to have eaten their cereals. Mornflake already supplies most of the major supermarkets’ own label oats based cereal foods and is re-launching its own brand of cereal foods.

Since TV advertising is no longer the default way of creating widespread awareness of a new brand, we’re organising a very different kind of video competition for Mornflake. Our approach differs in three unique ways;

1. We’re asking people to make videos about themselves. So lots of good material there! More specifically, videos about their values. The Mornflake brand must feature in the video but in a product placement kind of way. We’re not looking for cheesy reasons why people should eat Mornflake oats. The best video creator will win a cash prize of £15,000.

2. We’re conducting the competition on Facebook using an application called Uvizz (check out the video on their home page – truly impressive). Uvizz works in a way that financially rewards video creators and video viewers for spreading video around their personal networks.

3. We’re adopting an open source approach to engaging online communities and have commissioned a network of independent thinkers called Minciu Sodas. They are building a directory of online communities in the UK and starting conversations with people in an open, respectful and authentic way. A way that reflects Mornflake’s values. This data will be made available to any other organisation that wants to learn how to engage these communities and will help those communities be found by other people.

The competition will launch in mid-June. The exact date will be announced soon but you can still register here and we promise to let you know when it all starts. The basic entry rules are here.

Posted at 11:31 PM in Advertising, Competition, Film, Mornflake, Social Software, Twitter, Video | Permalink

Technorati Tags: authentic, brand, cereal, competition, facebook, minciu,mornflake, morningfoods, oats, rules, rules, sodas, ugc, UK, uvizz, values,video

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Interview with Graphic Shack

2009-03-31T23:17:00.000-07:00

Just completed my interview with @TheGraphicShack over at http://www.thegraphicshack.com/?p=135

Very enjoyable and looking forward to more ;0)

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

Connect with me ;0)

2009-03-27T16:56:00.000-07:00

I have current profiles with the following social and business networks, please connect with me:

You can see my graphic and web design work at the following online portfolio sites:

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

E-Cards a go go!

2008-12-06T13:10:00.000-08:00

I've been busy this week...

With the Credit Crunch in full swing, I thought clients would avoid pricey printing of Xmas Cards and so decided to offer an e-card design service to my existing clients. The uptake really shocked me and has kept me busy all week!

Here are just a couple that I've done for both Amery Capital and for Eastside Consulting.

Tis the season to have a niche and to offer specific services to make it easy for clients to say yes ;0)

Graphic and Web Design in Daventry and Northampton from Look, Touch & Feel Design

New Testimonials In!

2008-11-27T14:58:00.000-08:00

"We wanted something original and slightly off centre for our website , not the norm in our industry –and it certainly is just that ! "

Gary Barnes

WillDan Systems Ltd.

looktouchfeel designed and built a brochure site for WillDan Systems on a CMS. In addition we created their brand identity and continue to support them with marketing collateral.

________

"I found the service was excellent as you understood my requirements from the start and tailored the website to match perfectly. Overall I am very pleased with our new website and found dealing with yourselves a stress free experience!!!!"

Carl Locke-Edmunds

Locke Distribution Ltd.

looktouchfeel designed and built a brochure site for Locke Distribution on a CMS.

Daventry Web Design

2008-11-27T14:17:00.001-08:00

LTF is pleased to announce it's new Daventry based web design service: www.daventrywebdesign.com

Please also check out our Daventry web design specific page on Google too: http://ricky.oneill.googlepages.com/daventrywebdesign

2008-10-27T10:23:00.000-07:00

looktouchfeel launches "Floortographs"! Watch this space for more info!

See here - www.floortographs.com

Locke Dist Launches!

2008-09-28T11:25:00.000-07:00

We are proud to announce the launch of http://www.lockedist.co.uk/

DoooDolls Babies!!

2008-09-28T11:23:00.000-07:00

They're back, in baby form!! Dooodoll Babies.

ipods, babies, the NHS and arcade machines!

2008-05-29T13:07:00.000-07:00

Hi guys!

This is just another irregular update from looktouchfeel to let you know what we've been working on, what's new and what's coming up... don't forget to keep track of recent projects at our blogsite.

iPods
looktouchfeel has been trading now for several years on word of mouth alone, and until now has only really "recognised" that by saying thank you and occassionally buying people dinner. Well, I've now decided that for every referral you make that leads to a successful project - I will get you something nice, like an iPod with your name on it for example. So go on, tell all your friends about us, or suggest we contact someone who is in need of graphics or web design services - and you might just end up with a nice little bonus.

Baby now fully cooked

Saffron, my long suffering partner, is now "full term" - so as previously mentioned, soon as the little blighter is hatched, I will disappear for two weeks to learn how to be a dad.

NHS Intranet design

looktouchfeel was fortunate enough to be commissioned by its largest client yet - The NHS (The World's 2nd largest employer, behind the Indian Army). We were brough into an existing web overhaul project to design a new intranet system for their Primary Care Trusts. Here's a preview:

Retro arcade magic - Arcadeum

Last time I told you about our side project - http://www.themillproject.com/, which is now fully up and running and ready to take bookings for management teams looking for a getaway. But, ever the enthusiastic entrepreneur - I've already setup my 2nd "side project", this time selling classic retro arcade machines for the home or office. You remember the ones...the tabletop machines that used to play "Pacman" or "Asteroids"...? Well, now they are back! But this time they have Hi Res monitors and come with over 1000 games! The website is still in development (I know, the irony! But have you ever been to a builders house? They are always half finished!). But have a look at the units below and check out our branding...if you want to pre-order one, just drop me an email.

That's all folks, see you on the other side!

Dooodolls.co.uk relaunched

2008-04-30T12:00:00.001-07:00

Long time client, Retail Products - EU distributor for the Dooodolls, has engaged looktouchfeel to completely re-design and re-build the EU/UK Dooodolls website. Now featuring a ton of new sections and downloads, check it out at www.dooodolls.co.uk

Advertising work for Retail Profile

2008-04-30T11:55:00.000-07:00

Long-time client, Retail Profile, along with the recent re-branding work, has engaged looktouchfeel to design a series of adverts for retail magazines.

themillproject.com - Coming Soon!

2008-04-30T11:53:00.000-07:00

Watch this space! We will soon be launching our new project - themillproject.com

A strategic retreat for management teams of between 8 and 12 in the heart of England.

Local advertising

2008-04-30T11:48:00.000-07:00

You may well have seen our recent advert in the Village Emporium Magazine, if you happen to be in the Midlands!

Youngs Tree Surgery

2008-03-30T10:27:00.000-07:00

looktouchfeel was engaged by Youngs Tree Services of Oxford to create a new brand identity and design and build their new website at http://youngstreeservices.com/

Rebrand of Retail Profile

2008-03-30T10:19:00.000-07:00

Long time looktouchfeel client Retail Profile, has recently gone through a rebranding exercise. Part of this work was undertaken by looktouchfeel to design and create the rebranded website at retailprofile.com

WillDan.co.uk IT & Networking Suppliers

2008-03-30T10:15:00.000-07:00

looktouchfeel has been engaged by WillDan to re-brand the company and design and build the brand new website - WillDan.co.uk We will be going live very shortly!

Braunston Mill Country Retreats

2008-03-30T10:12:00.000-07:00

looktouchfeel is pleased to announce the launch of two new sites... Braunston Mill & Cottage and Braunston Mill Country Retreats.

Eco Chic

2008-02-26T09:41:00.001-08:00

looktouchfeel is delighted to have been engaged by the Brighton based EcoChic. A supplier of beautiful, ethical and fair trade products.

We've been working with ClearBytes to develop the branding and a fresh new identity...

Dooodolls 15 minutes of fame!

2007-12-11T16:09:00.001-08:00

Those crazy plush toys, the Dooodolls were at the Comedy Awards last week! Check out these celebs meeting their Dooodolls for the first time!

Announcing the Dooodolls!

2007-11-27T06:15:00.000-08:00

It gives me great pleasure to announce that the website for Dooodolls in the EU is now live.

Dooodolls the latest in Plush Toy Trends from Retail Products Ltd.

My dooodoll keyring has arrived! :-)

2007-11-15T05:21:00.001-08:00

Niffler at work!

2007-11-06T08:54:00.001-08:00

The Monstarz

2007-10-28T15:56:00.000-07:00

Attack of the Dooodolls!

2007-10-18T04:19:00.000-07:00

We're currently working on a very exciting project! A client of ours (Retailprofile.com) have obtained the rights to sell and distribute "Dooodolls" in the EU. We have been engaged to create the UK website, and to create various pieces of marketing collateral.

Here is what the site will look like, its an online shop predominently, which we are incorporating into a CMS and using Google Checkout for payment processing.

Its gonna rock.

Welcome

2007-07-08T07:57:00.001-07:00

looktouchfeel design is now open for business...