Introduction
In 2020, it’s hard to find a web designer that doesn’t have a basic understanding of HTML and CSS, or a web developer that can’t put a decent wireframe together.
If you’re strictly looking at the general outline of each role, however, the distinction becomes more clear.
Let’s take a look at the differences between web design and web development and what you may need for your next project.
Web Design
Web design covers everything that you see on a website, including its visual aesthetics and overall usability.
This is also known as the user interface and user experience (UI / UX) design.
Key areas include:
- Wireframes and mock-ups
- Branding
- Color palettes
- Typography
- Layout/format
- Graphic design
Web design is entirely focused on a site's visual appearance and less concerned with the systems and code used to make it all work.
Web design brings a digital experience to life through the use of color, imagery, typography, and layout.
That being said, many web designers are able to use HTML and CSS as it helps with their designs and can allow them to bring a mock-up to life when necessary.
Web designers often work with platforms like
WordPress or
Shopify to create websites for their clients.
These content management systems allow them to create websites without writing a single line of code, while allowing the client to manage their website easily.
Web Development
Web development involves every line of code that makes a website work, from the front-end design code (HTML / CSS) to the back-end server code (PHP / Java).
The front-end code is responsible for displaying the website to the user, a designer creates the mock-ups and a front-end developer makes it work on a website.
The back-end code is in charge of managing the database and serving that data to be displayed on the front-end.
Key areas include:
- HTML, CSS and JavaScript (front-end)
- PHP, Java, and Python (back-end)
- CSS preprocessors (i.e. LESS or Sass)
- Frameworks, Libraries, and Git
Front-end web developers rarely create mock-ups or choose color palettes, these are provided by the web designer.
It’s a developer’s job to bring those mock-ups and designs to life.
That being said, understanding the designer’s intentions requires some knowledge of UI / UX best practices.
Freelance vs Agency
As you can see there is a lot of crossover between web designers, front-end developers, and back-end developers. It’s common to find an individual who claims to cover all three areas, but often within a team you’ll find people specializing in each specific area.
A freelancer will often use platforms like WordPress, Shopify, or
Squarespace to streamline their work and allow them to deliver projects as quickly as agencies.
Most web design projects with an agency include a project manager, graphic designer, web designer, front-end developer, and a back-end developer or that can scale all the way down to simply a project manager and a web designer depending on a project’s specific needs.
A project manager works closely with the client and the rest of the team throughout development, a graphic designer works on branding and logo design, the web designer puts together website wireframes and mock-ups, the front-end developer implements those designs on the website while the back-end developer makes everything work behind the scenes.
I hope you found this post insightful.