Why you shouldn’t hire a graphic designer to design your website
You’d be forgiven for thinking that graphic designers are the same thing as web designers. They both use the same tools and output creative work. A structural engineer and a 3D animator also use the same tools and output creative work, but you wouldn’t hire a 3D animator to design your bridge. Just as you wouldn’t hire a structural engineer to work on the next Pixar movie.
In reality, graphic designers and web designers are like chalk and cheese. In this article I’m going to shed some light on the differences to show you how important it is, and highlight some of the issues we’ve encountered when working on websites designed by graphic designers.
To be clear; I’m not trying to vilify graphic designers or say they have less talent. They have a specific skillset that works for their objectives. But the focus of this article is to look at the skills needed for a web designer and why a graphic designer wouldn’t be suitable.
Before We Begin
For this article to make sense, it’s important for you to understand the specific roles involved in designing and developing a website.
Often Web Designers and Web Developers are confused, but that’s for a different article! Just keep in mind that a Web Designer creates the visual representation of the website, whilst the Web Developer is responsible for converting it into code to be presented on-screen when you load the page. It is not recommended that you use a Web Developer to do the design work, just as it is not recommended that you use a Graphic Designer to do it.
Technical Expertise
Let’s start by looking at the technicalities that graphic and web designers need to take into consideration. Both graphic and web designers need to create visually impressive creative output that conveys a specific message to the viewer. They use similar tools such as Photoshop and Illustrator as well. But that’s where the similarities end.
The Graphic Designer Skillset A graphic designer’s creative work is output as printed flyers, cards, or billboards. The graphic designer needs to consider (to name but a few):
- Dots-per-inch
- Bleed
- Pantone or CMYK colour
- Dimensions (in traditional cm/inch units)
- Black & white vs. limited colours vs. full colour
- Colour matching (screen to print output)
- Paper type (matt or glossy)
Incidentally, none of these elements are considerations for web designers.
The Web Designer’s Skillset Web designers have an altogether different list of considerations, such as (click to read more about these web design facets):
- Pixels-per-inch
- Dimensions (in pixels)
- User Experience
- User Journey
- Responsive Design (different screen sizes for different devices)
- RGB colour (and how it changes screen-to-screen)
- Interactive Elements
- Compression of assets (to ensure fast-loading websites)
- Browser Compatibility
- Technical Limitations
- Animation & effects
- Navigation
- Web-friendly fonts
- Vector vs bitmap
Why the differences matter
How is the design used? People don’t ‘use’ printed artwork. Therefore graphic designers don’t need to consider how a user uses their design. The consequence is often a website which looks amazing but doesn’t help users navigate to what they’re looking for. This means that fewer people will use the site for its intended purpose (such as generating leads) which could result in lost business.
How is the design displayed? Digital devices come in a hugely diverse array of widths, heights and resolutions. Graphic designers don’t need to consider this because their output is always printed on the same printer at the same size.
If a graphic designer were to design a website, you’d probably find that it looks great on one device, but falls apart on all the others. Alternatively, it places a huge burden on the web developers to re-work the design so that it is cross- compatible.
What you see is not what you get Designers are used to the fact that what they design looks exactly the same when printed, no matter who sees it. A web designer doesn’t have that luxury; so they need to make conscious design decisions to ensure that although it doesn’t look the identical, it still looks amazing, it’s still easy to use, and all of the content is still readable, no matter what device is displaying it.
To make matters worse, screens now also come in different resolutions. For example, newer mobile phones now squeeze more pixels into the same space. Whilst this greatly improves the visual quality on the phones, if a site uses an image that wasn’t designed for the higher resolutions, they appear blurry and pixelated instead. What this means is that web designers now have to export their assets in two different variants; one low resolution for fast loading and one high resolution for the newer screens.
Why can’t I show this article to a Graphic Designer and hope for the best?
Keep in mind that graphic designers have distinct workflows and different technical knowledge to web designers. A web designer habitually designs elements for scalability and/or flexibility, they understand innately how content will collapse or spread depending on the device being used. They save their output in a way that creates the perfect balance between size and quality; so that their sites look great but don’t take an age to load.
If you ask a Graphic Designer to do this, you’re expecting them to un-learn what they’ve always done and re-learn a new skill. That inevitably takes a lot of extra time and mistakes, which I doubt you want happening on your project.
Real-life examples
Over the years I’ve worked with plenty of graphic designers on web projects. The experience has never been smooth (hence why I’m writing this article). Here are a few of the issues that I inevitably encountered.
Designs were approved in print The designer printed out all of the pages for the client to view which were then approved for development. Subsequently the colours were in CMYK format (not RGB as is required for screens), the dimensions were for print (and so had to be scaled down for screen), and of course printed designs are not flexible. When the designs were converted into a flexible and interactive website, the client objected because it was not like what they’d seen on the paper.
Designs were presented in PDF and approved In a different project, the client viewed the designs at 150% magnification because PDF automatically stretched the view to fit the screen. We weren’t aware of this at the time, and our developers developed the website at 100% zoom. When the completed website was presented to the client, they said it was far too small. The client subsequently requested that the site be made larger, which resulted in re-developing the entire site at substantial cost.
Zero User Experience Although the designs for the website were very high quality, the designer did not consider the implications of using the website. Subsequently, it was only once the site was developed that the client realised how it could be used. To improve the user experience, we had to re-design and re-develop a lot of the website, and the outcome was still far worse than had we designed it for web in the first place.
Designs were created in Illustrator Although Illustrator has had a few upgrades to streamline conversion to web, we still find huge issues. This is because Illustrator is not pixel-perfect. It’s designed for centimetres and inches, so when a design is provided to us in those units, it makes it very difficult to extract the graphics in pixels. What we often have to do is re-create the design in Photoshop, which allows us the pixel-perfect precision. Again, the re-design work adds unnecessary cost to the client.
Sound Familiar?
If you have ever worked on a web project where a graphic designer was involved, you may have experienced some or all of these issues. The above examples are illustrative of specific issues that can arise. In fact, most of the time more than one of those issues have occurred per project.
Table of Differences
To conclude, I’ve put together a table which outlines the differences between the two skillsets. Good luck with your next web project. Be sure to hire a Web Designer and let me know how you get on!
If you would like an award-winning website that generates ROI for your business, then contact Grow. Give them a call now on
04 456 0220 or email:
we-can-help@grow.ae.
Grow is an award winning Digital Agency specialising in deploying psychologically optimised digital marketing solutions that generate high ROI for its clients.
