How Much Does a Website Cost?

If you've ever been responsible for getting a website built for yourself or your company, then you're probably aware that there is no easy answer to the title question. Reason being, if you approach a selection of agencies (as you should), it will not be unusual for you to receive quotes ranging from AED5k to AED50k to AED500K for the same brief!

The point is, prices can vary massively. It is more or less true that you get what you pay for but still, how do you determine what you should be paying when the range of possible pricing can be so broad? That's what this blog aims to explain and help you with.

In an attempt to answer why the range of prices can be so extensive, we'll look at three main variables that impact the cost.

1. QUALITY - Good work is not cheap and cheap work is not good.
2. METHOD - As the saying goes, “there's more than one way to skin a cat”. Some web development methods are quicker and cheaper than others.
3. AUTHORS - Who is doing the work? Where are they located? e.g. Developers in India will cost less than developers in Dubai.

1. QUALITY

As with most products and services, there are many different levels of quality available for the same function. Think Ford Fiesta versus Aston Martin. They'll both get you from A to B but the quality of the experience will be entirely different. Likewise, websites can also vary significantly in quality; the only problem is that the difference in quality is not always apparent to the layman.

In general, good quality and best practices will take longer and therefore cost more than low-quality mashups. Following are a few things you can look at to help evaluate quality.

Look & Feel

How a website looks and feels is the most straightforward quality parameter for the layman to evaluate. And that is great because the design… the look and feel and simple usability of a website... is one of the most important things to consider.

Good design is what is going to impress and persuade your audience. Good design is what is going to help users find what they are looking for without them getting lost or having to think too much.

Good design will help create that lasting first impression which you only get one chance to make. The design of a site is subjective of course, but most people can tell the difference between good and bad design.

Clean Design

That said, there is research to back up some design claims. For example, research in 2017 by Eyequant has shown that clean designs are associated with significantly lower bounce rates (which is the percentage of visitors to a particular website who navigate away from the site after viewing only one page). The implication of the results is that brands can systematically increase engagement by de-cluttering low-clarity pages on their websites.

Functionality

Another very important consideration is that design is not merely about how something looks. In fact, as Steve Jobs would argue, it is actually more about how something functions, look and feel is secondary. One of our favourite quotes is by the legendary industrial designer Dieter Rams who said;

Design should not dominate things, should not dominate people. It should help people. That's its role.

Responsive Design

There is more to consider than just what you see in the browser on your computer. For example, two websites that may look of equal quality on your desktop may show to be entirely different when you view them on your mobile device. In this day and age, excellent mobile accessibility is crucial. When we build a website, we're not just doing it for one screen like the old days; nowadays we have to consider a plethora of different screen sizes ranging from large desktops to laptops to tablets to mobile phones.

Creating sites that work seamlessly across all these screens takes a lot of know-how and testing. So when you're evaluating the quality of a website, be sure to review it on your mobile also. A good quality website should look great and be easy to use no matter what device you are on. After all, worldwide mobile and tablet internet usage exceeded desktop for the first time back in 2016, and this trend is only increasing.

User Experience

Something else you can look out for with regards to design is the attention to detail, especially to the micro user interactions.

Does the site have a pleasurable user experience with useful messages (e.g. on forms) or by giving subtle feedback cues as you hover over links, click buttons or transition between states? These microinteractions help communicate and guide users. The alternative would be a more dull and static website that feels less intuitive to use and navigate. The thing is, of course, that the more time spent on attention to detail, the more expensive it becomes to build the website.

Take the simple example of a submit button on a form. To place the default form button on a site is very quick, it's literally one line of code:

<button form="formname" type="submit" value="Submit">Submit</button>

The result is plain, but it does the job of submitting the form when a user clicks on it.

Submit

However, the same button can be made to be much more user-friendly by adding a custom design, a rollover effect and an indication that the desired action has been completed successfully once clicked, as per the example below (click it to see).

See the Pen animation submit button by Valentin Galmand (@valentingalmand) on CodePen.

The basic button will take a fraction of the time to implement compared to the advanced button. Now apply this variation in scope to everything else on a website!

Think navigation, page loading effects, form validation, image transitions, pagination, sliders, galleries, tabs etc. The list of variables and variations is endless, and so the cost between two websites that meet the same brief can vary greatly! The click of a button is just a click of a button - but what is the experience?

Now, if you need to build a site as inexpensively as possible, that is totally understandable and there is nothing wrong with doing that. Not everyone has a huge budget to work with, right? So the point we’re trying to make is not that you must build an expensive website but rather that you should be aware of the implications of your choices.

Quality Code

Something that is not obvious to the layman is the quality of the website code (indeed, this can be difficult to assess even for technical people!). Quality code affects many things including speed, security, reliability, speed, accessibility, SEO and speed (did I say that one already?).

