Web Design vs. Web Development: Two Different Jobs

Intro

Web design is the plan and the interior design of your site. Web development is the construction. Your website needs both, plus upkeep once you have the keys.

Maybe your site was put together from a template a few years ago, and it doesn’t feel like you anymore. Maybe you had it generated with AI, and now it needs to connect to your CRM. Or you’ve received two quotes for a new site, and they’re so far apart you wonder if
they’re even talking about the same thing.

Often, the request comes down to: “We just need someone to do our website.”

In reality, “doing a website” is several jobs that follow each other in a very specific order.

And once you understand that order, quotes get a lot easier to compare.

Our programmer Bobby, who has been coding since 2012, has a simple way of explaining it: a website is like a house. You wouldn’t ask the contractor to put up the walls before the architect has drawn the plans. And you wouldn’t ask the architect to pick your light fixtures.

Web design and web development are not the same job.

UX, UI, wireframes: we’ll use a few big words, but they mean fairly simple things.

The plan: strategy and user experience

For Bobby, everything starts here: “A product needs to be well-managed and well-laid out for it to have impact.”

So the first step is strategy: who the site is for, what it needs to accomplish for your business, and what frustrates your customers today when they’re looking for information.

This is where you’re most useful, because nobody knows your customers better than you do.

Then comes user experience, UX. “UX is when an architect does the blueprint,” Bobby explains. “There’s going to be a wall here. There’s going to be a garage here.” These are the wireframes: which pages you need, in what order, what goes where on each page. For example, on the search page, we can show the most searched terms so your customers don’t even have to type them.

It’s the easiest step to skip, and the most expensive one when you do.

The interior: user interface design

Once the plan is approved, we move on to the interface, the UI. To use Bobby’s image, this is where the interior designer comes in: colours, typography, images, and animations. It’s where your brand comes to life on screen.

We build these mockups so you see your site page by page before a single line of code is written. Adding a room or moving the garage to the other side of the house is a lot simpler at the planning stage. The same goes for a website: an online store, a client portal or online booking is best planned from the start, while the blueprint is still being drawn.

The construction: web development

A mockup, however beautiful, isn’t a website yet. You can’t put it on the internet and tell people to go navigate it. Bobby’s job is to convert it into a working one. As he puts it: “Everything that’s functional that isn’t visual but that makes it work is what I do.” In the house, these are the studs, the subfloor and the roof: the things you don’t see, but that hold everything else up.

For you, that means:

• A site that adapts to every screen, from desktop to phone;
• A site that loads fast;
• Forms that actually get your customers’ requests to you;
• A solid technical base so people can find you on Google;
• An editor you can use to update your text and post news without calling anyone, and without breaking anything.

Then comes the launch. In the house, that’s the day you get the keys.

Pre-fab or custom

Every website is made of code. When you download a template, the programming already exists; someone else just did it. And that same template has been downloaded by hundreds of thousands of people. It wasn’t designed with your brand in mind.

For a small, simple site, a good template adapted to your brand can be enough, and we’ll tell you so. No need to reinvent everything.

But as Bobby puts it: “You can buy a pre-fab house, it’s going to do the job. But if you want that floating fireplace in the middle of the living room, you won’t get that with pre-fab.”

Custom work becomes necessary when your site needs to do more: send every request straight into your CRM, trigger something in your business tools, or match your brand down to the pixel. Our own site is a good example. The animated intro text, the blinking eyes, the graphic in the footer: none of it came from a template.

When steps get skipped

Some projects are set up to start, finish and get paid as fast as possible. That works for the provider, rarely for the client.

The sites Bobby fixes most these days fall into two groups.

First, sites generated with AI without a developer’s eye on them. They look fine at launch. But the day you want to evolve, connect your CRM or automate something, the site can’t keep up. It’s stuck in time.

Second, sites put together with a page builder and a hundred plugins to make basic things work. Each plugin updates on its own schedule, often every week, and one day an update breaks something else. With a custom-built site, WordPress can stay updated while your
code base stays the same.

If that sounds familiar, you’re far from the only ones. “I fix that every week,” Bobby says. And he doesn’t blame anyone: it’s natural to want to be autonomous and build your own site. Often, that’s even how a relationship starts. Bobby becomes, in his words, “basically
the web department.” We fix it first. Then we build the right site, together.

After you get the keys

A house needs upkeep. In the fall, you clean the gutters. You repaint the walls. And a house built in 1970 probably doesn’t look anything like it did back then.

“A website is the same thing,” Bobby says. Security patches and performance updates now come out almost every day. And your business evolves: you add sections, pages, content. You can’t just launch a site and cross your fingers.

When you plan your budget, plan for upkeep, not just the build. We go into more detail in our article on WordPress maintenance.

Before you sign

If you’re comparing quotes, three questions will help you see whether everyone’s talking about the same house:

1. Who handles the strategy and the plan of the site before the design?
2. Will the site be custom-developed, or built from a template or a page builder?
3. Who takes care of upkeep after launch?

If a quote doesn’t answer all three, ask. A good team will be happy to talk about it.

How we work at Grafico

Every web project at Grafico follows the same order: strategy, UX, UI, then development. That’s how we made our own site. Bobby built the strategy, with the personas and the site structure, along with the first wireframes. Juline and Orlando reworked them and did the design, animations included. Then it all came back to Bobby, who coded it. Because everyone works together from the start, nobody gets handed the project at the end and left guessing how a page should behave on mobile.

And because we also handle your branding and packaging, your website doesn’t become a separate project. It’s part of the same brand.
So the real question isn’t “Who’s going to do our website?” It’s:

“What does our website need to accomplish for the business?”

Let’s talk