Web Design Estimator

Get a ballpark estimate of your website needs.

{math_result} hrs
(2.5 hrs/pg)
{math_result} hrs
plus additional time if there are many pages
{math_result} hrs
4/ New Site Launch & Verifications
Normally 2 hours, plus 1 hour additional if it's a brand new site
{math_result} hrs

Correspondence & Misc (2 hrs)
It's safe to add approx. 2 hours additional time to handle time taken for correspondence, odds and ends, etc.
2.0 hrs

Total Estimate
Total Estimated Hours & Cost
{math_result} hrs
= ${math_result}
Based on hourly rate (adjust if a rate was quoted to you). Our hourly rate is normally $50.

Note: this is an estimator only, and is not an official cost quote.

Hopefully, this page will help you get a ballpark figure of what your website needs may cost, as well as in-depth info on what steps and work go into each stage.
Have a headset? Here’s a demo song I wrote and produced (I played all the instruments using midi, but hired a singer). Might give you an idea of the thought and creativity I put into my work.


Steps & Stages

Click on any section below to expand it for more detailed info

The Setup stage involves getting the foundation of the site in place, as well as setting up helper applications.

Preparation

  • Choose a suitable domain name(s)
  • Ask the client to find some sample sites they like
  • Get whatever source info &  images will be needed (including logo, business info, social urls, store photos, etc).

Site Foundation

  • Set up a temporary domain and hosting for the site construction
  • research theme libraries to get a list of themes that would provide a good starting point for the site (look and feel). Select one to use. (see Theme Collections list below)

Install:

  • WordPress
  • chosen theme
  • common plugins (see list below)
  • any specialized plugins required
  • setup domain based admin email address to use as main contact for external helpers and seo work.

External Helpers

These are free accounts and online apps that work hand in hand with the website. For more in depth info on them, see the detailed section External Helpers and Apps below. They include:

  • Lastpass: password keeper
  • Google account: gmail address, map api key, analytics key, recaptcha key, and search console

Configuration

  • WordPress settings
  • Plugin setup: All in One Seo, WPS Hide Login, Updraft Backups (link to Google Drive), Easy Updates, Admin Menu Editor, Admin Toolbar, plus any specialized plugins requiring configuration
  • Theme preferences: sitewide defaults for font families & sizes, menu types, colour schemes, etc.
  • Site preferences: type of error messages for contact forms, action bar info, max. logo size, mobile preferences, etc.

Base Pages, Menus and Elements

  • Setup page structure (eg., Home, Services, Location, etc). Add/remove pages from base theme as needed.
  • Set initial navigation menus (will be refined later)
  • Create web-ready version of logo
  • Set and create the site’s favicon.ico (the icon that appears in the web browser tab)

2½ Hours per page is an average approximation. The home page usually takes more, and some of the internal pages may take less. Here are some parts of what goes into crafting a visually appealing page that Google also likes:

  • written portions: ensuring they…
    •  have good flow
    • are easy to read
    • follow good design layout principles.
  • images:
    • saving in .png format only when needed
    • balancing jpg file size and photo quality, using proper source sizes.
    • Finding any needed suitable icons and images online, preferably free ones.
    • Cropping and enhancing images as needed in Photoshop.
  • logo:
    • does the website version have smooth edges and high quality?
    • Would a shadow effect, or outer glow help it stand out more?
    • If it’s too small to use effectively with a normal top-based menu, what’s the best menu type alternative?

Once the site is pretty well complete (but not yet “live”), it’s time to take it out for a test drive, and take care of adjustments and tweaks. A lot of testing is already done as each page is being developed, but there are sitewide checks that also need to be carried out, such as:

  • Proper Screen size scaling and content re-positioning: on smaller laptop screens, tablets, and smartphones. Make sure each type of page looks great on all main screen sizes. Check for excessive scrolling on smartphones.
  • Cross Browser compatibility: is the site’s appearance and functionality consistent in different web browsers, such as Internet Explorer, Firefox, Chrome, Safari (Apple), etc?
  • Mixture of variety and consistency: it helps to get the right balance, and to help make it easy for the user to find the info they want, without needing to go through hoops or excessive learning curves.
  • Get Outside Opinions: invite friends and acquaintances to take some test runs through the site, and give their honest feedback and suggestions. There’s no substitute for real world input.

Once the client gives the go ahead to move the development site to the actual domain – and become “live” – a number of steps need to be taken, and checklists marked off.

Transfer to Permanent Webhost

  • If there’s no existing website, or there’s good reasons to switch to another webhost, a new hosting account is set up.
  • If needed, the domain’s DNS entries are configured to point to the site’s permanent hosting account.
  • Any needed configuration is carried out for the webhost account
  • The Duplicator plugin is used to make a complete zipped copy of all the website files and database, along with an installer script.
  • The zip copy is uploaded to the destination server.
  • The installer script is run, setting up all the website files and database on the server. If bugs occur, the causes are identified and fixed, or the duplication is carried out manually if needed.
  • Settings that weren’t transferred by the Duplicator are copied to the new installation.
  • Some image links may require manual updates, so that they no longer point to the development site.

Once Transfer is Done….

  • Any helper apps (Goole recaptcha, for eg.) that used the development domain when they were set up, are updated with the new domain info.
  • Any needed redirections are set up and tested (if page structure changed from a previous website)
  • Tests are done to ensure the www.domainname.com version of the domain redirects to the plain domainname.com
  • The login url is changed to a secure one, and recorded in lastpass.

Reference Info

More detailed “under the hood” info

Here are some of the theme libraries I currently own licensing for. They provide over 500 sample sites to use as a foundation for a customized solution, with a large variety of layouts, design elements, and page flows.