It's not easy to assess code quality, but there are some signs that you can look for. One of the easier ones to check is the speed of a site. Poor code is not the only thing that affects speed but it certainly can. So, if a page takes too long to load or render, it may be due to bad quality code. And speed is critical. It has a direct effect on bounce rates and conversion rate (which is the percentage of users who take a desired action). If a page takes too long to load, people will leave.

Even your PageRank (which is a way Google measures the importance of website pages) is affected by page speed as Google will give a higher SEO (Search Engine Optimisation) rating to a fast site over a slow one, everything else being equal.

Here is a resource you can use to see how fast a page is and what may be causing it to slow down.

W3C standards

W3C standards is another indicator of code quality. The reason it is important is that adhering to these standards will ensure that your site will work in all the different browsers that also follow the same standards. The fewer errors or warnings a site has, the better. You can use this link to see how a site is doing in this regard.

SEO

Another code quality indicator is how well a website is optimised for search engines. Work has to be done to make sure search engines can read your site and understand what it is about and what keywords and phrases it should rank for. If you don't optimise a website correctly by applying the right tags and populating them with relevant content, search engines will be left in the dark (so to speak) as they, particularly Google, try to understand your site and present it to the world (which is what you want, right?!).

Unfortunately, this is harder to assess if you have no technical knowledge, but you could use this link to get an idea of what search engines see when they look at your site.

Here's another useful link to check for a number of best practises.

So, as you can see, although it can be quite quick, easy and cheap to create a low-quality website that perhaps looks right in Internet Explorer, it's not so quick, easy and cheap to create a high-quality website that ticks all the accessibility, technology, content, marketing and SEO boxes. To do this requires lots of knowledge, experience and time. And the thing is, it's important to do it properly. Websites are so critical to all businesses these days that you can't afford not to get it right, and the bitter taste of a poor quality website will remain long after the sweetness of a low price is forgotten!

The bitter taste of a poor quality website will remain long after the sweetness of a low price is forgotten.

The problem, of course, is that everyone you approach will say they deliver the best quality (who do you trust?). Your job, really, is to figure out who the Cowboys are (and then avoid them like the plague) and who the serious players are that will genuinely do a good job. Doing this is not easy! You need to use a combination of gut and detective work. Your gut will tell you a lot (it can be a great BS detector) and will guide you to providers you can trust, while your detective skills can be used by doing some digging around agency portfolios and checking references… and reading this blog. 😉

Once you've determined who you can trust, you're still going to get a wide range of prices, and that is mainly because there are so many different ways a website can be built (remember that cat you were about to skin?).

Which leads us to the next price parameter - the METHOD.

2. METHOD

As mentioned already, there's more than one way to make a website. In fact, there are countless ways. Different technologies, different environments, different methodologies or processes, different tools, different programming languages. And so on and so on and so on...

All these different things can be used in conjunction with each other in myriad different ways, with almost endless possible combinations!

To make it easier to understand, the following is an oversimplification of how a website is structured so that we can demonstrate some of the main differences that can have a direct effect on cost.

Front-end / Back-end

To start with, you need to understand that there are two primary "sides" to a website. Call it the “front-end” and the “back-end”.

The front-end is what you see in the browser. The design, content and layout, the colours and pictures and animations, etc. The front-end is usually built using a combination of HTML, CSS and JavaScript.

The back-end, on the other hand, is stuff that happens behind the scenes. For example, there will usually be a Content Management System (CMS) and the code that fetches content from the CMS and sends it to the front-end for display is back-end code.

Back-end code is also used to do calculations, process and submit forms, add data to a database and so on. Back-end code is commonly written in languages such as .NET, PHP, MySQL and other programming languages.

Content Management System

For the sake of this explanation, we'll consider the CMS as part of the back-end even though, in fact, the CMS is sort of like a website on its own. It also has its own front-end and back-end, believe it or not, i.e. the interface you see and log into is the front-end of the CMS. The back-end handles the stuff that goes on in the background as you enter in content and save your website’s edits, for example. But a key thing to keep in mind here is that having a CMS (which is not a requirement) makes it possible for you to manage the content of your website (though not the code) in real time, without having to ask your developer to manage and do every little thing you need doing.

Websites are never really “finished” - they are a constant work in progress, and a CMS is a way of facilitating that ongoing effort. It’s usually more expensive to build a website with a CMS but less expensive to maintain afterwards because you can do a good portion of the content management yourself. Anyway, so now that you know the rough difference between front-end and back-end, let's move on to the different methods of writing this code.

Fully Bespoke

