Get A Quote
back

A very common misconception out there is if a person is a graphic designer, they can effectively design websites without any further training. The truth is, while similar in concept, the actual mechanics of graphic design and web design are very different. While it's true that many graphic designers evolve in to very competent web-designers, the transition is not at all automatic or without extensive learning of the various web-standards and coding conventions.

A Picture Is Worth A Thousand Kilobytes

Ok, fair enough, a web designer and graphic designer's fundamental role is the same. A web designer developing a layout concept for a website uses a lot of the same theory and concept that a graphic designer might use in designing a logo or brochure. In a rudimentary description of roles, both a web-designer and graphic designer make something look appealing. Of course that's an incredibly simple, almost insulting summation of what they do, their job is much more involving, but for the purpose of this discussion it will do. The question isn't who can design a website to look nicer, that largely rests with the individual doing the job. I've seen graphic designers who can make a concept (a picture) of a website look very nice. The difference comes into play when the website progresses past the ‘picture' concept, and the actual website development begins.

I'll Show You My Page Source, If You Show Me Yours...

Whenever a resume comes in for a web-design position at our firm, one of the first things I do when looking at the prospective designer's portfolio is take a peak at the page source, the coding, of the various sites they have done. I can always tell if someone is a good web-designer by their page source. You can view the page source of a website by right clicking on the page, and selecting the View Source item from the menu that pops up. Of course to the untrained eye, it probably looks all the same, but anyone who has developed a few websites can immediately see the difference:

  • Inline Styling : The designer uses the HTML document to define the style/appearance of the site instead of using a separate stylesheet (CSS). Honestly a lot of old school web designers still do this, but graphic designers trying to develop a website will amost always do this. I personally won't hire a web-designer for our team unless they adhere to styling the document with a separate style sheet file for everything other than very minor touch-up styling/positioning.
  • Images used to define layout : This is a tell tale sign of a graphic designer trying to make a website. The graphic designer makes a nice pretty layout in a program like Photoshop, and then uses the very handy “Export as HTML” feature which makes a nice HTML page out of the picture. Literally, the page is a collection of pictures sliced up from the image the designer made. The resulting page is a repugnant collection of malformed HTML tags, and a hideous arrangement of slow loading images. Most web developers get irritated even thinking about these types of websites.
  • Pages Are Not Hand-Coded: The designer uses a web-development tool like Dreamweaver to visually place HTML elements on the page, and lets the tool make the HTML for them. I know plenty of good web designers who use tools like this, but more often than not a good web designer will hand code their HTML pages because they want total control of the document structure. Moreover, they realize that the generated code from ‘drag & drop' web-design is bloated and inefficient compared to lean hand coded HTML.
  • Site Is Developed In Flash: This is somewhat of a touchy one, as some of the Flash Zealots out there will vehemently disagree with me that in most cases, a website 100% done in Flash is a mistake. Don't get me wrong, Flash is a great addition to sites, especially for adding visual appeal to certain components of a site, but developing the whole site in Flash can greatly reduce your potential user base. Search engine placement is difficult to achieve with Flash sites, as is the long term maintenance and updating of the website. That said, developing in Flash is a lot easier than trying to figure out HTML. Again, the ‘drag & drop' crowd really gravitates to a tool that will abstract them from having to worry about developing efficient code.
  • Pages Load Slow: This is typically a result of all the points above resulting in the pages loading very slowly. I have been involved with website reworks that brought page load times down from a ridiculously long 15 seconds to less than 1 second, all from optimizing the page code. The page looked exactly the same when we were finished, it just loaded about 15 times faster! Images for layout and bloated, auto-generated, code from web design tools are usually the main culprits here.

The list above is really just a brief overview of some of the potential issues that arise when a graphic designer tries to fill the role of a web designer. Really, I just touched on issues with ‘brochure' websites, or websites that exist to present static information, as these are really the only types of sites that graphic designers attempt to do. Typically a graphic designer will shy away from attempting a website that requires any type of dynamic content or server-side integration such as an e-commerce website or database applications. While web designers are not responsible for programming tasks such as ecommerce or database integration, they are typically comfortable working with the programmer to strike the correct balance between visual appeal and user friendliness.

Be An Informed Client

The irony of web development is that it's very likely that the customer, the person paying for the web development, won't think about the above points until they have paid for the website and notice all the issues after. It's paramount to look at your prospective web designer / web developer's portfolio before you agree to let them do the work for you. Be sure to look through their on-line portfolio sites, keeping in mind some of the points listed above, and don't be afraid to ask them about some of the points. A potential client asking me "Hey, do you hand-code your pages?" shows me that the client has done some homework, a sign of an informed buyer. You really want to be informed when developing a website, as it can save you a lot of frustration, not to mention money, when you research a little before hand to ensure you hire the right company. Hopefully this article will help you to become an informed client!