Preparing images for webpage

Before you put your images in the web, have your image ready and well optimized using some image editing software. This can save you lot of time.

There are tons of image editing software available online.  Let us list out few of the highly used software below:

• Adobe Photoshop
• Corel Draw
• Paint (one that comes with windows)

Few free software and web based applications for image editing are:

• Photoscape
• GIMP
• Paint.Net
• Picnic(web based)
• Splash up(web based)
• Adobe Photoshop express(web based)
• Aviary image editor
• Pixon comic maker.

We will have tutorials on each of these softwares once we are done with basic web design.

Adjusting width and height:

• If dimensions of image are too big to fit in browser, user will have to scroll the image. This abates the impact of image. In fact, user may just close the window if he sees something like this.
• Reducing the dimensions reduces the overall size of image; which leads to faster loading and better SEO.
• Remove the unwanted part by cropping the image. This also reduces the size of image.

Image compression:

Few image editors provide you the option to compress the image before you save your image. Compressing the image may reduce its quality. But improve loading time. Judge yourself and adjust it for best user experience.

Number of colors in image:

More the number of colors more will be the size. You can see image and different file formats and decide yourself. According to requirements you can choose from variety of formats. To know more about image formats used on web click here.

Alternative text

If due to some reason your image fails to load or if the users has disabled image in the browser he/she will see the blank space corresponding to the image. So alternative text comes to rescue. We will discuss about how to add alternative text in later tutorial. Presently just understand that when image fails to load you see that text in place of image.

Next post will be about INSERTING IMAGE IN WEB PAGE!