Beginners Guide to Editing Images for the Internet

I have a question for you, have you ever clicked a picture of an amazing job you did? Maybe the pipefitting you did was pure perfection, or the ductwork deserved it’s own hall of fame, or your wiring job was simply… electric (sorry, I couldn’t resist the pun ;p). And you probably shared it on social media. Or if you’re an independent business owner, you possibly added it to your website. But, have you ever faced the issue where either the image looks to blurry, or it doesn’t fit properly, or that it takes a long time to load? Then you’re not alone! That’s why we created a quick and easy guide on how to edit images for the internet.

This article will teach you how to:

  • Resize Your Image

  • Crop Your Image, and,

  • Compress Your Image

HOW TO RESIZE YOUR IMAGE

reszie-1

o   WHAT: images are made of tiny pixels (mentioned under image dimensions as width px X height px) a higher pixel quantity means an image that’ll show more clear details when zoomed in. When you’re resizing an image, you’re manipulating the pixels to either increase or decrease.

o   WHY: You might need to do this if certain media inputs have maximum/minimum size restrictions. Ex. the optimal size for a Home Stars profile picture is 600 px X 600 px

o   HOW: Use a free online tool like PicResize or Canva to resize your images. Simply upload your picture, select the size you want and watch the software do its magic. Or check out this image to learn more.

  1. Select an option to resize. The best option is custom especially if you’re working with size restrictions (for example, Facebook page images)

  2. (Optional) This is only available if you select the “custom” option in Step 1. Select the width and height you need the image to be.

  3. Select the format in which you would like to save an image. For web design, png is your best option.

  4. Click on the “I’m done…” button to make the software resize the image.


HOW TO CROP AN IMAGE

o   WHAT: Cutting out excessive or unwanted outer areas of an image.

o   WHY: This helps you have a focused image

o   HOW: You can crop an image directly using your image viewer on your computer. Just click the (crop) sign and use the crop marks to crop the image to its desired size. Make sure you hit save after! Check out this image below to learn more!

crop-1

 HOW TO COMPRESS AN IMAGE

o   WHAT: compressing is reducing the size of an image in bytes.

o   WHY: A smaller sized (compressed) image means you can save more images in a given memory size. This is extremely necessary for your website. A bigger sized image uses up a lot of data and takes a long time to load. So, the smaller your images are, the more efficient it’ll be…this is important because Google tracks your load speed when they rank your site.

o   HOW: Use a free online tool like TinyPNG. Just upload the image and the software will take care of it.

2.png

I hope you find this article helpful. If you have any questions or comments, or suggestions for our next article, leave a comment below!


Written By,

Mahima Jhalani

Business Success Associate