What is the difference between web developers and web designers

Published: Apr 18, 2015 by C.S. Rhymes

To some people, the differences in these two roles are obvious. A developer is the one that makes the code and the designer is the one that decides how it will look. But in my experience it is not as simple as it may appear.

Developer and Designer

Web Designers

Traditionally web designers would do a lot of their work in programs such as Illustrator or Photoshop, creating images of how they think the page should be laid out, working on elements such as navigation, font styles and colours. This is then handed over to the developer to make the page.

Previously, I would not have classed myself as a designer. I think this was mainly due to my lack of confidence in my design skills, thinking that no one would like my work. I would let someone else tell me how it should look.

Web Developers

When people ask what I do I tend to reply with the term web developer, as opposed to web designer. I’m not really sure why this is? Maybe I think it is easier to explain what I do. Maybe it’s because I think it sounds more technical. I think it’s because I have always classed myself as a programmer, the one that just concentrates on making things work and not worrying about how it looks. That can be done after it’s all working, right?

User Experience

The more I learn about web development, the more I have begun to realise that how someone thinks a page works is just as important as how it actually works. If you have used a website a lot before then you know your way around it and you know it’s navigation method and it’s quirks. The first time you use a website, you have to learn how it works and how to navigate from one page to another.

This has made me think a lot more about the User Experience aspects of web development. You have to keep asking how can I make this easier to use, how can I make it more obvious and how can I make this quicker for the user.

Prototyping

A lot of this work is done whilst drawing out wireframes and creating page prototypes in html and css to help me answer these questions. This is where my design skills are used, rather than a traditional design phase where images are created and handed over to a developer to code. Prototyping has allowed me to gain design skills, without the need to learn photoshop, whilst also improving my knowledge of front end development, such as html, css and javascript.

So what is the difference between the roles?

Basically, I don’t think there should be two roles anymore. I think that web design is an essential skill for a developer and vice versa. User Experience and User Interface Design is now such a massive part of web development it all merges together.

Basically, I don’t think there should be two roles anymore.

This is an opportunity for people that used to class themselves as designers to be able to learn to code and gives the developers a chance to learn more about design and prototyping. This is a good thing.

The real winners are the general public, getting better designed and easier to use websites.

Job titles

So the next time someone asks me what I do, I might call myself a ‘Full-Stack Developer’ as according to Creative Bloq:

“A full-stack developer typically means someone who is expected to be able to perform the roles of web designer, web developer and elements of UI and UX design too.”

The issue with Full-Stack developer is that it’s not particularly catchy. How about Web Experience Engineer & Designer or WEED for short?

Share

Latest Posts

Mocking window.location in Jest
Mocking window.location in Jest

Recently I had to write some tests for a piece of JavaScript code that used window.location. This left me trying to figure out how to mock the window.location so that I could pass in dummy data and ensure that the data I got back was what was expected. Here was how I managed to solve the issue.

Considerations for Incremental Static Regeneration in Next.js
Considerations for Incremental Static Regeneration in Next.js

Next.js offers a feature called Incremental Static Regeneration (ISR) that allows you to generate a static page when the page is first visited, rather than generating a static copy at build time. This is a really handy feature as it allows you to reduce your build time, but still benefit from having a cache of a page generated so future visitors will have a faster response time.

Mocking axios in Jest tests with Typescript
Mocking axios in Jest tests with Typescript

Recently I wanted to write a test for a React component that uses axios to retrieve information from an API. To do this I had to mock jest, but I ran into some issues with the types as I was using typescript. This article explains how I managed to get it to work.

How NOT to make a website

How NOT to make a Website

By C.S. Rhymes

From £8.99

Nigel's Intranet Adventure

Nigel's Intranet Adventure

By C.S. Rhymes

From £2.69