What is the difference between web design and web development?
Website design is the planning and visual side: what pages exist, what goes on each one, how a visitor moves from the homepage to an enquiry, and how it looks on a phone. Website development is the build: code, a content management system, a database, forms that deliver messages and a server that serves pages quickly.
Put simply, design answers "what should this be?" and development answers "how do we make it work, reliably, for everyone who opens it?"
For a Bangkok business owner the practical point is simple. If a quote lists only design, you may receive mockups and no live site. If it lists only development, someone else is expected to supply the layouts. Most small and mid-sized companies need both, delivered by one team that is accountable for the result. That is how our website development service is set up, and the rest of this page explains each half so you can read any quote with confidence.
A note on scope: this page compares two roles you might pay for. If you want a plain-language tour of browsers, servers and code, read web development explained for beginners instead.
Design and development compared
The table below puts the two disciplines side by side on the points that matter when you compare quotes. Read the "deliverables" row closely: it is the easiest way to see what a supplier will actually hand over.
| Web design | Web development | |
|---|---|---|
| Main question | What should visitors see and do? | How does the site work, load and stay secure? |
| Focus | User experience, layout, visual style, content structure | Front end code, back end, CMS, integrations, hosting setup |
| Typical deliverables | Sitemap, wireframes, mockups, style guide | Working theme, database, forms, language versions, live deployment |
| Common tools | Figma, sketches, content outlines | WordPress, Shopify, WooCommerce, HTML, CSS, JavaScript, PHP |
| Skills | Visual hierarchy, typography, usability, copy layout | Programming, performance, security, testing, server setup |
| When it is done | Layouts are approved | The site is live and working on real devices |
| Cost driver | Number of unique page layouts and revision rounds | Features, integrations, languages and content volume |
What is website development?
Website development is everything needed to take an approved design and make it a real, working website. It splits into four parts.
Front end
The front end is what runs in the visitor's browser: the HTML that structures a page, the CSS that styles it and the JavaScript that handles menus, sliders or a form that checks a phone number before sending. Good front end work is why a site stays readable on a cheap Android phone on 4G, which is how a large share of Thai visitors will first see you.
Back end
The back end runs on the server. It stores your pages, products and enquiries in a database, sends form messages to your inbox, and decides what to show each visitor. On an online store it also handles carts, stock and order records.
Content management system
A CMS such as WordPress lets your staff change text, add blog posts or update prices without calling a developer. We build a custom WordPress theme rather than stacking a page builder on top, which keeps pages lighter and edits simpler. For stores, Shopify or WooCommerce plays the same role.
Integrations and launch
Integrations connect the site to the tools you already use: WhatsApp and LINE buttons, booking or enquiry flows, PromptPay and card payments, Thai courier rates from Thailand Post, KEX Express (formerly Kerry Express) or Flash Express, and e-Tax invoice setup on e-commerce builds. Development also covers the English and Thai language versions, PDPA cookie consent wired to your forms, testing, and the move to your live domain. If you are wondering how long website design and build take in practice, most of the calendar time sits here.
What web design covers
Web design is often mistaken for "making it pretty". The visual layer matters, but most of the value is decided earlier, in structure and user experience.
- Content structure. Which pages you need, what each one is for, and which question it answers. A clinic may need separate treatment pages; a small cafe may need four pages in total.
- User experience (UX). The path from arriving to acting. Where the WhatsApp button sits, how many taps it takes to reach a booking form, whether a Thai visitor can switch language without losing their place.
- Layout and wireframes. Grey-box plans of each page type that fix the order of sections before any colour is chosen.
- Visual design. Typography, colour, spacing and imagery. Thai script needs fonts and line heights chosen for it, not a Latin font with Thai as an afterthought.
The output of design is a set of decisions and files: a sitemap, wireframes, mockups for desktop and mobile, and a small style guide. None of those is a website yet. Some designers now build directly in visual tools, and if you are weighing that route, our comparison of WordPress and Webflow for web design covers the trade-offs.
A strong design phase starts with a clear brief. Our website project questionnaire and brief template lists the questions we ask before any layout is drawn, and filling it in saves a revision round later.
How they fit together in a project
In a well-run project design and development overlap rather than hand off once. A typical sequence looks like this:
- Brief and sitemap. Goals, audience, languages, pages. The developer should already be in the room, because a booking flow or product catalogue changes what the design must allow for.
- Wireframes. The designer lays out page types; the developer flags anything costly to build or slow to load.
- Mockups and approval. You review the look on desktop and mobile and sign off.
- Build. The theme is coded, the CMS set up, content loaded, forms and integrations connected.
- Test and launch. Real phones, both languages, form delivery, consent banner, page speed, then the switch to your domain.
Problems start when the two halves are bought from different people who never talk. The designer draws a layout that looks great in Figma but needs heavy scripts; the developer simplifies it without asking; you end up with neither the design you approved nor a fast site. The same risk applies to a website redesign, where an existing site's content and URLs also have to survive the change.
Scope matters too. A single campaign page needs lighter design and almost no back end, while a full company site needs both in depth; our comparison of a website vs landing page explains where that line falls.
Who to hire
Hire for the half you are missing. If you already have a developer, a designer is enough; if you have approved designs, hire a developer. For most businesses one team doing both is simplest, with one contact and one timeline. Compare quotes on what they cover, because some stop at mockups.
Why quotes split them
Suppliers price design by the number of unique layouts and revision rounds, and development by features, integrations, languages and content volume. A five-page brochure site is light on both. A bilingual site with a booking flow, or a store taking PromptPay and shipping with J&T, is heavier on development. When one quote looks cheap, check whether it covers the build and launch or stops at mockups.
Matching the hire to the job
- A freelance designer suits you if you already have a developer, or only need a new look for an existing platform.
- A freelance developer suits you if you have approved designs and need them built.
- One team doing both suits most businesses: one point of contact, one timeline, and nobody to blame but the supplier if the site does not match the design.
- Doing it yourself on a hosted builder is possible for very simple needs; our guide to choosing a DIY builder or a designer covers when that works.
Our packages include both halves. Starter, from THB 10,000, covers up to five custom-designed pages on WordPress, mobile-first, with contact, WhatsApp and LINE buttons, on-page SEO and PDPA cookie consent. Business, from THB 30,000, covers up to 15 pages in English and Thai with two revision rounds, a custom WordPress theme, and forms, booking or enquiry flows. Prices are indicative and one-time; the final figure is set in your written quote. You can compare the details of website design cost by package, or send us your brief by WhatsApp or call on +66 93 004 4098.
Related reading
Sources
Builds and ranks the websites: the systems behind the 17 client sites whose Search Console numbers we publish. This guide was written by the Website Development Bangkok team. More about us