One obvious method to build a website is to create everything new from the ground up. That is, you start with a blank sheet and create an entirely bespoke website according to your exact needs. It’s a great way to create a site because you'll be able to get exactly what you want, but it also takes time and some serious skills and is therefore usually more costly.

The same applies to the CMS by the way. In most cases, we'd use a pre-built CMS and integrate it with your website front-end, but sometimes it's better to build a bespoke CMS for the sole purpose of meeting the needs of that specific site. It all depends on how unique your site is, technically speaking, and it all has implications on cost and the time it takes to build your site.

Framework

To add yet another dimension, we should point out that there's more than one way to write a bespoke website (yes, we’re back to that “skin a cat” thing again). You can literally write everything from scratch, or you can base your code on a “foundation” or “framework” of some kind (e.g. Bootstrap, Node.js, Symfony, Laravel, etc. - you know what those are, right? 😉).

To be honest, if you're going to build from the ground up, it is best practice to do so using a framework. Not only will this save time but it will also standardise the code and make it consistent so that other people, familiar with the same framework, will also be able to work with it.
There are many frameworks to choose from both for the front-end and back-end, each with their pros and cons. Here's a list of the current top ten.

Templates

In many cases, it's not necessary to write bespoke code, and that is because you can use a front-end template to build your website. In the same way that you can use a pre-built CMS and integrate it with your website (or indeed the same way you can use a PowerPoint template instead of starting from scratch), you can also make use of a pre-built front-end template to make up your website interface.

There are a huge number of templates out there to choose from. The key is to find one that best meets your needs and use it to create your website by integrating it into a CMS of your choice. And why would you use a template? Well, because it’s much less expensive to build a website that way! Whether or not you do use a template is determined by the degree of uniqueness you need for your website and, of course, based on your budget. Templates can produce very nice websites and you should not shy away from their use at all, but if you have unique requirements for your site and the budget to match, a template may not be up to the job. 

The challenge with templates is to find one that requires as little customisation as possible because if you change a template enough, it starts to lose its advantage and can end up taking longer, and cost more, than building from the ground up. (Imagine buying a suit or a dress and then trying to modify it to suit your particular needs. At some point, if the number of modifications grows to a large degree, it would have been better to just make the suit or dress from scratch.)

The upside of templates is that the design, layout and front-end coding is largely done. All you're going to do is change the colours a bit, add your logo, enter your content and voila, you have a website. The downside is that you have much less flexibility. If you change the template too much, it will take lots of time to get it right, so instead, you need to compromise on your content to make it fit your template (rather than design a website around your content). And that decision needs to be made at the beginning of the process, not after the project has started.

As you can see, there are already many combinations available. We can build the site and the CMS from the ground up. Or we can build the front-end from the ground up but use a pre-made CMS. Or we can use a template for the front-end and integrate that with a CMS. Each comes with varying degrees of required skills/expertise and time.

FYI, one of the most common and cost-effective ways to build a site is to use a template, make only a few straightforward modifications and integrate it with an off-the-shelf CMS. A good example of such a CMS would be WordPress for which there are hundreds of thousands of templates to choose from.

DIY Website Builders

Yet another way to build a website these days is to use an online DIY (“Do It Yourself”) website builder such as Squarespace or Wix. Some of these tools are pretty awesome.

The beauty of them is that you do not need any technical knowledge to create a website. They come with WYSIWYG (“What You See Is What You Get”) interfaces where you drag and drop components onto the page and build your site like you would a PowerPoint presentation.

These tools are great for brochure type sites without the need for complex functionality. On the other hand, from a web designer’s point of view, they come with a lot of limitations because you may not be able to build exactly what you want. In that way, it's similar to working with a template but with the benefit of organising it more uniquely.

Then there are other tools that are like a middle ground, where you have the flexibility to build almost anything you want but the code is auto-generated for you as you create the site. Webflow falls into this category.

The fact is, there are hundreds of tools out there that will enable one to build a website with varying degrees of flexibility vs limitation.

Languages, Add-ons & Plugins

But wait, there's more! (Yes we know, this is getting a bit tedious now.)

It's worth being aware that besides the different "ways" in which a site can be made, there are also many different technologies available to get them to work. There's the .NET world created by Microsoft. There's the open-source world of PHP or Node.js. There are hundreds of different CMS's out there built on either .NET or PHP or something else. There are plugins out there to help with different aspects of your website. If you need a careers section, for example, it may be possible to interface with your cloud HR solution if you have one; no need to build a careers module for your website. Or perhaps you want to aggregate social media content on your site - there are tools and plugins out there for that too and no need to build it from scratch.

Also, things like website search, online chat, shopping carts, booking engines, etc. can all be provided by third parties, eliminating the need to build from scratch but nevertheless requiring time and skill to integrate them into your final solution.

