Is a picture worth a 1000 words?.........

build a websiteWhen you are talking about websites - if they're well placed, good quality, well optimised and in the correct format, then absolutely YES!

Site navigation, interactivity, content, delivery, and a multitude of other issues affect a user's perception of a website. However, images are probably the most obvious part of a great website build. Imagine a website, or other media such as magazines, newspapers or TV or billboard adverts without any images……..!?

Good quality, carefully compressed images, can add to the appeal and instructive qualities of a website. Equally, poor quality images, which take far too long to load can affect peoples perception of the entire site and indeed the company or business behind it. How often have you opened a web page and found yourself waiting for ages for the images to load or worse.. got impatient and gone elsewhere?

Your Reason8 website editor is designed to compress large files. However, we recommend using an image-editing programme to resize your images to roughly the correct height and width, then compressing their file size and saving to the correct format before uploading to your webpages to reduce the load time and maintain the best possible quality.

As a web builder, choosing the correct image for the job is an important part of the design. The first area to look at is FORMAT. One of the more common mistakes, which lead to excessive images sizes, is people using the wrong file format for the job. In general Gif images tend to be good for simple illustrations such as logos, cartoons or animated images whereas JPEG images are generally chosen for complex images or photographs. To go into this a little further, here are the three main contenders:

GIFs — Graphics Interchange Format.

build a websiteGifs should be used for; simple line drawings, shapes, small icons, graphics with large blocks of a single colour, i.e. nothing too complex. GIFs are 'loss-less', which means they does not lose quality causing pixilation or blur. The GIF format is a popular choice for the Internet as they can be compressed to reduce the file sizes of images without losing image quality. GIFs can also be animated, another reason for their popularity. Most animated banner ads are GIFs. You’ll need an animation program to make your own animations. GIFs also allow transparency, which means you can set images to allow the background colours of your web page to show through the image, so appearing to be a part of your website background rather than placed on top - as you can see here.

JPEGs - Joint Photographic Experts Group

build a websiteJPGs should be used for photographs. The JPEG format is capable of displaying millions of colours and the complex blends of hues that occur in photographic images. Compression is achieved by ‘forgetting’ certain details about the image, hence the loss of quality. For the Internet, a compression setting of about 60% will result in the optimum balance of quality and file size but it is worthwhile playing around with the compression % to get your image just right.

PNG — Portable Network Graphics.

This third and lesser known format was invented for reasons, which are now redundant, namely, in response to a now expired licensing scheme. The creators of PNG were aiming for a format, which could beat the GIF in every way. You can achieve noticeably smaller file sizes with PNGs and they also save their colour data more efficiently. The PNG format has the same transparency qualities but Gif still outperforms PNG where animations are concerned, so stick to Gif for your animated pics. Using PNG-8 instead of GIFs will however lower the file sizes of your images so they are a good choice of format for all your simple static images.

If you don't already have an image-editing programme such as Paint shop or Photoshop, Google offer a super little programme called Picasa. You can download it free from:  

Once you have prepared  your images with the best format and size for your webpages, you can upload them onto your pages using the RED "Insert Image" button in your website editor. In the Image Properties window, you can then "fine tune" the size, align; left, middle or right, add a choice of borders and set the space around your image so that it sits perfectly within the text of your page.

build a website

You can go back to Image Properties as often as you like to make changes by simply right clicking the image and choosing "Image Properties" from the drop down menu. This ability to go back at any time to "fine tune" can be found in several areas of the Reason8 editing system and is just one of many innovative features, which give you the control and tools to build a first-class website.

build a websiteWe'd love these blog pages to become a handy forum for all Reason8 Web Builders, so please add your comments or questions and let's get chatting!!

Comments (Comment Moderation is enabled. Your comment will not appear until approved.)
This blog is running version
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','','ga'); ga('create', 'UA-2227312-2', 'auto'); ga('send', 'pageview');