May 2013 - Zen Den Web Design - Creativity and Security in One Place

eCommerce Website Pricing

Fact is there are a lot of options to consider when budgeting for the design and development of an eCommerce website, it can be a bit confusing. Websites are not unlike cars and eCommerce website design prices can range from $5,000 – $500,000+. At the lower end of this price spectrum you can expect your eCommerce website to have the design and performance of a 2002 Honda Civic. A BMW M3 will set you back 60k and a Bentley Continental Super Sport will run you close to 300k. One option or the other may be better suited for your business.

An important question I ask a potential client is “what are your goals?” Think about your sales and traffic goals and then consider what budget would be realist to achieve those goals. The eCommerce website cost will be primarily affected by features needed to support sales and traffic goals. For example, if you want to do $50,000 a year in sales, you can probably find an eCommerce website for around the $5,000 range that will suit your needs. If you’re looking to do a $1,000,000 in sales, and many people are, then the cost of your eCommerce website will increase to accommodate additional features and functionality. Remember, starting an eCommerce website is the same as starting any other business; it takes capital to be successful.

What affects the cost of an eCommerce website?

eCommerce Functionality & Custom Development

The basics of an eCommerce website include: categories, product pages, add to cart, checkout, confirmation emails, and basic sales and customer management. These are standard features and they really don’t drive up the cost unless you desire to customize them somehow, which most customers do. Just keep in mind that the less you spend the less customizations you can make to the commerce system.

Custom eCommerce functionality is usually the greatest cost in a project and the success of your website often hinges on these customizations. For example, we had a client that wanted to integrate their Magento store with Quickbooks, Salesforce and a 3rd party drop shipper which handled all of their orders. These are not off the shelf features of commerce websites and they do add a level of complexity which needs to be accounted for.

Stock levels are very important to some of our clients and we have synced the website database with an in-house inventory management system. These additions seem small but they definitely run up the price of the website, on the other hand they eliminate hours of paying employees to do this work, eliminate a lot of headaches and ultimately reduce the number of unhappy customers. So, Create a list of all eCommerce features you anticipate needing and even add a wish list so that all bases are covered. We can discuss this list when we meet and get a more accurate picture of the budget for you site.

eCommerce Design

Now that we’ve discussed functionality, we have to consider design. As the saying goes; you don’t get a second chance to make a first impression and this impression is everything so it’s important that your branding and identity match your sales expectations. An amateur looking website will convert visitors into customers at a much lower rate than a professionally branded website. Which brings up branding. If you have an established brand, the website should reflect this and If you don’t then perhaps the time has come to consider a budget to create your company identity. On the web you’ll get one shot to impress. Many eCommerce site owners understand this and budget appropriately to build and design a site that sells based on the way it looks.
The low-cost route involves using a pre-designed template. What this means is the design is 95% complete we just add your content and logo. This is not suggest for serious eCommerce websites, but it may fit your needs if you are working on a shoestring budget.

eCommerce Marketing and SEO

Optimizing your store content is a huge benefit and could save you a good amount of money down the road and will also make any future SEO efforts much easier. Proper SEO and marketing features built into your website will not result in immediate page 1 rankings, but it is a step in the right direction.

eCommerce Website Design Companies

Some web design companies are based in the US and some are overseas. Often companies have a U.S. address but all work is performed offshore. Remember, you’ll usually get what you pay for. A higher priced company often provides quality and reliable work, while going overseas to save money may be enticing it often results in a lot of headaches. Be sure whoever you choose is reliable, has an office and is easily accessible when you have questions during the development phase and after the website is completed.

The Most Common Image Formats in Web Design Are:

Jpeg

Jpeg is a commonly used method of lossy (meaning you lose some data every time you resave the image) compression for digital images. Jpeg is typically best for photographic images, large or small.

Png

Png’s are a raster graphics file format that supports lossless (meaning the image retains all data regardless of saves or transfers) data compression. Best for complex design elements that require a transparent background such as a logo.

Gif

Gif’s can come in handy for small elements with a limited number of colors. Gif’s support animation and transparency as well, but typically are not a good choice for photographic images. It is possible to make a high quality gif, but typically the size does not end up web friendly.

So let’s look at an example of how to reduce the file size in Adobe Photoshop:

1. We have an image that we would like to use in a blog post. The high resolution image measures 1624×1080 px and is 72dpi (web screen resolution, if your image is 300dpi it is a print image and is too large for the web), and it weighs 900kb (way too large). If we had 20 of these images around the site that is slightly under 20mb and will drastically slow down the site. You can check this information by control+click and select “Get Info” (On Mac), or right click and select “Properties” (OnWindows):

2. Next, open the document in Photoshop, and go to Image > Image Size… That will bring up the image size settings. We need to first check and make sure the resolution is set to 72 and that all three of the lower boxes are checked (this will prevent distortion):

3. Next, we know that this will be a featured image within the blog post that never reaches the full screen width so we know that the image does not need to be more that 750 pixels in width. Change the width to match your needs. Doing this already cuts the file size in half.

4. Next, go to File > Save For Web And Devices. This will bring us to the web optimization menu:

Zen Den Web Design Web Design Agency San Francisco

5. Next, ensure that you are viewing the image at 100% zoom in the left box. Since this is a photograph we will save this image as a jpeg:

6. Next we want to manually adjust the quality of the image. In our case we are working with a high quality image so we have plenty of room for downsizing. Adjust the quality slider to the lowest point before you can personally see pixelation. In our case this number was 50:

7. Next, hit save. Make sure the format is set to “Images Only”, and set the settings to “Default Settings.
In our case we were able to take the image all the way down from 900kb to 60kb. Compound this savings over 20 images and we end up saving 16.8 MB which intern drastically boosts site speed.

To optimize PNG images we recommend simply using Tiny PNG.

eCommerce Website Design Prices