So, as you can see, the possible methodologies and combinations are almost endless. How do we choose the right one? Well, it's usually a combination of what we know (no one knows EVERYTHING!), what we think is best, how much time you have to get to project completion, and what the budget is. It’s then a matter of figuring out the right solution that ticks as many (if not all) boxes as possible.

One final important point to note is that the creation of a website usually takes a team of people. People with varying levels of experience and skill sets. And this brings us to the third price parameter of building a website - the AUTHORS.

3. AUTHORS

This parameter is the easiest to explain.

“Authors” are the researchers, designers and developers of your site. Simply put, some designers and developers are more expensive than others because of their seniority, personal circumstances, and indeed the company they work for. For example, a developer in Dubai will cost more than a developer of the same calibre in India or similar country because the cost of living in Dubai is so much more. For this reason, many agencies outsource much of their design and development to the likes of India to save on costs and be more competitive.

It's important to be aware, however, of the pros and cons around this. Yes, the cost may be lower but often at the expense of quality and service level. For example, excellent communication is crucial to achieving success in a website project, and when you’re trying to collaborate and communicate with people whose first language is different to yours, whose culture is different, whose work ethic or fundamental norms and values are different, it can hinder the process. Giving feedback remotely, although it is getting easier and easier with modern online collaboration tools, still takes longer and is more open to mistakes and misinterpretations than doing it face-to-face.

Working with remote teams has some other challenges too, such as time zone differences depending on where the remote team is located, reliable internet connectivity issues, management and transparency issues, and so on. There’s no doubt that for some types of projects, it’s quicker and easier and more effective to have all the team players in the same office rather than sitting worlds apart, especially if what you’re attempting to build requires many people of different skills sets relying on and being dependent on each other. But, having said that, for some teams, it doesn't matter if they are in the same room or not. In act, it can be advantageous to sit remotely, but this is a topic for another post.

If you think it's expensive to hire a professional, wait until you hire an amateur!

A more significant way the cost of authors can differ is in their level of experience and professionalism. If you think it's expensive to hire a professional, wait until you hire an amateur! Utilising an amateur will usually result in you having to pay for your website twice, once by the amateur (which you'll end up scrapping) and the second time by a professional. It's better to go with the professional from the outset.

In short, avoid amateurs at all costs and feel free to consider the cost-saving of working with remote teams if you're comfortable with it. A useful guide, in this case, is that if your requirements are not too complicated and are very well-defined, outsourcing may well be for you. If, on the other hand, you're not sure you know what you want and you need to work collaboratively with a team of professionals that have their ideas and initiative, then working face-to-face may be better.

While we're on the subject of people, it's not just the authors of your website you should consider. It's also the customer service you get from the agency you work with that is essential. Excellent customer service is responsive and attends to your needs before you're even aware of them (much of the time!). This will make all the difference in making your website creation experience a pleasurable one rather than a nightmare that never seems to end. And again, you'll remember excellent service long after the price is forgotten.

So, How Much?

Well, as you can see, there's a lot to consider when assessing how much your website will cost. You could argue that it's pretty much impossible to figure out, which is maybe why you're getting such wide-ranging quotes in the first place.

It's worth noting at this point that it's pretty much impossible to guess how long a website will take to build and cost. One, because humans are terrible at estimating how long something will take, and two because things change during a project. You might start off with one technology stack in mind only to discover that it's not going to work and we need to do something else. Web design and development is not an exact science, it's more like art, and arriving at the best solution is more like a journey of discovery than a predictable hardcore fact.

The trick is to figure out the best solution within the constraints of time and budget. One way to do this is to consider the three variables of budget, time and scope.

The rule is that you can have two at the expense of the third.

So for example, if you want it cheap and fast, then the scope will need to be trimmed. Or, if the scope is non-negotiable and budget is limited, then you'll need to compromise on time. On the other hand, if there is nothing to trim off the scope and you need it fast, the budget will need to increase.

Work Out Your Value!

The other way to look at it (and in our opinion the better way) is to figure out what value a good website will bring to you. What is the potential ROI (return on investment)?

If you can, for example, work out that having an effective website will bring in 10 more customers each month at a value of, say, AED5K each, then each month your new site will generate about AED50K of revenue. If your site cost you AED150K, you're looking at having it pay for itself after three months.

This is how you should work out what to spend. i.e. What is the realistic potential impact your website can make and how soon do you need it to pay for itself? Then, once you know this, tell the agencies you're liaising with how much you're willing to commit and let them show you what they can deliver at that price.

This way you take price out of the equation, enabling you to judge agencies on an equal footing based on the quality and relevance of their proposed solutions.

If you like this post and want to read more on the subject, we recommend you check out this post. It comes at the question from a completely different angle using 11 website examples to illustrate key points.