Friday, 4 May 2012

How to use less bandwidth

I'm not a very technical sort. I find my way around computers ok. But it was a big challenge when I first learnt how to build a website, and I'm still learning as I go along.

My Homespun Gifts website uses a free hosting plan which only allows for 100MB bandwidth per month. That means if a lot of people visit my site and look at my pictures all within the same month, the website crashes and stays crashed until the end of the month. I didn't think it'd be a problem until the site got more popular, but it happened within the first month. When I looked at my pictures I realised why - it would only take 3 people looking at the full-size version of each image to bring the site down.

I thought I would have to move the whole shop onto Folksy, sacrificing a few items along the way since Folksy doesn't allow anything that isn't handmade, like my oil burners or relaxing music. Luckily Richard came to the rescue!

He told me how to put all of my images onto Facebook and then make them appear on my site without using up my bandwidth. I'm basically stealing Facebook's bandwidth, but if they didn't allow that then they wouldn't give access to direct links, right?

This is how to do it:

  • Make an album full of your images on Facebook. Tick the box that say "high quality" while uploading and set the privacy to "Public". The images can be on your personal profile or your business Page.
  • If you don't already have it, download the Google Chrome or the Firefox browser. This doesn't work in Internet Explorer.
  • Using the Chrome browser, look at the image, right-click on it, and choose "Copy Image URL". Or using the Firefox browser, look at the image, right-click on it, choose "View image" and copy the URL from the address bar at the top.
  • In your website code, find the bit that says <img src="yourimagenamehere.jpg"> (or similar) and paste the URL from Facebook inside the quote marks.
  • Be careful not to accidentally delete the quote marks or any of the other bits of code.
If you hadn't originally specified what size the images should be, you might find that the size changes. You can specify the size by adding this to the code: height="200" (put your own number in) or width="200". You only need one, since the other one will be automatically worked out. It should look something like this:
<img src="reallylongURLfromfacebook.jpg" height="200">

Thanks to Richard for the tip!

Hollie x

No comments:

Post a Comment