Geoff Duffell

What tools do I need to edit my website?

What tools are required? Not much actually.

But there are some ways to use them that will make a big difference to your final result.

Let’s run through them.

 

Text

Most people start their writing with a word processor program, which is handy if it gives you access to an Aussie dictionary (or whatever the language of your website’s audience).

That will also give you a grammar checker – although there’s a division about whether that tool is a help or a bother.

Keep in mind that the best writers also do a manual proofread to pick up those dropped letter errors (like “and” appearing as “an”) and other spelling traps.

 

Some writing tools to help out

When the right word is stuck on the tip of your tongue: thesaurus.com.
To improve user readability, there’s a suite of analytical tools at juicystudio.com.
For grammar and rephrasing of ideas there are also online tools of which Grammarly is the best known with some free tools and a paid service as well.

 

Images

You will have some image-editing tools with your website but the pros seldom use them. They are more likely to do their image editing in dedicated image software.

By way of background, images are the one of the worst ways to throttle back your website’s loading time and frustrate your visitors. With modern phones and cameras, typically producing 8- to 20-megapixel images, that’s going to be a real problem for your website visitors if you don’t reduce the image size. It’s even worse if they’re mobile and getting patchy reception.

There’s two things about image size. One is the pixel dimension and the other is the image compression. In the first instance, it pays to crop back or scale down your image to the size it needs to appear on the website.

The first picture of the boy and teddy bear image shows an image that has been resized down from the camera original. Using an image editing program, the original 2912 x 2166 pixel image has been re-saved as a 500 x 372 pixel image.

In terms of kilobytes, resizing brought the image down to one-tenth of its original kilobyte size, and that corresponds with ten times faster image loading. (The original is a 6 megapixel image which, straight from the camera, had a file size around 3MB – or 3,000 kB.)

We’ll come to the tools you could use very shortly.

 

Resizing the image is usually the most effective thing to do

 

Cropping the image is a way of keeping your subject material but further reducing total image size.

 

Image cropped: image size reduced and focus given to main elements of the picture

 

Image compression techniques reduce the image quality, but only to the point detectable by your eye. By reducing the amount of image definition, it’s not uncommon to further reduce for kilobyte size by half. This brings our image size down to 30kB, a mere fraction of the original.

Compression is best left until last, after your other resizing changes.

 

Compression works by reducing the amount of definition in an image. This one has been badly overdone!

 

The last image is a demonstration of  excessive compression. The sharp definition between objects has now become blurred and the total number of colours used has also been reduced. We should aim to reduce the level of definition without obvious changes to the image. For screen images, this reduction will much greater than for print.

So, how do you compress images?

Using software (see below), you start with your image and dial down the quality percentage. You might start with 50% and compare your revised image with the original. Look particularly for

Once you’ve seen a few of these you will know what to look for.

After your first attempt, you can dial up or down the quality percentage to improve the image or compress further.

Some people find this quite fiddly and some are happy to do all the steps in the same software. So I will suggest an alternative compression method soon shortly.

 

Image tools

There are any number of photo editing programs available and two good ones are IrfanView and Paint.net.

Here is a guide to image resizing in IrfanView and another for Paint.net. Both use illustrations to demonstrate the image reduction processes.

There are also a number of online image editing websites where you can work on the image in your browser; however, my preference lies with the downloadable software.

Image reduction techniques are neither widely understood nor well implemented by website editors. So once you start following these three techniques (resize, crop and compress) you will very quickly be elevated to the top echelon of image editors.

And your visitors will be grateful that your website images load quickly.

 

The no-fuss way to compress images

If you have resized and cropped your images, you might choose to take an automated approach to image compression. There are a number of online tools that efficiently compress images without losing any sharpness.

My favourite is tinyjpg.com and there are others.

When you run an image through these tools you should see image size (in kilobytes or kb) substantially reduced and any differences between the two images – if you can see them at all – should be difficult to detect.

 

To summarise – you don’t need many tools at all

No indeed!

And using these techniques will help you produce great copy and make the your visitors’ website experience much more rewarding.