I decided to write this article after I was recently asked to re-design a website using a design and layout from a graphic designer. A lovely design but quite a frustrating experience, as I felt I was being constantly negative, when I had to explain that certain things weren't always compatible, and it wasn't as simple as simply uploading the design.

FOR THE BENEFIT OF THIS ARTICLE - WD = Web Designer & GD = Graphic Designer

Graphic design includes logos and print design. It includes everything that you see that has been created and printed (or displayed as part of a layout). This can be adverts, magazines, newspaper layouts, billboards, logos, brochures, books, decals you find on toys, CD labels & booklets, movie posters, and loads more. It covers all things in the print world. And it's not just the layout that is created by GDs. They create "graphics," such as the photos you see in magazines - a GD had most likely altered it after the photographer took the shot.

Web design overlaps graphic design in the graphics and overall appearance (layout) and flow of the site/pages, but web design also includes all the technical aspects of creating a website, such as the coding.

In print, a GD will try to get the audience to stay on a page long enough to get a marketing message across. There is often a limited area in which to achieve this, such as a one-page magazine ad. In some cases, they need to catch their attention and make them want to investigate more into the product, ie. with a book cover or the first page of a brochure. The benefit of print design is that it is a physical product; so physical properties such as texture and shape can help you achieve your design goals.

Although both web design and graphic design use images, text, and typeface to create the desired method of communicating ideas, designing for web and print are two very different practices. GDs have been around since print media was created, while WDs came into being only recently, when the Internet was developed. It is important to understand the differences between web design and graphic design.

The truth of the matter is a WD and a GD are two different beasts.

A WD needs to understand the Internet and the technology behind a website - how certain things will have to work in a web environment. How to make things look good AND make sure it is still functional and usable. And most WDs can code at least rudimentary HTML.

Often WDs get frustrated because a GD will give them a design, which is probably not feasible. When GDs are designing a site for the web, they can’t just create a beautiful picture and expect it to work. There are many elements, including accessibility, browsers, colours, user experience, etc that a good WD will know. They need to know about responsive design, screen resolutions, functionalities, and many other things that a GD might not be aware of. They have to pay attention to the site architecture, info flow, navigation, user experience and layout and graphics. A website can’t afford to lose visitors because the basic functions aren’t working.

Website design walks a fine line between having a great design and having a great design that no one will see because it loads too slowly or cannot be indexed by search engines. There are many "tricks" that WDs employ to overcome these obstacles and still have a great looking layout. However, many of these are hidden from GDs because they don't know the programming that is going on behind the scenes, resulting in extra "bloated" code and increased download sizes.

There are numerous GDs out there who really know their stuff when it comes to print design, brochure layout, and Pantone Matching System (PMS). However, not all GDs are good WDs. Web design is a totally different medium where the "paper size" (the screen resolution) changes for every viewer, colours don't cost extra, fonts are limited to a select handful, and extra images might mean losing customers.

We need to work together, respect each other’s strength and expertise, and be willing to adapt our ideas to produce the best result for the client.