Answering the question, "How much does a website cost", can be a bit like responding to the question “How long is a piece of string?” It's technically perfectly feasible for a web designer or developer to built a decent looking, fully functional website for a few hundred dollars and still earn a great hourly rate, but it's also very easy to have a project cost thousands.
Obviously, if you're commissioning a website, you won't be happy if it goes over budget, and if it's the fault of the designer or developer, you're quite right to be annoyed, but in my experience, often time and cost overruns are the result of clients not properly preparing. In that case, it is the designer or developer who loses out if they have to spend extra hours without being able to charge.
Building a website should be a great experience for both customers and designers and developers, and should be the start of a long relationship, so to help avoid the pitfalls, I've put together a list of dos and don'ts to make sure things run smoothly and you can get the most out of your budget.
Clearly specify structure, content, and functionality of site. (It's better to overspecify than underspecify)
Identify the site page structure, and the relationship between pages.
If you are specifying colours yourself, they need to be either web hexadecimal eg #334466 or RGBA eg rgba(25,100,55,0). Photoshop and other image editing software can provide colour details in both these formats.
Clearly define who is going to provide what.
Who will write the copy?
Who will provide images?
Who will enter content on the website?
Do you need training as part of the package?
Identify any additional services over and above the website that might need setting up.
Do you need a Facebook page?
Do you need SEO and/or website traffic monitoring?
Do you need integration with an email newsletter such as Mailchimp?
Do you need credit card processing (eg Stripe or Paypal) ?
Provide website assets such as photos, logos, fonts, and copy in a timely manner and in appropriate format.
Photos need to be jpg files with the sRGB colour space, and it's better provide them too large than too small as they can always be reduced, but can't be expanded without loss of quality.
Logos typically should be supplied as PNG or SVG using RGBA (8 bits per channel + transparency or sometimes referred to as 32 bit depending on software) at a minimum of 512x512 pixels, preferably including a square format. (Logos are used to generate an icon for your website to display on a phone screen or desktop browser tab, and these are always square. On your website itself, a rectangular logo is fine, and indeed may well work better, so often it's good to provide two versions of a logo.)
Text Copy should be provided as either Word, Open Document (LibreOffice) or plain text, with formatting limited to headings, paragraph text, bulleted, and numbered lists, and tables – only if you data that must be presented in a tabular format. The text should be checked for spelling and grammar.
If you wish to use fonts other than standard ones such as Arial and Times New Roman, you either need to purchase a license for website use for example from fonts.com, or select free fonts from fonts.google.com You need to specify the exact names, and preferably provide a link, including any license details required to use the fonts if you're using commercial ones.
If your site will include a shopping cart, you'll need to provide a spreadsheet or CSV file of products so that they can easily be imported, if you want to avoid time consuming manual data entry.
If you've organised your own domain name and/or hosting, you need to provide login information so that the website DNS settings can be correctly configured and files uploaded.
If you want your designer or developer to register your domain name for you, you need to provide full legal details of either an organisation or an individual including name, contact email, address and phone.
If you are a sole trader, your domain needs to be registered to you as an individual.
If your website will be for an incorporated society, you need the full legal name of the society.
If your site is for a company, you need to provide the company's legal name (not trading name).
Insist your developer or designer use project management software, and make sure you use it so that you can both keep track of what needs doing and who's responsible. Github is now free for private software projects of an owner and up to three collaborators, and has an excellent issue tracking system.
Make sure you clearly separate each task, so it's easy to close off each task as it's completed, rather than having several things all lumped in together.
Have face to face meetings if you can. Although it's easy to work remotely when it comes to developing websites, there are times where a face to face discussion can often clarify issues due to the immediacy of the conversation, and the ability to follow eye contact compared to emails or chat messages. This is a really good reason why it's worth hiring a local web developer or designer. If you absolutely can't have a face to face meeting, use online meeting software such as Team Viewer so that you can talk and look at the same screen together. Make sure you do follow up by recording what was decided in any discussions.
Allow feature creep. This is the addition of new features or specifications above and beyond the original specification.
Over time it's inevitable that you may want to add features, but you need to clearly identify them as such, and get your developer or designer to provide feedback on any additional costs before proceeding. You can easily identify new features in a project management system like Github, so it's clear they're separate from the original specification.
Provide copy on paper. If you do this, it means it will need to be typed in, which will take time. You designer or developer won't mind doing this, but it's probably an expensive way to use their time.
Keep changing your mind. Even if you don't add features, if you keep asking for changes to colours or fonts over what you originally specified, that takes extra time to change.
Provide images embedded in Word documents. It's not easy to extract images from a Word document in good quality. It's better simply to include some text identifying the name of a file that you've provided separately to indicate where it should be included.
Use Word to provide highly formatted documents. Word is great for doing layout for print, but it is awful for making web pages. It's much harder to copy and paste content from Word to a website, if you've used lots of columns, and things like indents generally don't translate well to the web, as the web has to adapt to screens from TV size down to smartphones.
Rely on phone/Skype/Whatsapp voice conversations for updates to specifications. Conversations can be great to clarify things so that everyone understands what's required, but they're also easily forgotten, so immediately after you've had a conversation, follow it up with either an email, or even better, add a note in the project management system you're using, while it's still fresh in everyone's mind.