Plugins add specialized capabilities beyond the basic WordPress framework. Plugins I normally install on a website include:

Perfomance

  • WP Smush: optimizes image sizes to reduce page loading times
  • WP Fastest Cache: caches pages to reduce page loading times

Design/Content

  • TinyMCE Advanced: greatly enhances the capabilities of the native WordPress text editor.
  • Content Blocks (Custom Post Widget): provides an easier way of building blocks of content to include in a page.
  • Duplicate Post: lets me clone an existing page, to cut down on the time needed to build a new page.
  • Media Library Assistant: adds extra capabilities to organize/manage items in the site’s media library. Helps simplify organization of images.
  • All In One SEO Pack: a terrific tool for improving ranking in Google and other search engines. Generates sitemaps and provides lots of customizable options to maximize online visibility and search engine ranking.
  • Contact Form 7: a tool that simplifies the job of making great looking/performing contact forms
  • Private content: provides a way to make content visible only to logged-in admins/editors (used to hide the internal Site Manual from normal users)
  • Nav Menu Roles: similar to Private Content plugin, it can be used to hide Menu items from normal users
  • Redirection: a tool to set up permanent redirects from any urls that no longer exists, when upgrading from an old site. Prevents those urls from going “dead”
  • WP Data Tables: provides a way to create custom database tables; used to store list of directory listings, including login info and notes.

Security

  • Wordfence Security: adds extra security features to the site to protect against hackers; creates reports about attempted intrusion attempts.
  • WPS Hide Login: hides the login page from hacking attempts.
  • Email Address Encoder: cloaks email addresses in the site, so that they are visible to people, but not to spam bots.

Admin Dashboard

Backup

  • UpdraftPlus: provides a way to have backups automatically created (scheduled) and stored in the cloud. Provides an easy way to recover the site in case of hack or other calamity.
  • Flamingo: stores a backup copy of each contact form submission.

Utility

  • Easy Updates Manager: takes care of automatically updating plugins, and installing minor WordPress updates.
  • File Manager: provides access to site files from within Admin Dashboard. Lets you perform many types of file/folder actions.
  • ManageWP: provides a way for a webmaster to monitor the health, and needed updates of websites from a remote dashboard.

A website with special requirements will often need one or more additional plugins to accomplish its goals. Each of the following have been selected as best performers over competing plugins that do similar jobs (sometimes after extensive testing of alternatives):

  • FooGallery: helps organize & display photos in gallery format.
  • FooBox Image Lightbox: lets a user view a larger size of a photo in an overlay.
  • Force Regenerate Thumbnails: companion utility for photo galleries, ecommerce and portfolios. Used to resize thumbnail photos in bulk if needed.
  • Woocommerce: the most widely used ecommerce platform for WordPress. Has tons of additional plugins that extend its capabilities.
  • Simple Facebook Plugin: integrates a business’s Facebook feed inside a webpage.
  • WP-SpamShield: blocks spam comment submissions, if public commenting on pasts has been enabled.

There are also a number of other specialized plugins, such as Event Calendars, Forums, Social Networks, Membership, Donations, Auction, Classifieds, Dining Menus, Lot Plans and more. The WordPress community literally has 100,000’s of plugins developed for the platform, for almost any unique needs.

These are free accounts and online apps that work hand in hand with the website, including:

  • Google account:
    • gmail address: if client already doesn’t have one. Needed to log into the other Google helper apps.
    • analytics key: a code placed into the website’s pages, to provide pageview & user stats for the site. Analytics is a terrific tool to help you get a handle on your website’s performance.
    • recaptcha key: you’ve likely seen many “I am not a robot” checkmark boxesthe bottom of many contact forms. Each site needs a secret key to use the recaptcha service.
    • search console: provides reports on how often your site showed up in results for various key phrases, and how often people clicked through to your site. Extremely valuable in developing keyword strategies to improve your site’s traffic

The Extra Mile

Anyone that’s watched Holmes on Holmes knows that 2 houses that appear to haveidentical quality on the outside, can have VERY different stories inside. Read more

Cloak EmailEmail harvesters scour the web looking inside the code of webpages, to see if they can find a tag named “mailto” that means there’s an email address to grab and sell to spammers. There are several WordPress plugins available that obfuscate email addresses in the raw code, but still makes them visible to the user’s eye. Many web developers don’t do this – the result, is more, and more spam mail in your inbox.

Accidents happen, and sometimes you’ll lose website content by accidental deletions, overwrites, tech glitches, etc. I use a module called Updraft Plus that does automatic website backups at regular intervals, and uploads them to either the owner’s Google drive, or a free Dropbox account I set up for the website. One thing better than crying over spilt milk is to have a full backup quart in the fridge.

Does keeping track of login info leave you frazzled at times? Welcome to the crowd. I try to use the Keep it Simple approach as much as I can. That’s why I include a Manual WITHIN your site, that only those with Administrator rights can access. It contains important info about your site, things helpful to your webmaster, and lists of important logins used for the site and online marketing, such as Dropbox, Yelp, Search Analytics, etc. You can easily add/modify info as time goes on

I use a module called Wordfence to keep an active eye on malicious attempts to compromise the site. It does “live” checking of user visits, and file changes, and raises red flags (or blocks when needed) to minimize the chance that hackers can break in.
I also create a custom login url, so that the “standard” one used by WordPress is off limits.

Additional Custom Options

If you have a business type that requires – or can benefit from – some extra functionality, take a peek at additional options by hovering or tapping one of the market segments below.

Accommodation
Hotels, b&b’s, campgrounds …

Automotive
Auto dealers & service …

Dining & Takeout
Restaurants, pizza, cafes …

Non Profit
Churches, societies, organizations …

Real Estate
Houses, land, commercial …

Retail
Stores, crafts, gifts …