We’re forever hearing the phrase ‘make it pixel perfect’. It is a phrase which I have throughout my career retorted with a blunt NO. For me those who are still trying to force designers to be pedantically accurate over a box being 1px left or right, or a font being ever so slightly too big or too small are the type of middle management or clients who have been around a long time but have not had their foot on the gas or a toe anywhere near the peddle for well over 5 years.
There is no such thing as a pixel anymore, it is not a single unit of measurement the way it was meant to be or even worked prior to the HD revolution. Apple have completely changed the resolution playing field with the Retina display providing screens with double density pixels.
Last week at CES, the playground got even bigger and harder to work towards as almost every manufacturer on display showed off their latest displays; introducing the ULTRA HD revolution. These new 4K displays; capable of delivering twice as much horizontal and vertical resolution than your current 1080p display, albeit out of everyone bar the rich and famous’s price range right now (Samsung’s flagship display comes in at 95″ and approximately $12,000) will be the standard within 18 months at the longest.
To make the situation graver, this is only one of the two formats which comprise the UHD revolution with Red One, manufacturers of the leading HD Video recorder used on many high budget movies are already working on the production of an 8K camera!
In stark contrast, emerging markets like India and certain territories in Africa are going online predominantly through mobile handsets, these themselves vary in dimension and quality with a mixture between low-budget introductory phones from the likes of HTC, whilst Nokia spent a great deal of time researching these countries to bring out their range of Asha devices, some with keyboards, some with touch screens some with both. The landscape is vast.
With all this in mind, how can it be possible to create a pixel perfect design and in turn a pixel perfect website?
Where we are today
Today many agencies and designers are getting their heads around how to adapt their design process and many are failing. The ones which are struggling, over quoting, under quoting, under valuing their teams are those that are still building sites in a production line. These are the scenarios where cost on a project is being worked out by how many pages need to be designed in Photoshop for the client to sign off on. Even when designing at a page template level it’s wrong.
Many have shifted to the idea of producing work that is more reminiscent of mood boards in the shape of style tiles. I endorse this concept but it still doesn’t give us a visual reality to work towards.
The problem is all down to context. With a few carefully chosen words we can fix this. What if instead of designing a ‘pixel perfect’ site we create a visual representation of the site in a specific environment. For example, here is how Site A will look on a 15″ Macbook with standard display in Chrome.
Now we have something that is tangible and provides us with a working goal. It doesn’t solve the issue of what does it look like in Internet Explorer 7, or on the iPad, but we do have something to work towards.
Paul Lloyd, a front-end developer at Brighton User Experience Consultants Clearleft wrote a series for netmag.com on his methods behind designing a responsive site in a week in which he works towards two design files for a page layout, a desktop and a mobile scamp. Paul then says he works on the middle ground of the layout during development where it can be clearly seen what happens in certain scenarios.
I believe this is the best way of working right now and I do believe in still using a graphical editor to create visual representations of the site. There are always going to be team members and clients who need to see how something is going to look before they want to feel it, this will never change, however using these documents as the absolutely be all and end all of everything that is output at the end is just folly.